Add how-to guide for node's test runner

[JakobJingleheimer]

Description

Adding learn ressources about nodejs test runner

Validation

Related Issues

Check List

• [x] I have read the Contributing Guidelines and made commit messages that follow the guideline.
• [x] I have run npm run format to ensure the code follows the style guide.
• [x] I have run npm run test to check if all tests are passing.
• [x] I have run npx turbo build to check if the website builds without errors.
• [x] I've covered new added functionality with unit tests if necessary.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Jun 6, 2024 8:15am

[JakobJingleheimer]

Under what heading do y'all think this article belongs? Its own ("Testing") or a more generic, like "Getting Started"?

Also, it seems the menu is not dynamically generated. Could someone point me to where I need to update the menu? I can't access the new article in the preview deployment 😅

[AugustinMauroy]

Under what heading do y'all think this article belongs? Its own ("Testing") or a more generic, like "Getting Started"?

I thinks having a section call "nodejs test runner" with several pages for each use case. Example: "introduction" with explaining of what is a test runner what is the goal of test runner, "test front-end code", "2e2" with example to start nodejs app and test it with fetch api

[AugustinMauroy]

Also, it seems the menu is not dynamically generated. Could someone point me to where I need to update the menu? I can't access the new article in the preview deployment 😅

It's not dynamic so we can chose the order of article in nav. Yeah it's not documented 😅. So you I'll need to update navigation.json

[JakobJingleheimer]

I thinks having a section call "nodejs test runner" with several pages for each use case. Example: "introduction" with explaining of what is a test runner what is the goal of test runner, "test front-end code", "2e2" with example to start nodejs app and test it with fetch api

I was wondering about this today. Do we want to have such opinionated articles? Ex this is what does and doesn't belong in a snapshot test, etc.

Also jsx or tsx is isn't support on the website ? Do we really need it?

Ish? The example contains JSX and it kinda needs to.

[JakobJingleheimer]

@AugustinMauroy how did you access the published page? I tried to manually navigate to /en/learn/test-runner/using-test-runner, but I get a 500 error.

[AugustinMauroy]

@JakobJingleheimer here link of preview you can also access to it with npm run dev

[AugustinMauroy]

Ish? The example contains JSX and it kinda needs to.

@ovflowd Would you prefer me to add it to this pr or another one?

Do we want to have such opinionated articles?

Why not ? I think it's an excellent solution for presenting all sorts of use cases.

[ovflowd]

@ovflowd Would you prefer me to add it to this pr or another one?

I'd rather not add syntax highlighting for JSX; if I recall, it has some of the largest bundles in terms of syntax highlighting. On that note, @AugustinMauroy can you investigate why upgrading to latest Next.js v14 breaks the build? I assume because we do some sort of dynamic imports somewhere or something that Next.js is not happy, I assume that it's something easy to fix. Unfortunately I don't have my PC with my right now.

[AugustinMauroy]

Off topics but I'll take a look

[JakobJingleheimer]

I'd rather not add syntax highlighting for JSX; if I recall, it has some of the largest bundles in terms of syntax highlighting.

Ah, fair. But what should I do then? The use-case basically requires JSX. The amount of JSX in the example code though is tiny.

[ovflowd]

I'd rather not add syntax highlighting for JSX; if I recall, it has some of the largest bundles in terms of syntax highlighting.

Ah, fair. But what should I do then? The use-case basically requires JSX. The amount of JSX in the example code though is tiny.

Mark it just as ts or js :)

[AugustinMauroy]

+1 for @mikeesto proposition but you have to bear in mind that the docs contain generic examples, so the learn section should be more based on concrete cases.

[JakobJingleheimer]

One thing that stood out to me is that the examples provided (from real-world projects) are relatively advanced. […] they might be expecting to learn how to test a function that sums two numbers.

bear in mind that the docs contain generic examples, so the learn section should be more based on concrete cases.

Yeah, exactly my thinking when I wrote this guide 🙂 The simple stuff is easy to figure out, but the complicated stuff probably only a couple dozen people know enough to figure out.

That said, happy to subsequently expand with some simpler examples in between ServiceWorker and sum().

[JakobJingleheimer]

Soo is this good to land?

[AugustinMauroy]

as it I think we can land it

[github-actions[bot]]

Lighthouse Results URL	Performance	Accessibility	Best Practices	SEO	Report
/en	🟠 86	🟢 100	🟢 96	🟢 91	🔗
/en/about	🟢 100	🟢 100	🟢 96	🟢 91	🔗
/en/about/previous-releases	🟢 99	🟢 100	🟢 100	🟢 92	🔗
/en/download	🟢 100	🟢 100	🟢 100	🟢 91	🔗
/en/blog	🟢 100	🟢 100	🟢 96	🟢 92	🔗

[github-actions[bot]]

Unit Test Coverage Report

Lines	Statements	Branches	Functions
	90.67% (593/654)	76.08% (175/230)	94.57% (122/129)

Unit Test Report

Tests	Skipped	Failures	Errors	Time
131	0 :zzz:	0 :x:	0 :fire:	5.585s :stopwatch: