{"id":231755,"date":"2023-01-12T14:45:00","date_gmt":"2023-01-12T11:45:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=231755"},"modified":"2022-12-25T18:49:59","modified_gmt":"2022-12-25T15:49:59","slug":"hur-man-doeljer-javascripts-console-log-utdata-i-jest-tester","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/sv\/hur-man-doeljer-javascripts-console-log-utdata-i-jest-tester\/","title":{"rendered":"Hur man d\u00f6ljer JavaScripts console.log-utdata i Jest-tester"},"content":{"rendered":"

Jag arbetade idag i en kodbas som hade m\u00e5nga avsiktliga console.log<\/code>utdata i alla milj\u00f6er utom produktion s\u00e5 de d\u00f6k upp i Jests testutdata. Det skulle ha varit tr\u00e5kigt att g\u00e5 och ta bort dem en efter en och s\u00e5 jag utarbetade denna enkla installation f\u00f6r att undertrycka all console.log<\/code>utdata p\u00e5 en g\u00e5ng medan Jest k\u00f6rs.<\/p>\n

Konfigurera Det finns<\/h2>\n

Det h\u00e4r tricket bygger p\u00e5 Jests inhemska f\u00f6rm\u00e5ga att h\u00e5na vad som helst. Vad vi i princip kommer att g\u00f6ra \u00e4r att h\u00e5na log<\/code>metoden f\u00f6r console<\/code>objektet och l\u00e4mna de andra metoderna intakta.<\/p>\n

Vi m\u00e5ste f\u00f6rst ber\u00e4tta f\u00f6r Jest<\/a> att k\u00f6ra en installationsfil innan testerna k\u00f6rs. F\u00f6r att g\u00f6ra detta redigerar vi jest.config.js<\/code>filen som vanligtvis ligger i roten f\u00f6r ditt projekt med andra konfigurationsegenskaper och l\u00e4gger till f\u00f6ljande rad:<\/p>\n

setupFilesAfterEnv: ['\/src\/jest.setup.js']<\/code><\/pre>\n
Vi kan kolla i Jests dokumentation<\/a> vad det setupFilesAfterEnv<\/code>g\u00f6r:<\/p>\n
\n
En lista \u00f6ver s\u00f6kv\u00e4gar till moduler som k\u00f6r n\u00e5gon kod f\u00f6r att konfigurera eller st\u00e4lla in testramverket innan varje testfil i sviten k\u00f6rs.<\/p>\n<\/blockquote>\n
Nu, n\u00e4r vi k\u00f6r v\u00e5ra tester, kommer de f\u00f6rst att utf\u00f6ra det jest.setup.js<\/code>som vi kommer att skapa nu.<\/p>\n
Mocking console.log<\/h2>\n
Skapa en fil p\u00e5 src\/setup.js<\/code>eller var du \u00e4n pekade p\u00e5 din v\u00e4g i f\u00f6reg\u00e5ende steg. Du l\u00e4gger sedan till det h\u00e4r:<\/p>\n
global.console = {\n    log: jest.fn(),\n    debug: console.debug,\n    trace: console.trace,\n\n}\n<\/code><\/pre>\n
Detta \u00e5sidos\u00e4tter log<\/code>metoden och till\u00e5ter de andra. Eftersom jag fortfarande ville ha m\u00f6jlighet att utmata n\u00e5got i testerna, mappade jag debug<\/code>och trace<\/code>. Du kan mappa andra som du kan beh\u00f6va s\u00e5 console.table<\/code>att element i en tabell \u00e5terges, anv\u00e4ndbara f\u00f6r att logga objekt eller arrayer. F\u00f6r att vara \u00e4rlig, tills jag skrev detta, hade jag aldrig tittat p\u00e5 konsolobjektsidan i MDN<\/a> och det finns m\u00e5nga intressanta metoder som den console.dir<\/code>som visar en interaktiv lista \u00f6ver egenskaperna f\u00f6r det angivna JavaScript-<\/a> objektet.<\/p>\n
Avslutningsord<\/h2>\n
Nu console.log<\/code>\u00e4r din utdata undertryckt medan dina Jest-test k\u00f6rs. Om du arbetar i ett team se till att du l\u00e5ter resten av teamet veta om denna f\u00f6r\u00e4ndring genom att dokumentera den eftersom n\u00e5gon kan bli stressad av att f\u00f6rs\u00f6ka g\u00f6ra console.log<\/code>n\u00e5got och inte ser det d\u00e4r det ska vara.<\/p>\n
Inspelningsk\u00e4lla:  startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
L\u00e4r dig hur du undertrycker utmatningen av o\u00f6nskade console.log()-anrop i dina Jest-tester.<\/p>\n","protected":false},"author":1,"featured_media":236170,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[1022,734,901,755,724],"tags":[1173],"class_list":["post-231755","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-anvandbara-webbplatser","category-javascript-9","category-koda","category-oeppen-kaella","category-utvecklaren","tag-affiai-sv"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts\/231755","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/comments?post=231755"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/posts\/231755\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/media\/236170"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/media?parent=231755"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/categories?post=231755"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/sv\/wp-json\/wp\/v2\/tags?post=231755"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}