Question

我目前正在尝试使用赛普拉斯模拟客户端服务器响应模式。

我想：

当我单击“保存”按钮时，使用cy.route捕获设置数据的呼叫
使用cy.route的onResponse参数将响应写到文件中
使用文件的内容作为我对同一个cy.route调用的响应

当前，如果我包含cy.writeFile或什至console.log（cy.readFile（testFile））命令，当我使用cy.wait调用路由时都会出错。

错误：

application_actions.js:84 Uncaught (in promise) TypeError: Cannot read property 'statusText' of undefined

如果我从onResponse块中删除了cy.writeFile或readFile，则代码可以正常执行。

这是我正在做的事的一个例子：

beforeEach(() => {
      //call fixture file 
      cy.fixture('newApplication.json').as('newApplication')
      cy.server()
      //This first route is used when I load a page that contains application data. 
      //This works fine
      cy.route('GET', 'applications/*', '@newApplication').as('getNewApplication')
      //This route is hit when I click a Save Button to save updates to my application data
      cy.route({
        method: 'PATCH', 
        url: 'applications/update/*',
        onRequest: (xhr) => {
          cy.writeFile('cypress/fixtures/newApplication.json', xhr.request.body.application)
          },
        response: '@newApplication'
      })
      .as('updatedApplication')
      cy.visit('/admin/review_application/1')
      cy.wait('@getNewApplication')
      .its('response.headers')
      .its('content-type')
      .should('contain','application/json')
    });

it.only('Saving Restaurant Name changes page header text', () => {
      //Alter some application data
      cy.get('#Restaurant\\ Name')
        .clear()
        .type('Header Update Test');
      cy.get('#name-buttons\\ Accept').click();
      //Click save button to save data change
      clickSaveButton();
      //hit updatedApplication route when data is saved
      cy.wait('@updatedApplication').should('have.property','status',200)
      //Test fails on above wait every time
      cy.reload();
      cy.wait('@getNewApplication')
      cy.get('#Restaurant\\ Name').then($newText => {
          //compare text values to ensure the data change was saved
          cy.get('.MuiTypography-h2').then($headerText => {
          expect($headerText).to.have.text($newText.prop('value'));
        });
      });

似乎cy.route是完全同步的，所以也许这不可能，或者我做错了事。

任何帮助将不胜感激！

Answer 1

我认为您的方法正确，只是第二次致电更新得太早了。我建议您尝试以下方法：

从您的beforeEach街区中删除路线更新
使用cy.wait，然后在点击操作后添加它，例如：

cy.wait('@getNewApplication').then((xhr) => {
  cy.writeFile('cypress/fixtures/newApplication.json', xhr.request.body.application)
  cy.route({
   method: 'PATCH',
   url: 'applications/update/*',
   response: '@getNewApplication'
 }).as('updatedApplication');
})

在我的项目中对我来说很好。

提示：如果可行，您可以将更新提取到方法中，以提高可读性。

Answer 2

我无法让Cypress写入相同的Fixture文件，然后回读更改后的数据。即使我添加了第二个cy.fixure调用来尝试拉入修改后的文件。

相反，我最终写了一个新文件，然后设置了读取它的新路径。

clickSaveButton(); cy.wait('@updatedApplication').then((xhr) => { cy.writeFile('cypress/fixtures/updatedApplication.json', xhr.request.body.application).then(() => { cy.fixture('updatedApplication.json').as('updatedApplication') cy.route('GET', 'applications/*', '@updatedApplication').as('getUpdatedApplication') }) }) cy.reload() cy.wait('@getUpdatedApplication')

感谢您帮助我到达这里！

是否可以在cy.route操作中运行cy.writeFile或cy.readFile命令？

2 个答案: