{"id":13626429,"url":"https://github.com/svelteness/svelte-jester","last_synced_at":"2025-04-16T14:33:29.162Z","repository":{"id":37620464,"uuid":"226102592","full_name":"svelteness/svelte-jester","owner":"svelteness","description":"A Jest transformer for Svelte - compile your components before importing them into tests.","archived":false,"fork":false,"pushed_at":"2024-06-14T23:12:31.000Z","size":2880,"stargazers_count":128,"open_issues_count":16,"forks_count":18,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-10-29T18:05:52.347Z","etag":null,"topics":["jest","jest-transformer","svelte","svelte-v3","testing","testing-library"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/svelteness.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-12-05T12:57:03.000Z","updated_at":"2024-06-14T23:11:44.000Z","dependencies_parsed_at":"2023-02-07T00:45:15.382Z","dependency_job_id":"1a44e5c0-df85-457f-a915-4a002cbb8037","html_url":"https://github.com/svelteness/svelte-jester","commit_stats":{"total_commits":108,"total_committers":18,"mean_commits":6.0,"dds":0.6111111111111112,"last_synced_commit":"a871addeb1176ca217a2d7e5abef395f26ec06d5"},"previous_names":["mihar-22/svelte-jester"],"tags_count":37,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svelteness%2Fsvelte-jester","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svelteness%2Fsvelte-jester/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svelteness%2Fsvelte-jester/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svelteness%2Fsvelte-jester/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/svelteness","download_url":"https://codeload.github.com/svelteness/svelte-jester/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223716510,"owners_count":17191057,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["jest","jest-transformer","svelte","svelte-v3","testing","testing-library"],"created_at":"2024-08-01T21:02:18.282Z","updated_at":"2024-11-08T16:30:36.918Z","avatar_url":"https://github.com/svelteness.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\u003ch1\u003esvelte-jester\u003c/h1\u003e\n\n\u003cp\u003e\nSimply precompiles Svelte components before importing them into Jest tests.\n\u003c/p\u003e\n\n\u003cp\u003e\nThis version requires Jest \u003e= 27 and defaults to ESM, which is required with Svelte 4+. If you're using Svelte 3 and want to use CJS, you need to specify the \u003cstrong\u003efull path\u003c/strong\u003e for the jest transformer in your jest config.\n\u003c/p\u003e\n\n[![version][version-badge]][package]\n[![MIT License][license-badge]][license]\n\n\u003c/div\u003e\n\n\u003chr /\u003e\n\n## Table of Contents\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n\n- [Why not just use x?](#why-not-just-use-x)\n- [Installation](#installation)\n  - [Manual installation](#manual-installation)\n    - [ESM version](#esm-version)\n    - [CJS (CommonJS) version](#cjs-commonjs-version)\n  - [Babel (only for CJS)](#babel-only-for-cjs)\n  - [TypeScript](#typescript)\n    - [ESM version](#esm-version-1)\n    - [CJS version](#cjs-version)\n  - [Preprocess](#preprocess)\n- [Options](#options)\n  - [CJS mode options](#cjs-mode-options)\n- [Testing Library](#testing-library)\n- [Credits](#credits)\n- [LICENSE](#license)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n## Why not just use x?\n\nSeems like other libraries won't be working with preprocessors, won't be maintained actively or didn't\nhave proper licensing.\n\n## Installation\n\nIf you're using SvelteKit, you can set it up and install it with [svelte-add-jest](https://github.com/rossyman/svelte-add-jest) by running:\n\n```\nnpx apply rossyman/svelte-add-jest\n```\n\n### Manual installation\n\nThis library has `peerDependencies` listings for `svelte \u003e= 3` and `jest \u003e= 27`.\n\n`npm install svelte-jester -D`\n\n#### ESM version\n\nAdd the following to your Jest config:\n\n```json\n{\n  \"transform\": {\n    \"^.+\\\\.svelte$\": \"svelte-jester\"\n  },\n  \"moduleFileExtensions\": [\"js\", \"svelte\"],\n  \"extensionsToTreatAsEsm\": [\".svelte\"]\n}\n```\n\nRun your tests with `NODE_OPTIONS=--experimental-vm-modules`. For Windows you need to add `cross-env` as well.\n\n```json\n  \"test\": \"cross-env NODE_OPTIONS=--experimental-vm-modules jest src\",\n```\n\n#### CJS (CommonJS) version\n\nAdd the following to your Jest config:\n\n```json\n{\n  \"transform\": {\n    \"^.+\\\\.svelte$\": \"./node_modules/svelte-jester/dist/transformer.cjs\"\n  },\n  \"moduleFileExtensions\": [\"js\", \"svelte\"]\n}\n```\n\n### Babel (only for CJS)\n\n`npm install @babel/core @babel/preset-env babel-jest -D`\n\nAdd the following to your Jest config\n\n```json\n\"transform\": {\n  \"^.+\\\\.js$\": \"babel-jest\",\n  \"^.+\\\\.svelte$\": \"svelte-jester\"\n}\n```\n\nCreate a `.babelrc` and add the following\n\n```json\n{\n  \"presets\": [[\"@babel/preset-env\", { \"targets\": { \"node\": \"current\" } }]]\n}\n```\n\n### TypeScript\n\nTo enable TypeScript support you'll need to setup [`svelte-preprocess`](https://github.com/sveltejs/svelte-preprocess) and [`ts-jest`](https://github.com/kulshekhar/ts-jest).\n\n1. Install `typescript`, `svelte-preprocess`, and `ts-jest`:\n\n   ```shell\n   npm install typescript svelte-preprocess ts-jest -D\n   ```\n\n#### ESM version\n\n1. Create a `svelte.config.js` at the root of your project:\n\n   ```js\n   import preprocess from 'svelte-preprocess'\n\n   /** @type {import('@sveltejs/kit').Config} */\n   export default config = {\n     preprocess: preprocess(),\n     // ...\n   };\n   ```\n\n   To learn what options you can pass to `sveltePreprocess`, please refer to the [documentation](https://github.com/sveltejs/svelte-preprocess/blob/main/docs/preprocessing.md#typescript).\n\n1. In your Jest config, enable preprocessing for `svelte-jester`, and add `ts-jest` as a transform:\n\n   ```json\n   \"transform\": {\n     \"^.+\\\\.svelte$\": [\n       \"svelte-jester\",\n       {\n         \"preprocess\": true\n       }\n     ],\n     \"^.+\\\\.ts$\": [\n       \"ts-jest\",\n       {\n         \"useESM\": true\n         // optional: seperate tsconfig for tests\n         //\"tsconfig\": \"tsconfig.spec.json\",\n       }\n     ],\n   },\n   \"moduleFileExtensions\": [\n     \"js\",\n     \"ts\",\n     \"svelte\"\n   ],\n   \"extensionsToTreatAsEsm\": [\n     \".svelte\",\n     \".ts\"\n   ],\n   ```\n\nHowever if you do not want to create a `svelte.config.js` at the root of your\nproject or you wish to use a custom config just for tests, you may pass the\npath to the config file to the `preprocess` option thus:\n\n```json\n  \"transform\": {\n    \"^.+\\\\.svelte$\": [\n      \"svelte-jester\",\n      {\n        \"preprocess\": \"/some/path/to/svelte.config.js\"\n      }\n    ],\n    \"^.+\\\\.ts$\": [\n      \"ts-jest\",\n      {\n        \"useESM\": true\n        // optional: seperate tsconfig for tests\n        //\"tsconfig\": \"tsconfig.spec.json\",\n      }\n    ],\n  },\n  \"moduleFileExtensions\": [\n    \"js\",\n    \"ts\",\n    \"svelte\"\n  ],\n  \"extensionsToTreatAsEsm\": [\n    \".svelte\",\n    \".ts\"\n  ],\n```\n\n#### CJS version\n\n1. Create a `svelte.config.js` at the root of your project:\n\n   ```js\n   const sveltePreprocess = require(\"svelte-preprocess\");\n\n   module.exports = {\n     preprocess: sveltePreprocess({\n       // ...\n     }),\n   };\n   ```\n\n   To learn what options you can pass to `sveltePreprocess`, please refer to the [documentation](https://github.com/sveltejs/svelte-preprocess/blob/main/docs/preprocessing.md#typescript).\n\n1. In your Jest config, enable preprocessing for `svelte-jester`, and add `ts-jest` as a transform:\n\n   ```json\n   \"transform\": {\n     \"^.+\\\\.svelte$\": [\n       \"./node_modules/svelte-jester/dist/transformer.cjs\",\n       {\n         \"preprocess\": true\n       }\n     ],\n     \"^.+\\\\.ts$\": \"ts-jest\"\n   },\n   \"moduleFileExtensions\": [\n     \"js\",\n     \"ts\",\n     \"svelte\"\n   ]\n   ```\n\nHowever if you do not want to create a `svelte.config.js` at the root of your\nproject or you wish to use a custom config just for tests, you may pass the\npath to the config file to the `preprocess` option thus:\n\n```json\n  \"transform\": {\n    \"^.+\\\\.svelte$\": [\n      \"./node_modules/svelte-jester/dist/transformer.cjs\",\n      {\n        \"preprocess\": \"/some/path/to/svelte.config.js\"\n      }\n    ],\n    \"^.+\\\\.ts$\": \"ts-jest\"\n  },\n  \"moduleFileExtensions\": [\n    \"js\",\n    \"ts\",\n    \"svelte\"\n  ]\n```\n\nNote that TypeScript supports ES modules, so if you were previously using babel-jest just for ES module transpilation, you can remove babel-jest, babel, and any associated presets and config.\n\nBy default, ts-jest will only transpile .ts files though, so if you want to continue using ES modules in .js files, you'll need to configure ts-jest to process .js files as well.\nTo do this, update the file glob above, and follow the instructions in the [ts-jest docs](https://kulshekhar.github.io/ts-jest/).\n\n### Preprocess\n\nPreprocessors are loaded from `svelte.config.js` or `svelte.config.cjs`.\n\nAdd the following to your Jest config:\n\n```json\n\"transform\": {\n  \"^.+\\\\.svelte$\": [\"svelte-jester\", { \"preprocess\": true }]\n}\n```\n\nFor CJS, replace `\"svelte-jester\"` with `\"./node_modules/svelte-jester/dist/transformer.cjs\"`.\n\nCreate a `svelte.config.js` file and configure it, see\n[svelte-preprocess](https://github.com/kaisermann/svelte-preprocess) for more information.\n\nIn CJS mode, `svelte-jester` must start a new a process for each file needing to be preprocessed, which adds a performance overhead.\n\nIn ESM mode, this isn't necessary. You can set `NODE_OPTIONS=--experimental-vm-modules` and `\"extensionsToTreatAsEsm\": [\".svelte\"]` to run in ESM mode. However, be aware that ESM support in Jest is still experimental as according to their [docs](https://jestjs.io/docs/ecmascript-modules). Follow the development along at https://github.com/facebook/jest/issues/9430.\n\n## Options\n\n`preprocess` (default: false): Pass in `true` if you are using Svelte preprocessors.\nThey are loaded from `svelte.config.js` or `svelte.config.cjs`.\n\n`debug` (default: false): If you'd like to see the output of the compiled code then pass in `true`.\n\n`svelteVersion` (default: actual Version from Svelte package): If you'd like to override the svelteVersion for some reason.\n\n`compilerOptions` (default: {}): Use this to pass in\n[Svelte compiler options](https://svelte.dev/docs#svelte_compile).\n\n`rootMode` (default: \"\"): Pass in `upward` to walk up from the transforming file's directory and use the first `svelte.config.js` or `svelte.config.cjs` found, or throw an error if no config file is discovered. This is particularly useful in a monorepo as it allows you to:\n\n- Run tests from the worktree root using Jest projects where you only want to put `svelte.config.js` in workspace folders, and not in the root.\n- Run tests from the worktree root using Jest projects, but have different `svelte.config.js` configurations for individual workspaces.\n- Have one common `svelte.config.js` in your worktree root (or any directory above the file being transformed) without needing individual `svelte.config.js` files in each workspace. _Note - this root config file can be overriden if necessary by putting another config file into a workspace folder_\n\nThe default mode is to load `svelte.config.js` or `svelte.config.cjs` from the current project root to avoid the risk of accidentally loading a config file from outside the current project folder.\n\nWhen `upward` is set it will stop at the first config file it finds above the file being transformed, but will walk up the directory structure all the way to the filesystem root if it cannot find any config file. This means that if there is no `svelte.config.js` or `svelte.config.cjs` file in the project above the file being transformed, it is always possible that someone will have a forgotten config file in their home directory which could cause unexpected errors in your builds.\n\n### CJS mode options\n\n`showConsoleLog` (default: false): If you'd like to see console.logs of the preprocessors then pass in `true`. Otherwise these will be surpressed, because the compiler could complain about unexpected tokens.\n\n`maxBuffer` (default: 10485760): Sets limit for buffer when `preprocess` is true. It defines the largest amount of data in bytes allowed on stdout or stderr for [child_process.spawnSync](https://nodejs.org/api/child_process.html#child_process_child_process_spawnsync_command_args_options). If exceeded, the child process is terminated and any output is truncated. The default value of 10Mb overrides Node's default value of 1Mb.\n\n```json\n\"transform\": {\n  \"^.+\\\\.js$\": \"babel-jest\",\n  \"^.+\\\\.svelte$\": [\"./node_modules/svelte-jester/dist/transformer.cjs\", {\n    \"preprocess\": false,\n    \"debug\": false,\n    \"compilerOptions\": {},\n    \"rootMode\": \"\",\n    \"maxBuffer\": 15000000\n  }]\n}\n```\n\n## Testing Library\n\nThis package is required when using Svelte with the [Testing Library](https://testing-library.com/).\nIf you'd like to avoid including implementation details in your tests, and making them more\nmaintainble in the long run, then consider checking out\n[@testing-library/svelte](https://github.com/testing-library/svelte-testing-library).\n\n## Credits\n\nThanks to all contributors, inspired by:\n\n- https://github.com/pngwn/svelte-test\n- https://github.com/WeAreGenki/minna-ui\n- https://github.com/rspieker/jest-transform-svelte\n\n## LICENSE\n\n[MIT](LICENSE)\n\n\u003c!-- prettier-ignore-start --\u003e\n[package]: https://www.npmjs.com/package/svelte-jester\n[version-badge]: https://img.shields.io/npm/v/svelte-jester\n[license]: https://github.com/svelteness/svelte-jester/blob/main/LICENSE\n[license-badge]: https://img.shields.io/github/license/svelteness/svelte-jester?color=b\n\u003c!-- prettier-ignore-end --\u003e","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvelteness%2Fsvelte-jester","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsvelteness%2Fsvelte-jester","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvelteness%2Fsvelte-jester/lists"}