jest configuration debugging jest based tests
Lær om Jest Config, feilsøking og sammenligning av Jest med andre JavaScript-testrammer, spesielt Jest vs Mocha & Jest vs Jasmine:
I dette Informativ Jest-serie , vi utforsket alt om Testing React Apps, Mocks and Spies ved hjelp av Jest i vår siste opplæring.
selen intervju spørsmål for 4 års erfaring
I denne opplæringen vil vi lære mer om Jest Config-filer og se hvordan du faktisk kan feilsøke Jest-tester for feilsøking av en eller flere flere tester.
Vi vil også utforske noen av de mest brukte alternativene i Jest Config-filen som kan settes opp uavhengig i et prosjekt, eller de som kan legges til som en del av selve package.json-konfigurasjonen.
Vi bruker Visual Studio Code for å skrive Jest-testene våre og bruker en utvidelse eller et plugin i VS Code for å muliggjøre feilsøkingsstøtte for Jest-tester.
I tillegg vil vi sammenligne de forskjellige Javascript-testrammene som Mocha og Jasmine med Jest og forstå fordeler og ulemper ved hverandre.
Hva du vil lære:
Det er Config
Jest-konfigurasjon kan spesifiseres på 3 måter
- Gjennom en nøkkel i package.json-filen.
- Gjennom en jest.config.js-fil - Konfigurasjonsfil skrevet som en modul.
- Gjennom en JSON som kan brukes med alternativet som -config-flagg.
Med alle ovennevnte tilnærminger kan du oppnå det samme resultatet. La oss se det første trinnet - dvs. legge til Jest-konfigurasjon gjennom en nøkkel i package.json-filen.
I den eksisterende package.json-filen legger du til en ny nøkkel som heter “jest”. Dette er ingenting annet enn et sett med nøkkelverdipar i JSON-format. Alle konfigurasjonsalternativene knyttet til Jest kan legges videre til denne delen i filen package.json.
De mest brukte konfigurasjonsalternativene er oppført nedenfor.
# 1) Dekningsrelatert
collectCoverage, dekningTerskel, dekningReportere, dekningKatalog - Dette er de mest brukte alternativene. Dekning er en viktig beregning, og den sikrer at koden testes mot en forhåndsinnstilt terskel.
En detaljert forklaring av hver av dem er som følger:
# 1) collectCoverage: Dette alternativet brukes til å spesifisere om vi vil at Jest-testløperen skal samle inn informasjon om dekning eller ikke. Når den er satt til sann, samler Jest-løperen dekningsinformasjonen. Med dette alternativet vil dekningen samles opp og vises på konsollen på slutten av testutførelsen som vist nedenfor.
# 2) dekning terskel: Denne innstillingen lar oss spesifisere terskelverdiene for dekning i prosent. Dette er veldig nyttig når organisasjonen eller teamet ønsker å følge en viss minimumsverdi for dekning uten hvilken ingen kode kan skyves eller slås sammen til hovedgrenen.
La oss se hvordan dette kan brukes.
Dekningen kan spesifiseres på globalt nivå, filnivå eller hvilken som helst annen regex. Når det er spesifisert på globalt nivå, skal alle den angitte terskelen stemme overens med de samlede filene i prosjektet.
'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 } }
Å spesifisere dekning på filnivå er også mulig ved å endre “global” til filnavn eller regex. Terskelkonfigurasjonene kan variere avhengig av kravet.
'coverageThreshold': { './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } }
# 3) dekning Reportere: Denne konfigurasjonen brukes til å spesifisere hvilken reporter du vil bruke for å generere dekningsrapporten. Det er mange eksisterende journalister som NPM-pakker tilgjengelig som kan brukes til å generere en dekningsrapport på slutten av testutførelsen.
# 4) dekningKatalog: Denne innstillingen lar brukeren spesifisere katalogen der dekningsrapportene skal lagres eller vedvares etter at de ble opprettet.
Nedenfor er et kombinert eksempel på bruk av alle dekningsrelaterte konfigurasjonsinnstillinger.
'jest':{ 'collectCoverage':true, 'coverageThreshold': { 'global': { 'branches':95, 'functions':100, 'lines':70, 'statements':-2 }, './src/calculator.js': { 'branches':100, 'functions':100, 'lines':100, 'statements':-10 } }, 'coverageReporters': ( 'lcov','text' ), 'coverageDirectory': './output/code-coverage/' }
Her har vi brukt to dekningsjournalister, dvs. lcov og text.Lcov er Linuxs linjedekning og er til stede som standard, og 'text' -reporteren betyr at dekningsoutputtet også vises på konsollen. Dekningsrapporten vil bli generert på banen som er spesifisert i innstillingen “dekningskatalog”.
# 2) Spottrelatert
Mocks brukes mye under testing med Jest. Begge konfigurasjonsalternativene nedenfor tillater enkel konfigurering og oppklaring av mocks.
- autoMocks: Når det er satt til sant, vil dette spotte alle modulene som er importert i testen som standard.
- clearMocks: Når satt til sant, vil dette fjerne alle spottede oppsett / moduler etter hver test, slik at hver test starter med en ny tilstand. Dette kan også oppnås ved hjelp av testCleanup eller 'etter' -metoden, men å ha det i konfigurasjon gjør det enda enklere.
# 3) Testrelaterte
# 1) testTimeout: Denne konfigurasjonen brukes til å gi en hard timeout-innstilling for tester i millisekunder. Enhver test som tar mer enn denne konfigurerte terskelen blir markert som mislykket på grunn av unntak for tidsavbrudd.
'jest' { 'testTimeout': 100 }
# 2) Global: Denne konfigurasjonen brukes til å angi globale variabler som skal være tilgjengelige for hver test.
'jest' { 'globals': { 'globalVar': 'test global variable!' } }
La oss prøve å bruke en global variabel i testen og se om den fungerer som forventet.
describe('Calculator tests', () => { test('add 2 numbers', () => { // arrange & act const val = mathOps.sum(3,4) console.log(globalVar) // assert expect(val).toBe(7) })
Etter at denne testen er utført, skal verdien til globalVar logges.
Sjekk her for en uttømmende liste over alle konfigurasjonsalternativer.
Videoopplæring om IS-konfigurasjon
hvordan åpne en xml-fil
Feilsøking ved hjelp av Jest
I denne delen vil vi prøve å forstå hvordan vi kan feilsøke tester skrevet basert på Jest.
Vi vil bruke og forstå to forskjellige måter vi kan feilsøke Jest-tester på.
- Nodeens innfødte feilsøkingsprogram og deretter bruke Chrome Inspector til å feilsøke testene.
- Bruke Visual Studio Code's feilsøkingskonfigurasjon til å feilsøke testene i selve Visual Studio Code-redigereren. Dette er den mest brukte måten å feilsøke på, da Visual Studio Code er standardredigeringsprogrammet for det meste av Javascript-utviklingen i disse dager.
Hver av disse tilnærmingene er forklart nedenfor i detalj.
# 1) Bruke Node's Native Debugger
For å kunne bruke Node JS native debugger, må vi sette inn søkeordet ‘debugger’ i testen, der vi ønsker å plassere bruddpunktet.
Når testutføreren møter feilsøkingsprogram kommandoen, stopper den kjøringen, og hvis vi legger til Chrome-feilsøkingsverktøy, kan vi feilsøke testkoden (samt funksjonen som testes) ved hjelp av Chrome-verktøy.
Chrome-nettleser er en forutsetning her for å kunne bruke Node's Native Debugger.
Følg trinnene nedenfor.
#1) Legg til feilsøkingsnøkkelord i testen, dvs. på det punktet der du vil at testen skal treffe brytpunktet, sett inn kommandoen “feilsøking”
#to) Utfør testen med –inspect-brk flagg.
Bruk kommandoen nedenfor for å utføre testen i en brytpunktmodus.
/usr/local/bin/node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand
# 3) Fest Nodeens feilsøkingsprogram i Chrome. Nå i Chrome-nettleseren, naviger til chrome: // inspiser og koble til mållytteren som er opprettet av trinnet ovenfor.
# 4) Fortsett kjøringen, og du vil se at bruddpunktet treffer i kromfeilsøkingsinspektøren, og du kan feilsøke anropsstakken og objekttilstanden i selve kromfeilsøkingsprogrammet.
Denne tilnærmingen til feilsøking av Jest-tester er ok, men ikke veldig brukervennlig, ettersom du må fortsette å bytte fra kodeditoren til Chrome og omvendt som forårsaker mye friksjon. I den kommende delen vil vi se måtene å konfigurere feilsøkingsprogrammet i selve Visual Studio Code-redigereren.
# 2) Bruker VS Code sin feilsøkingskonfigurasjon
#1) Velg Debug / Run-delen av Visual Studio-koden fra venstre panel.
#to) Nå vil vi oppdatere feilsøkingskonfigurasjonen for jest-tester. For å gjøre det, legg til en ny konfigurasjon ved å velge menyalternativet.
# 3) Når alternativet for å legge til konfigurasjon er valgt, åpnes den `launch.json`-filen med standardinnholdet i redigeringsruten. Fjern standardinnholdet og kopier innholdet nedenfor for å lage en feilsøkingskonfigurasjon for Jest-testene.
{ 'version': '0.2.0', 'configurations': ( { 'name': 'Debug Jest Tests', 'type': 'node', 'request': 'launch', 'runtimeArgs': ( '--inspect-brk', '${workspaceRoot}/node_modules/jest/bin/jest.js', '--runInBand' ), 'console': 'integratedTerminal', 'internalConsoleOptions': 'neverOpen', 'port': 9229 } ) }
# 4) Lagre den nylig lagt til innholdskonfigurasjonen som vil bli brukt til å feilsøke Jest-testene. Hvis du leser nøye gjennom konfigurasjonen, ligner det på det vi gjorde da vi prøvde å koble til Node-feilsøkingsprogrammet i Chrome Developer-verktøyene via kommandoen.
--inspect-brk ./node_modules/jest/bin/jest.js --runInBand
Fordelen med å ha konfigurert her er at testene kjøres / feilsøkes som en del av selve redigeringsprogrammet (i dette tilfellet er det VSCode), og vi trenger ikke koble til noe eksternt program.
# 5) Når feilsøkingskonfigurasjonen er opprettet, kan du nå legge til bruddpunkter i testene og utføre ved hjelp av denne RUN-konfigurasjonen. Dette vil sikre at testen stopper ved brytepunktene, og du kan feilsøke verdiene, objekttilstanden ved brytpunktet i den faktiske testfilen.
Brytpunkter kan legges til ved å klikke nær linjenumrene i kodefilene.
# 6) Når brytepunktet er lagt til, kan vi velge Kjør konfigurasjon som vi la til i trinn 3 for å utføre / feilsøke testen.
# 7) Når du velger / klikker på Run-knappen, bør du kunne se at kjøringen treffer brytpunktet som ble plassert, og du kan få flere detaljer som miljø- / variabelverdier, stakksporing osv. Ved brytpunktet.
Brytpunktet / kodestrømkontrollknappene kan brukes til å flytte til neste brytpunkt eller flytte inne i funksjonen for mer informasjon.
Videoopplæring Han ERFeilsøking
Det er Mocha mot Jasmine
I avsnittet nedenfor vil vi sammenligne Jest vs Mocha og Jest vs Jasmine på forskjellige parametere og funksjonssammenligninger som Snapshot-testing, Enkel konfigurasjon og Evner til forskjellige rammer.
Parameter | Er | Mokka | Jasmin |
---|---|---|---|
Testtyper støttes | Brukes mest til enhetstesting. | Enhetstesting | Enhetstesting og E2E-testing. |
Øyeblikksbilde testing | Fullt støttet - Jest støtter å ta øyeblikksbilder av en komponent og bruke den til å sammenligne testutgangen mot den lagrede komponentstrukturen, spesielt brukt for React-komponenter. Øyeblikksbilder er en fin måte å sikre at brukergrensesnitt ikke endres uventet. | Ingen støtte | Ingen støtte |
Påstander og matchere | Bruk expect.js-biblioteket for matchere. | Støtte for Node's innebygde påstandsmodul, og kan også omfatte andre påstandsbiblioteker. | I innebygde påstander |
Gjøre narr av | Fullt innebygd støtte for Mocks and Stubs i Jest. | Ingen innebygd støtte for spott eller stubbing. Kan brukes med andre biblioteker som Sinon for å støtte Mocking. | Innebygd begrenset støtte ved hjelp av spyOn. Kan integreres med andre biblioteker. |
Utførelseshastighet | 4x Jest-tester er isolert i sin egen sandkasse. Dermed kjører Jest-tester i hovedsak parallelt, noe som gir betydelig forbedring i utførelsestider. | x Støtter ikke parallell gjennomføring av tester. | x Støtter ikke parallell gjennomføring av tester. |
Konfigurasjon og oppsett | Veldig enkelt - null konfigurasjon kreves. | ||
Mode for testutførelse | Hodeløs | Hodeløs | Hodeløs |
Test utgang og kontekst | Genererer rik kontekst etter utførelse - Jest gir detaljert testkontekst for å grave dypt inn i hva som har forårsaket en feil og dermed sikre enkel feilsøking. | Testutgang er ikke veldig lesbar og gjør feilsøking litt utfordrende. | |
Feilsøking | Støtte for innfødte Node-feilsøkere kan også brukes til å feilsøke innen redaktører som Visual Studio Code gjennom en egen lanseringskonfigurasjon. | Støtter naturlig Node-feilsøkingsprogram. | Kan bruke karma testløper til å starte tester i Chrome og feilsøke. |
Kodedekning | Jest har innebygd støtte for kodedekning. Dekningskonfigurasjon kan spesifiseres i Jest-konfigurasjon, og rapportene kan genereres med hver testutførelse. | Ingen innebygd støtte. Gir støtte for eksterne biblioteker for å generere dekningsrapporter. | Samme som Mocha |
Teststil | BDD Alle de tre rammene støtter tester som skal skrives som et sett med spesifikasjoner eller spesifikasjoner som gjør dem mer lesbare. | BDD | BDD |
Konklusjon
I denne opplæringen lærte vi om de forskjellige måtene du kan feilsøke Jest-testene dine i Visual Studio Code, eller i Chrome Inspector ved hjelp av Node's native debugger.
sorter kommando i unix med eksempler
Vi utforsket også de vanlige konfigurasjonsalternativene i Jest-konfigurasjonsfilen. Jest-konfigurasjon hjelper til med å oppnå mange ting som kodedekning, Html-rapporter, Sette opp mock atferd, Sette opp globale variabler, etc.
PREV Opplæring | FØRSTE veiledning
Anbefalt lesing
- Jest Tutorial - JavaScript Unit Testing ved bruk av Jest Framework
- Hvordan teste Reager apper ved hjelp av Jest Framework
- Jasmine Framework Tutorial Inkludert Jasmine Jquery med eksempler
- Distribuerte bygninger: Jenkins Master Slave Configuration
- Feilsøkingsteknikker i selen: brytepunkter, feilsøkingsmodus og mer
- Konfigurasjonstestveiledning med eksempler
- Slik konfigurerer du Node.js Testing Framework: Node.js Tutorial
- 25 beste Java-testrammer og verktøy for automatiseringstesting (del 3)