Jest failing with 'Unexpected token' error on typescript syntax

[benjgil]

If you see jest failing with an 'unexpected token' error, it's likely that you're trying to feed jest untranspiled code, which it doesn't know how to handle.

This almost always occurs when using a package from node_modules that has been developed in typescript (e.g. other bit components), as jest by default doesnt transpile code from node_modules.

What you need to do is to set a config in jest called transformIgnorePatterns which tells jest which specific node_modules packages to transpile before using.

The way to do this, as with all tooling config updates and customisations, is via a custom env. If you already have a custom env that's assigned to your components, then you can skip the initial creation and component env assignment.

In your custom env, assuming you created it via our component templates you'll see that there's a jest folder with code commented out - uncomment all the code lines (not the comment lines), which will provide you with some code to create the right string to pass to the transformIgnorePatterns field.
Then just add the package name (if it's prefixed with a @some-scope then you can just pass that scope and jest will transpile all components from that scope) that's giving you your error in the packagesToExclude array.

Once you've done this, in the main.runtime file of your custom env, search for jest and you'll see the following line, which you should also uncomment:
// react.overrideJestConfig(require.resolve('./jest/jest.config')),

Now just compile your env, and then re-compile your component (or just run bit compile twice, once for the env and then again to use the updated env to compile your components) - and then the bit test error should go away.