等待接口返回
<h1>1. 页面等待接口数据</h1>
<p>简述:使用intercept定义需要等待的接口,+ 使用wait('@')</p>
<p>详细描述:当页面数据加载依赖于接口返回时,需要等待一个或多个接口返回,那么使用intercept定义接口信息,在visit请求页面后,使用wait()来等待接口返回,可设置timeout来控制页面正常需要的时间</p>
<pre><code class="language-javascript">loadPage(orgId=1, language="zh_CN") {
cy.intercept({
method: "POST",
url: "/ecp-api/apphub/template/directory*",
}).as('apphubAppList');
let options = {
url: `/organization/${orgId}/app-directory`,
onBeforeLoad (win) {
Object.defineProperty(win.navigator, 'language', {
value: `${language}`
});
},
timeout: 10000
}
cy.visit(options);
cy.wait('@apphubAppList', {timeout: 10000});
}</code></pre>
<p>注:intercept可定义返回数据,结合mock使用等,参见官方文档</p>
<h1>2. 先打印再比较</h1>
<pre><code class="language-javascript"> cy.intercept({
method: "POST",
url: "/ecp-api/apphub/instance/create*"
}).as("createInstance");
cy.get('.ecp_app_publish_info_operations > .ant-btn.ant-btn-primary').click()
.wait("@createInstance")
.its('response.body').then(body => {
let responseBody = JSON.stringify(body)
cy.log("create instance response:" + responseBody).then((body)=>{
expect(body.status).to.eq(200);
Cypress.env('templatePublishInstanceId', instanceId)
})
});</code></pre>
<h1>3. Reference</h1>
<p>[1]. <a href="https://docs.cypress.io/api/commands/intercept">ref1</a>
[2]. <a href="https://glebbahmutov.com/blog/why-cy-log-prints-nothing">ref2</a></p>