Cypress学习文档

沉淀cypress对常用html组件定位的文档


等待接口返回

<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 &gt; .ant-btn.ant-btn-primary').click() .wait("@createInstance") .its('response.body').then(body =&gt; { let responseBody = JSON.stringify(body) cy.log("create instance response:" + responseBody).then((body)=&gt;{ 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>

页面列表

ITEM_HTML