[TDD] test code 관련 eslint 설정

testcode 관련 eslint 설정에 대해 알아보겠습니다.

일반 규칙 뿐만 아니라, test code에서 권장하는 lint도 고쳐주기 때문에,

협업을 하거나 초기에 배울 때 도움이 될 것 같습니다.

 

1. install

npm install eslint-plugin-testing-library eslint-plugin-jest-dom

 

2. react 에 적용

// .eslintrc.json
{
  "plugins": ["testing-library", "jest-dom"],
  "extends": [
    "react-app",
    "react-app/jest",
    "plugin:testing-library/react",
    "plugin:jest-dom/recommended"
  ]
}

 

3. next.js에 적용

// .eslintrc.json
{
  "plugins": ["testing-library", "jest-dom"],
  "overrides": [
    // Only uses Testing Library lint rules in test files
    {
      "files": [
        "**/__tests__/**/*.[jt]s?(x)",
        "**/?(*.)+(spec|test).[jt]s?(x)"
      ],
      "extends": ["plugin:testing-library/react", "plugin:jest-dom/recommended"]
    }
  ]
}

 

 

감사합니다.