Skip to content

Commit 4be6f66

Browse files
committed
Update README
1 parent 9339994 commit 4be6f66

File tree

1 file changed

+48
-2
lines changed

1 file changed

+48
-2
lines changed

README.md

Lines changed: 48 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ implemented, please [file an issue], or consider make a [new pull request].
3434
- [ ] Integrate another end-to-end testing framework to replace [Spectron]
3535
- [ ] Migrate to Webpack 5 `Asset Modules` __*(pending for `v4.2.0`)*__
3636
- [ ] Integrate HMR & Webpack dev server
37+
- [x] Monitor the status of ESM support on [Jest] & [ts-jest]
38+
__*(Check [Known issues](#known-issues) for details)*__
3739

3840
---
3941

@@ -57,6 +59,11 @@ implemented, please [file an issue], or consider make a [new pull request].
5759
to support ES module for its' config file. __Converting the config file to
5860
ES module will result in ESLint not working.__
5961

62+
- As of [`v4.1.2`], [Jest] & [ts-jest] are __NOT__ configured to run the test
63+
files as ES modules, despite all other sections of this boilerplate are
64+
configured to support native ES modules. Please check
65+
[Known issues](#known-issues) for details.
66+
6067
---
6168

6269
## Getting started
@@ -134,6 +141,42 @@ To package your Electron app, run `npm run prod` to get your code compiled in
134141
uses Webpack to minify your code in `production` builds, so there shouldn't
135142
be any significant performance difference with `asar` archiving disabled.
136143

144+
- __IMPORTANT!!!__
145+
146+
As of [`v4.1.2`], the `jest.mock()` function is broken if [Jest] and [ts-jest]
147+
are configured with [ESM Support]. The following code will result in a
148+
`SyntaxError` being thrown when trying to execute the test with Jest.
149+
150+
```ts
151+
import { jest } from '@jest/globals';
152+
import { BrowserWindow } from 'electron';
153+
154+
jest.mock('electron', () => {
155+
BrowserWindow: jest.fn().mockImplementation(() => {
156+
loadFile: jest.fn(() => Promise.resolve()),
157+
on: jest.fn(),
158+
}),
159+
});
160+
```
161+
162+
```
163+
SyntaxError: The requested module 'electron' does not provide an export named 'BrowserWindow'
164+
```
165+
166+
The current solution is to keep using the non ESM supported version of
167+
`jest.config.js`, but with `NODE_OPTIONS=--experimental-vm-modules` set when
168+
running Jest (already set in [`v4.1.2`]). The drawback of this is you won't
169+
be able to use `import.meta` APIs in your code. It could be a deal breaker for
170+
some of you.
171+
172+
I'm closely monitoring the situation atm, and I'll consider rollback the ESM
173+
related setting introduced in [`v4.1.0`] if there's no progress made solving
174+
this issue by the time I prepare the release of `v4.2.0`. You can track the
175+
progress on a related issue [facebook/jest #10025] if you want.
176+
177+
[ESM Support]: https://kulshekhar.github.io/ts-jest/docs/guides/esm-support/
178+
[facebook/jest #10025]: https://github.com/facebook/jest/issues/10025
179+
137180
## Project folders & files
138181
- `dist/` - [Webpack] output location
139182

@@ -163,8 +206,8 @@ To package your Electron app, run `npm run prod` to get your code compiled in
163206
many APIs for IPC. See example as below:
164207
```ts
165208
// ipc-api/index.ts
166-
import submoduleA from './submodule-a';
167-
import submoduleB from './submodule-b';
209+
import submoduleA from './submodule-a.js';
210+
import submoduleB from './submodule-b.js';
168211

169212
export default { ...submoduleA, ...submoduleB };
170213

@@ -217,6 +260,7 @@ To package your Electron app, run `npm run prod` to get your code compiled in
217260
you'd use TypeScript if you're using this boilerplate.
218261

219262
- `main/main.spec.ts` - Sample test file for `src/main/main`
263+
- `utils/node-env.spec.ts` - Unit test for `src/utils/node-env`
220264
- `tsconfig.json` - TypeScript config file for `tests` module
221265
- `.eslintignore` - [ESLint] ignore file
222266
- `.eslintrc.cjs` - [ESLint] config file
@@ -276,6 +320,7 @@ Electron React TypeScript Webpack Boilerplate is open source software
276320
[file an issue]: https://www.electronjs.org
277321
[new pull request]: https://github.com/Devtography/electron-react-typescript-webpack-boilerplate/compare
278322
[Spectron]: https://github.com/electron-userland/spectron
323+
[ts-jest]: https://github.com/kulshekhar/ts-jest
279324
[Playwright]: https://playwright.dev
280325
[WebdriverIO]: https://webdriver.io
281326
[Spectron Deprecation Notice]: https://www.electronjs.org/blog/spectron-deprecation-notice
@@ -291,3 +336,4 @@ Electron React TypeScript Webpack Boilerplate is open source software
291336
[`v3.0.0`]: https://github.com/Devtography/electron-react-typescript-webpack-boilerplate/releases/tag/v3.0.0
292337
[`v4.0.0`]: https://github.com/Devtography/electron-react-typescript-webpack-boilerplate/releases/tag/v4.0.0
293338
[`v4.1.0`]: https://github.com/Devtography/electron-react-typescript-webpack-boilerplate/releases/tag/v4.1.0
339+
[`v4.1.2`]: https://github.com/Devtography/electron-react-typescript-webpack-boilerplate/releases/tag/v4.1.2

0 commit comments

Comments
 (0)