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 BroadcastChannel 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.