fix: [M3-7177] - Fix MSW not always intercepting API calls

[bnussman-akamai]

Description 📝

Sometimes, with the MSW on, you load the app and some API calls don't get properly intercepted and the real API responds with data. I think this is because the MSW is not always being initialized before our app loads.

I think this use to not be an issue, but I think #9525 made it so that the MSW gets enabled later than it use to, causing this race condition.

This PR brings back some logic from #9525 (but using async/await instead of a callback) that will load dev tools before we render the app.

Major Changes 🔄

• Adjusts dev-tools logic so that the app is rendered after dev tools are dynamically imported
  • We use to do this but I changed this in chore: Clean up how dev tools are initialized #9525 which has possibly caused an issue for us

How to test 🧪

Note

This seemed to be like a race condition so it is hard to reproduce the bug or verify the fix works

• Check out this PR
• Turn on the MSW
• Verify that all API data (like regions, linodes, etc) is coming from the MSW and not the real API
• Refresh the page a few times and confirm that every time, data is coming from the MSW and not the real API

[mjac0bs]

🙌🏼 I tested this on various pages and with various refreshes and saw the MSW intercepting requests every time. When I walked through the DC pricing changes, there were no issues we saw earlier with the regions endpoint sometimes not being intercepted correctly and not returning the mocked region data from cached regions we would expect.

Thank you for fixing!

types is intercepted by the MSW:

regions is intercepted by the MSW and includes the expected cached region data:

[mjac0bs]

Hmm. I'm looking back at this PR now because I wanted to make sure this fix was true for both localhost and the PR preview link. I am still seeing intermittent issues with the PR preview link. For example:

We're missing the expected id-cgk and br-gru regions here:

The request says it's from the MSW:

but the regions data is not returned:

[bnussman-akamai]

@mjac0bs and I talked this over and we think that that it is expected behavior for the preview link to exclude cgk and gru because the CI pipeline overrides the cached regions on every build.

[abailly-akamai]

Tested and looks good! thanks for the fix.

Confirmed locally ✅

And yes, can confirm the cache gets overridden. If you run a production build locally you'll get the same problem 👍