Softonic

Jest-konfigurationsgenerator

Steg 1 / 2 jest config
Nästa

Välj din stack, TypeScript, React, Node-backend, Svelte, så matar generatorn ut en jest.config.js med rätt transformerare, modulmappare, testmiljö och täckningsgränser. Inkluderar varje alternativ folk glömmer: moduleNameMapper för CSS/bilder, setupFilesAfterEach, testPathIgnorePatterns för node_modules och dist.

Så bygger du en Jest-konfiguration

  1. 1

    Välj din stack

    TypeScript, React, Vue, Svelte, ren Node eller en blandning. Var och en förifyller rätt transformerare.

  2. 2

    Välj testmiljön

    jsdom för webbläsarkod, node för backend, eller en anpassad miljö.

  3. 3

    Slå på/av funktioner

    Täckningsgränser, ögonblickstestning, mockvägar, egna setup-filer, transform-ignoreringsmönster.

  4. 4

    Ladda ner konfigurationen

    Utdatan är en kommenterad `jest.config.js` eller `jest.config.ts`, plus npm-skripten du bör lägga till i `package.json`.

Exempelutdata: React + TypeScript-projekt

module.exports = {
  preset: "ts-jest",
  testEnvironment: "jsdom",
  setupFilesAfterEach: ["<rootDir>/jest.setup.ts"],
  moduleNameMapper: {
    "\\.(css|less|scss|sass)$": "identity-obj-proxy",
    "\\.(jpg|jpeg|png|gif|svg)$": "<rootDir>/__mocks__/fileMock.js",
    "^@/(.*)$": "<rootDir>/src/$1"
  },
  testPathIgnorePatterns: ["/node_modules/", "/dist/", "/build/"],
  transform: {
    "^.+\\.tsx?$": ["ts-jest", { tsconfig: "tsconfig.test.json" }]
  },
  collectCoverageFrom: [
    "src/**/*.{ts,tsx}",
    "!src/**/*.d.ts",
    "!src/**/*.stories.*"
  ],
  coverageThreshold: {
    global: { branches: 80, functions: 80, lines: 85, statements: 85 }
  }
};

Beslutsguide: vilken miljö?

Din kod körs i… Använd
Webbläsare (DOM, window) jsdom (eller @happy-dom/jest-environment för fart)
Node-server node
Service workers Anpassad miljö, node-bas
React Native react-native-förinställning

Transformer-fusklapp

Källtyp Transformerare
TypeScript ts-jest eller @swc/jest
Babel-kompilerad JSX babel-jest (standard)
Vue SFC @vue/vue3-jest + babel-jest
Svelte svelte-jester
Statiska bilder Manuell mock i moduleNameMapper

Täckningsgränser: vilka siffror?

  • Kritisk väg / bibliotek: 90 %+ rader, 85 %+ grenar.
  • Funktionsteam: 80 % rader, 70 % grenar.
  • Snabbt föränderligt UI: 60-70 % rader; sikta högre för affärslogik, lägre för layout.
  • Prototyper: inaktivera gränserna helt; spåra täckning som ett tal, inte en grind.

Vanliga misstag

  • Att använda jsdom för ren Node-kod. Långsammare tester och inget vunnet, byt till node.
  • Att sakna transformIgnorePatterns för ESM-paket. Moderna paket levereras endast som ESM; Jest måste få veta att de ska transformeras.
  • Att mocka bilder/CSS utan en mappare. Importera en .png i ett test och Jest faller utan en mockmodul.
  • Att sätta clearMocks till false. Mockar läcker mellan tester och fel blir icke-deterministiska. Slå på det som standard.

Vanliga frågor

SWC (@swc/jest) är 10-20 gånger snabbare än ts-jest eftersom det hoppar över full typkontroll inuti Jest. Kör typkontrollen separat som tsc --noEmit i CI. Använd ts-jest när du vill att typfel ska få tester att misslyckas; använd SWC för fart.

happy-dom är ungefär 2-3 gånger snabbare än jsdom och implementerar en stor delmängd av DOM-API:erna. Den missar vissa specialfall, så om du träffar på ett “not implemented”-fel, fall tillbaka till jsdom.

Ja, om dina komponenter importerar .css- eller .scss-filer direkt. Mappa dem till identity-obj-proxy (för CSS-moduler) eller en liten tom stub. Utan detta kommer dina tester att ge fel vid importtillfället.

Ja. Välj TypeScript-utdataalternativet så matar generatorn ut jest.config.ts. Jest 27+ laddar automatiskt .ts-konfigurationer när ts-node är installerat.

Relaterade verktyg

ASCII-tabellreferens

Full ASCII-tabell från 0 till 127 med decimal-, hex-, oktal- och binärvärden samt notation för numeriska HTML-referenser, inklusive NUL, LF och DEL.

HTML-teckenreferens

En sökbar lista över HTML-entiteter med deras namngivna och numeriska koder samt kopiering med ett klick för specialtecken och symboler.

Referens för kortkommandon

Sök dokumenterade standardkommandon för VS Code, Chrome och Bash med GNU Readline i macOS, Windows och Linux.

HTML-formaterare

Formatera HTML lokalt i webbläsaren med indrag på två eller fyra blanksteg. HTML laddas inte upp eller valideras.

E-postvalidator

Validera en e-postadress: RFC 5322-syntaxkontroll, live-slagning av MX-poster samt detaljer om lokal del, domän och längd. Ingen e-post skickas.

Slumpgenerator för bokstäver

Generera slumpade A-Z-bokstäver. Välj antal, versaler, gemener eller blandat läge och använd resultatet för spel, uppgifter eller klassrumsaktiviteter.

Verktyget finns på andra språk