{"id":877,"date":"2024-08-01T08:00:24","date_gmt":"2024-08-01T08:00:24","guid":{"rendered":"https:\/\/bruceng.com\/dev\/?p=877"},"modified":"2024-08-01T08:00:24","modified_gmt":"2024-08-01T08:00:24","slug":"debug-jest-tests","status":"publish","type":"post","link":"https:\/\/bruceng.com\/dev\/?p=877","title":{"rendered":"Debug jest tests"},"content":{"rendered":"\n<p>Source:  <a href=\"https:\/\/stackoverflow.com\/a\/63909711\">https:\/\/stackoverflow.com\/a\/63909711<\/a><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>You do not need&nbsp;<code>Chrome<\/code>&nbsp;for&nbsp;<strong>Jest<\/strong>&nbsp;tests.<\/p>\n\n\n\n<p>The simplest solution I found is to use&nbsp;<strong>VS Code<\/strong>&nbsp;<code>JavaScript Debug Terminal<\/code>.<\/p>\n\n\n\n<p>And it works with Typescript and Nrvl.Nx work-spaces out of the box.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Open the command palette and start\u00a0<code>Debug: JavaScript Debug Terminal<\/code>:<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/i.sstatic.net\/UpPhO.png\"><img decoding=\"async\" src=\"https:\/\/i.sstatic.net\/UpPhO.png\" alt=\"enter image description here\"\/><\/a><\/figure>\n\n\n\n<ol start=\"2\" class=\"wp-block-list\">\n<li>Run tests in that terminal in a\u00a0<em>Watch mode<\/em>\u00a0<code>npm test -- --watch<\/code>. (or\u00a0<code>yarn test --watch<\/code>\u00a0if you are using yarn)<\/li>\n\n\n\n<li>Set a break-point in your file.<\/li>\n\n\n\n<li>Make any change in a file you want to debug and save.<\/li>\n\n\n\n<li><code>watch<\/code>\u00a0will run Jest tests against modified files.<\/li>\n<\/ol>\n\n\n\n<p>When you want to narrow down the number of files run by the &#8211;watch, press&nbsp;<code>p<\/code>&nbsp;in the terminal and enter a pattern, which is just a part of the file name you want to test and hit [Enter]<\/p>\n\n\n\n<p>To limit it to a single test in a file &#8211; focus it with f, so change it(&#8230;) to fit(&#8230;)<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Source: https:\/\/stackoverflow.com\/a\/63909711 You do not need&nbsp;Chrome&nbsp;for&nbsp;Jest&nbsp;tests. The simplest solution I found is to use&nbsp;VS Code&nbsp;JavaScript Debug Terminal. And it works with Typescript and Nrvl.Nx work-spaces out of the box. When you want to narrow down the number of files run by the &#8211;watch, press&nbsp;p&nbsp;in the terminal and enter a pattern, which is just a part &hellip; <a href=\"https:\/\/bruceng.com\/dev\/?p=877\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Debug jest tests&#8221;<\/span><\/a><\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-877","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/posts\/877","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=877"}],"version-history":[{"count":1,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/posts\/877\/revisions"}],"predecessor-version":[{"id":878,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=\/wp\/v2\/posts\/877\/revisions\/878"}],"wp:attachment":[{"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=877"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=877"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bruceng.com\/dev\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=877"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}