msw: Mocks fail intermittently when multiple browser tabs are open

Describe the bug

The mocks fail intermittently when multiple browser tabs are open

Environment

• msw: 0.15.5
• nodejs: 10.19.0
• react: 16.13.1
• react-scripts: 3.4.1 // create-react-app

Please also provide your browser version. Chrome 81.0.4044.113 (Official Build) (64-bit) Linux - Ubuntu

To Reproduce

• Have set up update on reload for the service worker
• Have multiple browser tabs open, eg:
  • http://localhots:3000/
  • http://localhost:3000/episode/Fz9eb58992-1e0f-4b2a-ac69-37fce2e934df?section=Storylines
• Have MSW setup with following options:

const options = { serviceWorker: { url: '/mockServiceWorker.js' } }

• Have the following MSW rule:

export default [
    rest.get(
        `https://example.com/lists/characters/:rdfID`,
        (_req, res, { json }) => {
            return res(json(characters))
        },
    ),
]

const characters: Character[] = [
    {
        characterId: 'z9540c2f4-0970-de63-9973-ae9cb4ac31b8',
        characterName: 'Pinkie Pie',
    },
    {
        characterId: 'z67416fa2-6883-4c1f-2db9-012984486da6',
        characterName: "Rarity",
    },
]

• Refresh http://localhost:3000/episode/Fz9eb58992-1e0f-4b2a-ac69-37fce2e934df?section=Storylines

Expected behavior

https://example.com/list/characters/Fz9eb58992-1e0f-4b2a-ac69-37fce2e934df Should be mocked, but randomly it’s not.

Workaround

Close all browser tabs but one. This fixes the issue.