frontendskolen-testing

Eksempler på hvordan sette opp testing og skrive forskjellige type tester

Komme i gang

Kjør først npm ci

For å starte dev server, kjør npm start

For å kjøre tester, kjør npm t eller npm test

Hvordan ble Jest og testing-library satt opp?

1. npm i jest -D
2. npm i @babel/plugin-transform-modules-commonjs -D - dette er fordi Vite bruker ES modules, og jest CommonJS
3. La til .babelrc, og følgende config:

{
  plugins": ["@babel/plugin-transform-modules-commonjs"]
}

4. "test": "jest" ble lagt til i package.json
5. npm i @testing-library/react @testing-library/jest-dom -D
6. npm i @babel/preset-react -D
7. Oppdaterte .babelrc:

{
	"plugins": ["@babel/plugin-transform-modules-commonjs"],
	"presets": ["@babel/preset-react"]
}

8. npm i jest-environment-jsdom -D
9. La til jest.config.json, og følgende config:

{
	"testEnvironment": "jsdom"
}

10. Opprettet filen tests/mocks/styleMock.js
11. Oppdaterte jest.config.json på nytt for å mocke ut css for å kunne kjøre integrasjonstester src/App.jsx importerer src/App.css:

{
	"testEnvironment": "jsdom",
	"moduleNameMapper": {
		"\\.(css)$": "<rootDir>/__tests__/__mocks__/styleMock.js"
	},
	"testPathIgnorePatterns": ["/node_modules/", "__mocks__"]
}