如何使用 Nuxt + Cypress + CircleCI?

How to use Nuxt + Cypress + CircleCI?

我想做什么?

我想 运行 赛普拉斯在 CircleCI 上为我的 Nuxt 项目进行测试

我的问题是什么?

在本地模式下它工作正常,但我无法让它在 CircleCI 中工作

我已经尝试过 CircleCI orb cypress-io / cypress @ 1.28.0,但仅使用 wait-on 测试在 npm run dev 完成之前开始。

 - cypress / running:
      requires:
        - ramp up
      start: npm start
      wait: 'http: // localhost: 8181'
      cache-key:> -
        v1-dependencies - {{checksum "package.json"}}
      filters:
        Marking:
          only: /.*/
        branches:
          only: /.*/

CircleCI 也没有启动应用程序,我不知道为什么:(

我认为这是怎么回事?

我试过这个命令 bash curl -o /dev /null -u localhost:8181 /login -Isw '%{http_code}\n'localhost:8181 /login 即使 Nuxt 正在编译它们 return 代码 200 所以我认为 Nuxt 成为可用的路径,即使它没有编译。

帮助

有谁知道任何配置了 Cypress 和 CircleCI 的 Nuxt 项目让我看看吗?

此打印表示访问已成功执行但断言失败?

import { Response } from 'miragejs'

context('Login', () => {
  it('should login after button click', () => {
    cy.login({
      username: 'titular@ampa.ro',
      password: 'password',
    })

    cy.url()
      .should('eq', 'http://localhost:8181/')
  })

  it('should return invalid credentials', () => {
    cy.mirage((server) => {
      server.post('session', () => new Response(400, {}, {
        errorCode: 'credential_invalid',
        type: 'badRequestError',
        errorMessage: 'Credential invalid',
        errors: {},
      }))
    })

    cy.login({
      username: 'titular@ampa.ro',
      password: 'password',
    })

    cy.get('body').should('include.text', 'Credenciais inválidas')
  })
})

我在 Cypress 的开发者体验团队工作。

我们最近发布了 CircleCI which details the solution deployed in the Cypress Real World App 存储库指南。

我可以解决我的问题

那是我在 config.yml 上 运行 e2e 测试的 CircleCI 工作:

test-e2e:
docker:
  - image: cypress/base:10
parallelism: 2
steps:
  - checkout
  - restore_cache:
      keys:
        - cache-{{ checksum "package.json" }}
  - run:
      name: Install dependencies
      command: npm ci
  - run: npm run cypress:verify
  - save_cache:
      key: cache-{{ checksum "package.json" }}
      paths:
        - ~/.npm
        - ~/.cache
  - run:
      name: Run Nuxt App
      command: npm run dev
      background: true
  - run:
      name: Run E2E
      command: npm run cypress:run

那是我在 package.json:

上与端到端测试相关的包脚本
"dev": "nuxt",
"cypress:open": "cypress open",
"cypress:run": "cypress run",
"cypress:verify": "cypress verify",
"test:e2e": "start-server-and-test dev 8181 cypress:open"

最后,这就是我的 cypress.json 更改以使其有效:

"defaultCommandTimeout":  60000,

现在,我的端到端测试 运行 非常好!