From 50dcf74fb6db708913a993c780d90214f2c834f0 Mon Sep 17 00:00:00 2001 From: Michael Cousins Date: Sun, 16 Jun 2024 14:39:40 -0400 Subject: [PATCH] docs(svelte-testing-library): add Svelte 5 setup instructions for Jest --- docs/svelte-testing-library/setup.mdx | 29 ++++++++++++++++++++++++++- 1 file changed, 28 insertions(+), 1 deletion(-) diff --git a/docs/svelte-testing-library/setup.mdx b/docs/svelte-testing-library/setup.mdx index f7b14938c..2e0d8de9e 100644 --- a/docs/svelte-testing-library/setup.mdx +++ b/docs/svelte-testing-library/setup.mdx @@ -171,7 +171,7 @@ you must use Jest in [ESM mode][jest esm mode]. 3. Configure Jest to use jsdom, transform Svelte files, and use your setup file ```js title="jest.config.js" - module.exports = { + export default { transform: { '^.+\\.svelte$': 'svelte-jester', }, @@ -182,6 +182,33 @@ you must use Jest in [ESM mode][jest esm mode]. } ``` + :::note + + If you are using Svelte 5, you must use `svelte-jester@5` or later, and you + will need to make additional changes to your Jest configuration. + + - Update `transform` to compile `.svelte.(js|ts)` modules + - Allow `@testing-library/svelte` to be transformed, even though it's in + `node_modules` + + ```diff title="jest.config.js" + export default { + transform: { + - '^.+\\.svelte$': 'svelte-jester', + + '^.+\\.svelte(\\.(js|ts))?$': 'svelte-jester', + }, + + transformIgnorePatterns: [ + + '/node_modules/(?!@testing-library/svelte/)', + + ], + moduleFileExtensions: ['js', 'svelte'], + extensionsToTreatAsEsm: ['.svelte'], + testEnvironment: 'jsdom', + setupFilesAfterEnv: ['/jest-setup.js'], + } + ``` + + ::: + 4. Add the following to your `package.json` ```json title="package.json"