diff --git a/README.md b/README.md index 384efee75..6c352a86f 100644 --- a/README.md +++ b/README.md @@ -132,18 +132,29 @@ export default function SampleApp() { We recommend [Vitest](https://vitest.dev/) for unit testing since [Vitest](https://vitest.dev/guide/why.html) natively supports [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules). -If you are using [Jest](https://jestjs.io/) for unit testing, you might encounter some issues since [Jest](https://jestjs.io/docs/ecmascript-modules) does not support [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) by default. Therefore, you will need to make following configuration changes to the [Jest configuration file](https://jestjs.io/docs/configuration). +If you are using [Jest](https://jestjs.io/) for unit testing, you might encounter some issues since [Jest](https://jestjs.io/docs/ecmascript-modules) does not support [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) by default. Therefore, you will need to make following configuration changes. -Add the below to `package.json` +Update the `package.json` file if you have initialized your project with [Create React App](https://create-react-app.dev/). ```json { "scripts": { - "test": "jest --transformIgnorePatterns \"node_modules/(?!(@westpac/ui)/)\"" + "test": "node scripts/test.js --transformIgnorePatterns \"node_modules/(?!(@westpac/ui)/)\"" } } ``` +Update the `jest.config.js` file if you have initialized your project with [Nx build system](https://nx.dev/) and [Babel](https://babeljs.io/). + +```js +{ + transform: { + '^.+\\.[tj]sx?$': ['babel-jest', { presets: ['@nrwl/react/babel'] }] + }, + transformIgnorePatterns: ['node_modules/(?!@westpac/ui)'] +} +``` + ## Documentation Visit [https://gel.westpacgroup.com.au/design-system](https://gel.westpacgroup.com.au/design-system) to view the full documentation. diff --git a/apps/site/src/content/design-system/development/guides/unit-testing/design/unit-testing/content.mdoc b/apps/site/src/content/design-system/development/guides/unit-testing/design/unit-testing/content.mdoc index cd38e5b17..54ccff5af 100644 --- a/apps/site/src/content/design-system/development/guides/unit-testing/design/unit-testing/content.mdoc +++ b/apps/site/src/content/design-system/development/guides/unit-testing/design/unit-testing/content.mdoc @@ -1,14 +1,30 @@ We recommend [Vitest](https://vitest.dev/) for unit testing since [Vitest](https://vitest.dev/guide/why.html) natively supports [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules). -If you are using [Jest](https://jestjs.io/) for unit testing, you might encounter some issues since [Jest](https://jestjs.io/docs/ecmascript-modules) does not support [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) by default. Therefore, you will need to make following configuration changes to the [Jest configuration file](https://jestjs.io/docs/configuration). +If you are using [Jest](https://jestjs.io/) for unit testing, you might encounter some issues since [Jest](https://jestjs.io/docs/ecmascript-modules) does not support [ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) by default. Therefore, you will need to make following configuration changes. + +Update the `package.json` file if you have initialized your project with [Create React App](https://create-react-app.dev/). ```html ``` + +Update the `jest.config.js` file if you have initialized your project with [Nx build system](https://nx.dev/) and [Babel](https://babeljs.io/). + +```html + +```