{"id":231662,"date":"2023-01-12T14:41:00","date_gmt":"2023-01-12T11:41:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=231662"},"modified":"2022-12-25T18:49:58","modified_gmt":"2022-12-25T15:49:58","slug":"jak-ukryc-wyjscie-javascript-z-console-log-w-testach-jest","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/jak-ukryc-wyjscie-javascript-z-console-log-w-testach-jest\/","title":{"rendered":"Jak ukry\u0107 wyj\u015bcie JavaScript z console.log w testach Jest?"},"content":{"rendered":"\n

Pracowa\u0142em dzisiaj w bazie kodu, kt\u00f3ra mia\u0142a wiele celowych console.log<\/code>danych wyj\u015bciowych we wszystkich \u015brodowiskach poza produkcyjnym, wi\u0119c pojawia\u0142y si\u0119 one w wynikach test\u00f3w Jest. By\u0142oby nu\u017c\u0105ce, aby usun\u0105\u0107 je jeden po drugim, wi\u0119c wymy\u015bli\u0142em t\u0119 prost\u0105 konfiguracj\u0119, aby t\u0142umi\u0107 wszystkie console.log<\/code>dane wyj\u015bciowe naraz, gdy jest uruchomiony.<\/p>\n

Configuring Jest<\/h2>\n

Ta sztuczka opiera si\u0119 na wrodzonej zdolno\u015bci Jest do wy\u015bmiewania czegokolwiek. To, co zasadniczo zrobimy, to zakpi\u0107 log<\/code>metod\u0119 console<\/code>obiektu i pozostawi\u0107 inne metody nienaruszone.<\/p>\n

Najpierw musimy powiedzie\u0107 Jest<\/a>, aby wykona\u0142 plik instalacyjny przed uruchomieniem test\u00f3w. Aby to zrobi\u0107, zmodyfikujemy jest.config.js<\/code>plik, kt\u00f3ry zwykle znajduje si\u0119 w katalogu g\u0142\u00f3wnym projektu, z innymi w\u0142a\u015bciwo\u015bciami konfiguracyjnymi i dodamy nast\u0119puj\u0105cy wiersz:<\/p>\n

setupFilesAfterEnv: ['\/src\/jest.setup.js']<\/code><\/pre>\n
Mo\u017cemy sprawdzi\u0107 w dokumentacji Jest,<\/a> co setupFilesAfterEnv<\/code>robi:<\/p>\n
\n
Lista \u015bcie\u017cek do modu\u0142\u00f3w, kt\u00f3re uruchamiaj\u0105 kod w celu skonfigurowania lub skonfigurowania platformy testowej przed wykonaniem ka\u017cdego pliku testowego w pakiecie.<\/p>\n<\/blockquote>\n
Teraz, kiedy uruchamiamy nasze testy, najpierw wykonaj\u0105 to jest.setup.js<\/code>, co teraz utworzymy.<\/p>\n
Mocking console.log<\/h2>\n
Utw\u00f3rz plik w src\/setup.js<\/code>miejscu lub w miejscu wskazanym w poprzednim kroku. Nast\u0119pnie dodasz do niego:<\/p>\n
global.console = {\n    log: jest.fn(),\n    debug: console.debug,\n    trace: console.trace,\n\n}\n<\/code><\/pre>\n
To jest nadrz\u0119dne wobec log<\/code>metody i dopuszczanie innych. Poniewa\u017c nadal chcia\u0142em mie\u0107 mo\u017cliwo\u015b\u0107 wyprowadzania czego\u015b w testach, zmapowa\u0142em debug<\/code>i trace<\/code>. Mo\u017cesz mapowa\u0107 inne, kt\u00f3rych mo\u017cesz potrzebowa\u0107, tak jak console.table<\/code>renderuje elementy w tabeli, przydatne do rejestrowania obiekt\u00f3w lub tablic. Szczerze m\u00f3wi\u0105c, dop\u00f3ki tego nie napisa\u0142em, nigdy nie zagl\u0105da\u0142em do strony obiektu konsoli w MDN<\/a> i istnieje wiele interesuj\u0105cych metod, takich jak ta console.dir<\/code>, kt\u00f3ra wy\u015bwietla interaktywn\u0105 list\u0119 w\u0142a\u015bciwo\u015bci okre\u015blonego obiektu JavaScript<\/a>.<\/p>\n
S\u0142owa zamykaj\u0105ce<\/h2>\n
Teraz twoje console.log<\/code>dane wyj\u015bciowe s\u0105 t\u0142umione podczas uruchamiania test\u00f3w Jest. Je\u015bli pracujesz w zespole, upewnij si\u0119, \u017ce powiadomi\u0142e\u015b reszt\u0119 zespo\u0142u o tej zmianie, dokumentuj\u0105c j\u0105, poniewa\u017c kto\u015b mo\u017ce si\u0119 zestresowa\u0107, pr\u00f3buj\u0105c console.log<\/code>czego\u015b i nie widzie\u0107 tego tam, gdzie powinno by\u0107.<\/p>\n
\u0179r\u00f3d\u0142o nagrywania:  startfunction.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Dowiedz si\u0119, jak pomin\u0105\u0107 dane wyj\u015bciowe niepo\u017c\u0105danych wywo\u0142a\u0144 console.log() w testach Jest.<\/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":[721,732,897,752,1020],"tags":[1169],"class_list":["post-231662","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-deweloper","category-javascript-7","category-kod","category-otwarte-zrodlo","category-przydatne-strony","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/231662","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=231662"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/231662\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/236170"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=231662"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=231662"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=231662"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}