[T.Viewer] electron + jest desktop application에 codecov 적용기

jest test framework을 사용한 electron desktop application T.Viewer에 codecov 서비스를 적용한 과정을 간단하게 정리해 보았다.

뱃지까지 적용 완료!

T.Viewer는 이미 jest test framework을 사용하면서 coverage를 계산해서 출력하고 있다. 이 결과를 codecov가 제대로 가져가서 codecov 클라우드에 결과가 업데이트 되면 되는데, 그것은 travis에서 자동 빌드가 될때만 처리 되도록 하고 싶다. 로컬에서 하려면 codecov의 토큰도 있어야하고 로컬에 codecov node 패키지도 설치해야 하기 때문이다. smtm 프로젝트에서의 경험으로 봤을 때 travis에서 codecov를 사용하는 것은 매우 간단하다.

아니나 다를까 codecov에서 다양한 조건에 대한 샘플 모두 올려놨다.

example-node

예제에서는 package.json에서 jest 설정을 추가하도록 안내하고 있는데, T.Viewer는 jest.config.js를 따로 가지고 있어서 거기에 아래와 같이 설정을 하였다. coverageDirectory 항목으로 커버리지 결과를 특정 폴더에 저장되도록 설정하였다.

module.exports = {
  collectCoverage: true,
  coverageDirectory: "./coverage/",
  coveragePathIgnorePatterns: ["/node_modules/", "/tests/"],
  preset: '@vue/cli-plugin-unit-jest',
  moduleNameMapper: {
    "electron": "<rootDir>/tests/mock/electron.js",
    "ace-builds": "<rootDir>/tests/mock/ace-builds.js",
    "ElectronStoreWrapper": "<rootDir>/tests/mock/ElectronStoreWrapper.js",
    "mousetrap": "<rootDir>/tests/mock/mousetrap.js",
  },
  setupFilesAfterEnv: ['./tests/jest.setup.js'],
}

.travis.yml 파일에 아래와 같이 before_install 항목을 추가해서 travis 빌드할 때 설치되도록 하였고, script 항목에 - codecov 한줄 추가해 주었다. codecov 패키지가 커버리지 결과를 codecov 클라우드에 올리도록 하는 것이다.

os:
  - linux
  - windows
before_install:
  - npm install -g codecov
install:
  - npm install
script:
  - npm run test && npm run build
  - codecov

이게 끝이당. 쉬워도 너무 쉬운 설정. 커버리지는 이미 측정중이었고, 두 서비스 간의 연동도 이미 잘되어 있으니 당연한것 같기도 하다.

84%라니 좀 더 올릴까...