使用 Cypress 和 React-testing-library 设置 CircleCI

Posted 2023-04-15

【中文标题】使用 Cypress 和 React-testing-library 设置 CircleCI

【英文标题】：CircleCI setup with Cypress and React-testing-library

【发布时间】：2021-07-18 01:41:51

【问题描述】：

我想使用 CircleCi 来运行我的 Cypress 和 react-testing-library 测试，因为我想测试我的 react 应用程序。 在本地环境中我会运行（工作正常）：

yarn run test 执行我的 react-testing-library 测试 yarn cypress run 执行 Cypress 测试

现在，我找到了有关如何制作 circleci config.yaml 的资源，但没有任何效果。供参考link1、link2、link3、link4、link5

某些测试失败的原因是：error cypress@7.1.0: The engine "node" is incompatible with this module. Expected version ">=12.0.0". Got "10.24.1" 或错误兑现或其他原因。跑了 20 次后我一无所知，请有人帮帮我吗？

当我浏览资源时，我认为这应该适用于赛普拉斯测试，但它没有。

version: 2.1
orbs:
  cypress: cypress-io/cypress@1
workflows:
  build: 
    jobs:
      - cypress/install:
          build: yarn run build # run a custom app build step
          yarn: true
      - cypress/run:
          requires:
            - cypress/install
          parallel: true # split all specs across machines
          parallelism: 4 # use 4 CircleCI machines to finish quickly
          yarn: true
          group: 'all tests' # name this group "all tests" on the dashboard
          start: yarn start # start server before running tests

【参考方案1】：

对于那些稍后将搜索此问题的人。我克服了错误：

error cypress@7.1.0: The engine "node" is incompatible with this module. Expected version ">=12.0.0". Got "10.24.1" 不使用 orb 而是使用 workflow -> jobs -> steps fsevents not accessible from jest-haste-map 使用 yarn 而不是 npm 最后，您的一些错误可能来自您的应用程序（至少在我的情况下是 react 应用程序）从 .env 文件中获取配置，该文件未上传到 github，因此未检出到 CircleCI docker，因此在测试期间该应用程序将无法运行。

我正在使用的工作解决方案是：

version: 2.1
jobs:
  run_tests:
    docker:
      - image: cypress/base:12
        environment:
          # this enables colors in the output
          TERM: xterm
    working_directory: ~/portalo
    steps:
      - checkout
      - run:
          name: Install project dependencies
          command: yarn install --frozen-lockfile
      - run: 
          name: Compile and start development server on port 3000
          command: yarn startOnPort3000Linux
          background: true
      - run: 
          name: Wait for development server to start
          command: 'yarn wait-on http://localhost:3000'
      - run: 
          name: Run routing tests with react-testing-library via yarn test
          command: 'yarn test ~/portalo/src/tests/react-testing-library/routing.test.tsx'
      - run: 
          name: Run e2e tests with Cypruss via cypress run
          command: $(yarn bin)/cypress run

workflows:
  version: 2.1
  build_and_test:
    jobs:
      - run_tests

注意：必须添加wait-on。在我的情况下，yarn add wait-on

注意 2：所有步骤都必须在一个单独的步骤中才能显示所有已安装的软件包。可以使用保存/恢复缓存来发推文。