Initialize the client with a predictable Redux state object

For sanity, we should initialize the client (i.e. rendered HTML) with a predictable Redux state object.

For QA: This change could affect the entire app but only for the first page load. Please test as much as possible with this approach:

• Load the site, navigate to another page
• Click the browser refresh button
• Make sure the page looks correct after refresh
• Navigate somewhere else, click refresh, verify, and repeat…

---

How is the current Redux state object unpredictable, you ask? Well, let me begin by mourning the hours of my life lost to this bug. Thanks, let’s continue. You can see it in action like this:

• Go to https://addons-dev.allizom.org/en-US/firefox/addon/icloud-test-dev/ in Chrome so you can use Redux Devtools. Be sure to load the URL directly instead of navigating there from another page.
• With Redux Devtools, select the @@INIT action and open the State tab to see the initial state that the page was loaded with.
• Open up addonsByAuthors and you should see something like: loadingFor: { ValentinaDDD-extension: true }.

This means the client will think it’s in a loading state yet nothing will ever load!

If you use the logger from https://github.com/mozilla/addons-frontend/pull/6724 then you’ll see how the final server render dispatches FETCH_ADDONS_BY_AUTHORS just quick enough to modify state before ServerHtml renders its HTML.

Funny enough, the AddonsByAuthors component does not check if data has already been loaded or is in the process of loading before beginning to load data. Hmm, I wonder if there is a trail of tears behind that decision! All other components would have trouble here because it would be impossible to know if it is safe to begin loading data or not.

[ioanarusiczki]

@willdurand Ok, I will re-check for other pages too and return with the test results.

[willdurand]

I changed the milestone because the patch has landed after this week’s tag.