An Interest In:
Web News this Week
- April 1, 2024
- March 31, 2024
- March 30, 2024
- March 29, 2024
- March 28, 2024
- March 27, 2024
- March 26, 2024
How to solve 'BroadcastChannel is not defined'
When using BroadcastChannel with React in your application, you probably will face with this issue if try to run some tests with React Testing Library and Jest:
ReferenceError: BroadcastChannel is not defined 51 | 52 | useEffect(() => { > 53 | authChannel = new BroadcastChannel('auth') | ^
To resolve this, I tried to mock BroadcastChannel creating a broadcast.ts
file inside __mocks__
folder with this content:
jest.mock('BroadcastChannel')
Now, you probably will face with this issue:
Cannot find module 'BroadcastChannel' from 'src/__mocks__/broadcast.ts' Require stack: src/__mocks__/broadcast.ts > 1 | jest.mock('BroadcastChannel') | ^ 2 |
Jest can't find BroadcastChannel because is not a module, then, it is necessary install BroadcastChannel module (this helps your tests and help old browsers support).
yarn add broadcast-channel
Then, import BoradcastChannel where you are using (just add import, your code should be the same).
import { BroadcastChannel } from 'broadcast-channel'
In the last step, you need to change you mock file that you created at start to mock broadcast-channel module:
jest.mock('broadcast-channel')
That's It!
Now your tests should pass and you can work with jest using BroadcastChannel perfectly.
Original Link: https://dev.to/akinncar/how-to-solve-broadcastchannel-is-not-defined-4cjh
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To