不能将 cypress visit 命令与 create react app 一起使用

Cannot use cypress visit command with create react app

我几天前开始使用 Cypress,但我已经在使用一个简单的命令,例如 visit

为了弄清楚会发生什么,我创建了一个经典的 create react 应用程序

yarn create react-app cypress-test-react

然后是 cypress 依赖项

cd cypress-test-react && yarn add cypress --dev

因为我正在使用 Linux,所以我也 运行 这个命令:

apt-get install libgtk2.0-0 libgtk-3-0 libgbm-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 libxtst6 xauth xvfb

我已经实现了我看到的东西 here

describe('Create react app home', () => {
  beforeEach(() => {
    cy.request('http://localhost:3000').then((response) => {
      if (response.isOkStatusCode) {
        cy.visit('http://localhost:3000');
      } else {
        cy.visit('http://localhost:3000');
      }
    });
  });
  it('renders learn react link', () => {
    cy.contains('Learn React');
  });
});

与此柏树json:

{
  "failOnStatusCode":false,
  "chromeWebSecurity": false,
  "component": {
    "testFiles": "**/*.test.{js,ts,jsx,tsx}",
    "componentFolder": "src"
  }
}

最后,我在 运行ning yarn cypress open-ct --config-file cypress.json

之后遇到了这个问题

我希望在我的本地环境中缺少一些包,但我找不到它是什么。

如果你们中的一些人已经解决了这个问题,我将非常感谢您的帮助 :)。 我可以提供更多信息

这是我的本地配置:

OS: Ubuntu 18.04.4 LTS x86_64
yarn: 1.22.4
node: v15.14.0

您可以尝试在 cy.request() 中传递 failOnStatusCode: false。如果没有获得 2xx 或 3xx 响应代码,这不会使您的测试失败。

describe('Create react app home', () => {
  beforeEach(() => {
    cy.request({
      url: 'http://localhost:3000',
      failOnStatusCode: false,
    }).then((response) => {
      if (response.isOkStatusCode) {
        cy.visit('http://localhost:3000')
      } else {
        cy.visit('http://localhost:3000')
      }
    })
  })
  it('renders learn react link', () => {
    cy.contains('Learn React')
  })
})

基本上,yarn cypress open-ct ... 用于组件测试。

您不能在组件测试中执行 cy.visit(),它用于 e2e 测试。

您想测试哪种方式 - 整个页面,还是单个 React 组件?

如果是e2e,使用yarn cypress open