GitHub ✅에서 빌드 합격 배지를 획득하세요! Travis CI로 Express 앱 테스트하기

Travis CI는 GitHub에서 오픈 소스 프로젝트를 위한 무료 테스트 빌드를 제공합니다. 그들의 제안을 받아들이지 않는다면 당신은 바보가 될 것입니다. 그들의 이메일 알림은 이전에 여러 번 내 프로젝트를 저장했습니다.

이 자습서에서는 CI(지속적인 통합)를 위한 Express 앱을 설정합니다. master 브랜치에 커밋할 때마다 Travis CI는 리포지토리를 복제하고, Linux의 클라우드 빌드를 가동하고, 필요한 종속 항목을 설치하고, 테스트를 실행합니다! 바라건대, 그들은 통과합니다! 그렇지 않은 경우 알림을 받게 됩니다.

설치

package.json 를 사용하여 빠른npm init -y 파일을 설정합니다. 그런 다음 Express: npm i express --save 뿐만 아니라 개발 종속성인 supertest 및 Jest: npm i supertest jest --save-dev 를 가져옵니다.

또는 프로젝트의 라이브 예제 역할을 하는 repository 을 복제하십시오!

Express에서 앱 제거

Express를 사용하는 기본 Hello World 애플리케이션은 다음과 같습니다.

// app.js

const express = require('express');
const app = express();
const port = 3000;

app.get('/', async (req, res) => res.status(200).send('Hello World!'));

app.listen(port, () => console.log(`Our app listening on port ${port}!`));

이것은 수동 테스트에 적합합니다. 이 애플리케이션을 실행하고 올바른 페이지가 반환되고 있는지 확인할 수 있습니다. 하지만 복잡한 논리를 가진 50페이지가 있는 경우에는 어떻게 될까요? 우리는 이 과정을 자동화하고 싶습니다. 첫 번째 단계는 app 개체를 내보내는 것입니다. 테스트를 실행할 때 라이브 HTTP 서버가 필요하지 않습니다.

Hello World 애플리케이션을 변경해 보겠습니다.

// app.js

const express = require('express');
const app = express();

app.get('/', async (req, res) => res.status(200).send('Hello World!'));

// Don't listen, just export
module.exports = app; // <--

엄청난. 하지만 지금 애플리케이션을 어떻게 시작합니까? 우리는 separation of concerns을 사용하고 listen()라는 다른 파일에서 server.js에 대한 호출을 배치합니다(또한 app 객체를 사용합니다!)

// server.js

const app = require('./app');
const port = 3000;

app.listen(port, () => console.log(`Our app listening on port ${port}!`))

이제 애플리케이션을 시작하기 위해 node server.js 를 사용합니다. package.json에 추가하여 사람들이 간단히 npm start를 사용할 수 있도록 합시다. 기본적으로 Node.js는 server.js 파일을 찾지만 명시적으로 지정하겠습니다.

"scripts": {
  "start": "node server.js"
},

테스트

일반적인 패턴은 테스트를 루트 디렉토리의 __tests__라는 폴더 안에 두는 것입니다. 또 다른 패턴은 .test 앞에 삽입된 .js로 테스트 중인 파일의 이름을 반복하는 것입니다. 따라서 __tests__/app.test.js .

Jest를 테스트 러너로 사용할 것입니다. Jest는 기본 검색의 일부로 내부__tests__를 살펴보고 찾은 테스트 파일을 실행합니다. --testMatch와 함께 사용자 정의 테스트 검색을 사용할 수 있습니다.

By default [Jest] looks for .js, .jsx, .ts and .tsx files inside of __tests__ folders, as well as any files with a suffix of .test or .spec (e.g. Component.test.js or Component.spec.js). It will also find files called test.js or spec.js.

테스트 내에서 supertest는 app 객체에 대한 요청을 조롱합니다. 모의 요청은 서버를 시작하고 라이브 요청을 사용하는 것보다 빠르고 예측 가능합니다. 또한 필요할 때 메소드를 더 쉽게 작성할 수 있습니다setup and teardown.

// __tests__/app.test.js

const app = require('../app');
const request = require('supertest');

// `describe` is used for test components
describe('GET /', () => {

    // `it` is for individual tests
    it('responds with 200', async () => {
        await request(app)
            .get('/')
            .expect(200); // If the status code is not 200, this test will fail
    });
})

테스트가 package.json 로 실행될 수 있도록 npm test 에 다른 줄을 추가해 보겠습니다. start 및 test 별칭을 사용하는 이유는 개발자가 처음으로 소프트웨어를 선택하고 다른 패키지와 원활하게 작동하도록 소프트웨어를 예측할 수 있도록 하기 위함입니다.

"scripts": {
  "start": "node server.js",
  "test": "jest"
},

npm test는 다음 출력을 생성합니다.

 PASS  __tests__/app.test.js
  GET /
    √ responds with 200 (39ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        2.681s
Ran all test suites.

트래비스 CI

GitHub에서 get this code into a repository을 다운로드하고 Travis CI GitHub App을 설치합니다. 테스트 중인 리포지토리에 Travis CI가 활성화되어 있는지 확인하세요.



Travis CItutorial는 다음과 같이 알려줍니다.

Add a .travis.yml file to your repository to tell Travis CI what to do.

우리의 경우에는 그렇게 간단합니다. 테스트 빌드에서 사용할 Node.js 버전 이외의 추가 설정을 지정할 필요가 없습니다. Travis CI는 기본 테스트 별칭npm test을 사용합니다.

# .travis.yml

language: node_js
node_js:
 - lts/* # Long Term Support

이 파일을 커밋하고 GitHub에 푸시하면 테스트 빌드가 즉시 대기열에 추가됩니다. 빌드가 travis-ci.com/{your-username}/{your-repo} 에서 실시간으로 실행되는 것을 볼 수 있으며 나중에 검토하여 문제가 발생한 위치를 확인할 수 있습니다. 이 페이지를 사용하여 Travis CI 빌드 상태 배지에 대한 마크다운도 받으세요!



문제가 발생하면 트윗하거나 repository에 문제를 제기하세요!


프로그래밍 및 개인 성장에 대해 150명 이상의 사람들이 내newsletter에 가입했습니다!

기술에 대해 트윗합니다.