From 29df9b5fd0968f4aff03581ef781a37a92ec4818 Mon Sep 17 00:00:00 2001
From: Michael Cousins <michael@cousins.io>
Date: Tue, 25 Jun 2024 11:07:56 -0400
Subject: [PATCH] docs(svelte-testing-library): add Svelte 5 setup instructions
 for Jest (#1401)

---
 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 f7b14938..2e0d8de9 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: ['<rootDir>/jest-setup.js'],
+     }
+   ```
+
+   :::
+
 4. Add the following to your `package.json`
 
    ```json title="package.json"