diff --git a/.changeset/gorgeous-jars-hear.md b/.changeset/gorgeous-jars-hear.md new file mode 100644 index 000000000..ee8b23131 --- /dev/null +++ b/.changeset/gorgeous-jars-hear.md @@ -0,0 +1,22 @@ +--- +'@vanilla-extract/jest-transform': minor +--- + +Allow configuring [custom identifiers] in the jest transformer + +**EXAMPLE USAGE**: + +```js +// jest.config.js + +export default { + transform: { + '^.+\\.css.ts$': [ + '@vanilla-extract/jest-transform', + { identifiers: ({ hash }) => `${hash}_myCustomIdentifier` }, + ], + }, +} +``` + +[custom identifiers]: https://vanilla-extract.style/documentation/integrations/webpack/#identifiers diff --git a/packages/jest-transform/src/index.ts b/packages/jest-transform/src/index.ts index 28cfdbfa2..5a649e1cd 100644 --- a/packages/jest-transform/src/index.ts +++ b/packages/jest-transform/src/index.ts @@ -4,39 +4,46 @@ import { transformSync, getPackageInfo, cssFileFilter, + IdentifierOption, } from '@vanilla-extract/integration'; import * as esbuild from 'esbuild'; -const vanillaTransformer: Transformer = { - canInstrument: false, - process(source, filePath, options) { - if (!cssFileFilter.test(filePath)) { - // If the file that passes through to the transformer is not a VE file, - // then it's likely a vanilla .css file (because Jest can't differentiate - // between them) - return { - code: `module.exports = ${JSON.stringify(path.basename(filePath))};`, - }; - } +interface TransformerConfig { + identifiers: IdentifierOption; +} - const { name: packageName } = getPackageInfo(options.config.rootDir); +function createTransformer(config: TransformerConfig): Transformer { + const { identifiers = 'debug' } = config; + return { + canInstrument: false, + process(source, filePath, options) { + if (!cssFileFilter.test(filePath)) { + // If the file that passes through to the transformer is not a VE file, + // then it's likely a vanilla .css file (because Jest can't differentiate + // between them) + return { + code: `module.exports = ${JSON.stringify(path.basename(filePath))};`, + }; + } + const { name: packageName } = getPackageInfo(options.config.rootDir); - const code = transformSync({ - source, - filePath, - rootPath: options.config.rootDir, - packageName: packageName, - identOption: 'debug', - }); + const code = transformSync({ + source, + filePath, + rootPath: options.config.rootDir, + packageName: packageName, + identOption: identifiers, + }); - const result = esbuild.transformSync(code, { - format: options.supportsStaticESM ? 'esm' : 'cjs', - target: 'es2018', - loader: 'ts', - }); + const result = esbuild.transformSync(code, { + format: options.supportsStaticESM ? 'esm' : 'cjs', + target: 'es2018', + loader: 'ts', + }); - return result; - }, -}; + return result; + }, + }; +} -export default vanillaTransformer; +export default { createTransformer };