Cypress 10의 여러 환경에서 테스트하는 방법

개요

Cypress 10이 출시되면서 구성이 새 파일cypress.config.ts(또는 아직 Typescript를 사용하지 않는 경우 .js)로 이동했습니다. 동일한 테스트 코드로 여러 환경을 테스트할 수 있도록 여러 환경을 구성하고 baseUrl와 같은 값을 설정하는 방법을 이해하는 것은 혼란스러울 수 있습니다. 일부 환경에 대해 일부 테스트만 실행하는 것도 유용합니다. 이 에세이에서는 우리 팀이 이를 달성하는 방법을 살펴보겠습니다. 이것은 결코 유일하거나 가장 정확한 방법이 아니므로 내가 변경해야 한다고 생각하는 부분이 보이면 트위터로 알려주세요. 이 문서에서는 e2e 테스트 구현만 다루고 Cypress 10의 새로운 구성 요소 테스트 기능은 설명하지 않습니다.

패키지 관리자로 Yarn을 사용하므로 NPM을 사용하는 경우 터미널에 입력하는 내용을 설명할 때 yarn를 npx로 대체하여 비슷한 결과를 얻을 수 있습니다.

우리는 qa 및 master 의 두 가지 환경을 테스트하고 일부 환경적 차이로 인해 master 에 대해 스모크 테스트로 간주되는 항목만 실행하고 qa 에 대해 더 많은 데이터 중심 테스트를 실행하려고 합니다. 설정에서 master는 dev 환경과 더 비슷할 수 있으며 변경이 더 많고 안정성이 덜 가정될 수 있습니다. 한 가지 알아야 할 중요한 사항은 qa를 기본 환경으로 간주한다는 것입니다.

스크립트

package.json 개체에 여러 테스트 스크립트를 정의한 scripts 파일에서 모든 것이 시작됩니다.

{
  "scripts": {
    "open:qa": "cypress open --e2e --browser chrome",
    "open:master": "cypress open --e2e --browser chrome --env master=1",
    "test:smoke": "cypress run --browser chrome --headless --env master=1 --spec 'cypress/e2e/**/*.smoke.cy.ts'",
    "test:regression": "cypress run --browser chrome --headless --spec 'cypress/e2e/**/*.ts'"
  },
}

여기서 주목해야 할 한 가지 중요한 점은 open:master 및 test:smoke 스크립트가 모두 --env master=1 전달되었다는 것입니다. 이에 대해서는 나중에 살펴보겠습니다. 이렇게 하면 기본적으로 구성에서 이 환경과 기본qa 환경을 구분할 수 있습니다. 이것은 완전히 사용자 지정 환경 변수이며 --env 플래그와 함께 스크립트에 전달하여 원하는 환경 변수를 만들 수 있습니다. 지적할 가치가 있는 또 다른 점은 test:smoke 스크립트는 이름이 scheme *.smoke.cy.ts 인 사양만 실행하는 반면 test:regression는 이러한 파일과 체계가 *.spec.cy.ts 인 모든 항목, 즉 모든 사양 파일을 실행한다는 것입니다.

구성

cypress.config.ts 파일에서 조건 논리( if (config.env.master) )를 사용하여 --env master=1 플래그를 기반으로 시작할 구성을 선택합니다(또는 표시되지 않는 경우 기본적으로 qa 환경 구성으로 설정). 이 접근 방식은 고유하게 명명된 환경의 수에 관계없이 확장할 수 있습니다.

e2e: {
  setupNodeEvents(on, config) {
    if (config.env.master) {
      return {
        baseUrl: "<master env baseUrl>",
        env: {
          env: "master",
          auth_username: "<email>",
          auth_password: "<password>",
        },
      };
    } else
      return {
        baseUrl: "<qa env baseUrl>",
        env: {
          env: "qa",
          auth_username: "<email>",
          auth_password: "<password>",                  
        },
      };
  },
},

master 환경 변수의 존재 여부만 확인한다는 점에 유의하십시오. 그것의 값은 1 일 필요는 없습니다. 그것은 무엇이든 될 수 있습니다. 우리는 그것이 존재하는지 확인하는 것뿐입니다. 또한 baseUrl는 env 객체 외부에서 반환되어야 합니다.

런타임

Github Actions 워크플로 파일 또는 명령줄에서 다음과 같은 항목을 실행하여 선택한 환경에 대해 테스트를 실행할 수 있습니다.

yarn run open:qa

또는

yarn run test:smoke

이러한 명령은 package.json 파일에 정의된 스크립트를 호출하고 환경 플래그를 삽입하는 방법에 대해 설명한 전체 프로세스를 시작한 다음 해당 플래그를 읽어 작업할 환경 구성을 선택합니다. cypress.config.ts 파일.

바라건대 이것은 누군가의 삶을 조금 더 쉽게 만듭니다. 서두에서 말했듯이 이것이 이 작업을 수행하는 유일한 방법이 아니라 하나의 방법일 뿐이며 유용할 수 있습니다.

감사의 말

Gleb Bahmutov가 Cypress 커뮤니티와 그의blogging on this subject . 그는 또한 baseUrl 속성을 설정하는 방법도 알고 있습니다.