Bugfix - Initialize scripts in the correct order

[jimmynotjim]

Fixes an issue where common.js was initializing scripts in the wrong order

Additions

• None

Removals

• None

Changes

• modified page specific scripts with init wrapper to ensure scripts are initialized in the correct order
• ensured jQuery is required first to avoid undefined errors

Testing

• checkout the branch and everything should load exactly the same. Issue is only seen when one scrip requires something from an earlier loaded script, like an event listener.

Review

• @anselmbradford
• @KimberlyMunoz
• @sebworks

Preview

None

Preview this PR without the whitespace changes

Notes

• h/t to @anselmbradford for helping me figure this one out

[sebworks]

Getting a 'jQuery is undefined error when accessing 'http://localhost:7000/blog/were-making-progress-toward-ensuring-fair-access-to-credit/' by clicking the link on landing page.
Never-mind, re-ran grunt and all appears to be well. 👍

It is the Google Tag Manger that is causing the error.

[anselmbradford]

It is the Google Tag Manger that is causing the error.

I'm pretty sure this is a hidden error here and on the live site TBH. Take a look at the live www site source, it loads jQuery after Google Tag Manager. GTM has the async attribute and is doing some fancy initialization, so the page continues to load and most likely jQuery will have loaded by the time it's needed. However, if jQuery takes longer to load than GTM, it'll run its code looking for jQuery before jQuery has been downloaded. I see nothing stopping that from happening in the live source. I suspect this could strike on weak 3G connections and the like.

[jimmynotjim]

So that would mean we're not capturing stats on any browsing instance where the GTM beats out jQuery right?

[sebworks]

@jimmynotjim , Great point. Needs to be investigated if we think it's occurring on production and thus the stats are bonked.

[jimmynotjim]

Linking this conversation to #496. As far as the scope of this PR, everything good?

[sebworks]

yep, 👍

[bethannenc]

Hi - I'm having issues following this thread. Is there someone I could hop on a call with? Are you all seeing the error on one page in particular? If so, I can test to see the impact on analytics. Chuck should also be included in this conversation.

[jimmynotjim]

@bethannenc
Unfortunately the issue isn't consistent, showing up at random. Here's a screenshot

Emailing you the staging url so you can give it a test.

[bethannenc]

Is it only happening on pages where JQuery is not present? Or is it happening on pages that do have JQuery?

@wernerc - you should be roped into this as well.

[jimmynotjim]

The issue is outside the scope of this PR (which will be closed once merged). Let's keep this discussion in #496 so that it's not lost once that happens.

[KimberlyMunoz]

It looks like it's pretty consistently happening on slower connections or bigger pages. If you open Chrome Developer Tool's network emulator and set it to "Good 3G" or lower you can get the gtm.js errors consistently.

[bethannenc]

Are you all only seeing the error on demo or are you seeing it on www.consumerfinance.gov as well?

[jimmynotjim]

I can not replicate this on www.consumerfinance.gov. Looking at the page source, jQuery is defined before GTM (L:70 and L:85) respectively. @anselmbradford where did you see jQuery loaded after GTM?

As far as this PR, updated the changelog and merging.