[Pre-release] Update Dynamic Modules to Load from S3 Bucket

[timwright12]

Currently all CSS and JS is loading from the appropriate S3 bucket (prod/staging/dev), however when using dynamic modules (lazy loaded modules) the script reference is coming from *.va.gov. Once redirects for the content build separation are implemented, these modules will likely have some issues since va.gov content will be redirected to the content s3 bucket and these scripts will live in the assets S3 bucket.

We need to ensure that these dynamic modules are loading scripts from the S3 bucket instead of *.va.gov

Slack threads for more context When we discovered this issue: https://dsva.slack.com/archives/CQH357ZTP/p1600876610006000

List of files affected: https://dsva.slack.com/archives/CQH357ZTP/p1608757444264200?thread_ts=1608754859.261200&cid=CQH357ZTP

Example page https://www.va.gov/education/how-to-apply/

Confirmation Instructions

1. Visit example URL
2. Open developer console
3. Select, "Network" tab, then "JS" option
4. Reload the page (you'll see all the JS reference load in)
5. Hover static-pages.entry noticing it is loading from S3 (https://prod-va-gov-assets.s3-us-gov-west-1.amazonaws.com/generated/static-pages.entry.7999f688de01b22cbf13-1609186191089.js)
6. Find a file in the list labeled: application-status.entry (should be around 9th in the list)
7. Hover the file name to see where it is loading from - if successful, this file should be loading from S3 as well

Spot check this in other parts of the site as well to confirm.

[timwright12]

Working branch: feature/17899-load-dynamic-modules-from-s3

Working PR

[meganhkelley]

Current status: making changes to Webpack to see if review instance goes out and is working properly before pushing to staging. If all goes well could be in production this week (but can also wait and be handed to Chris A as needed)

Background: dynamic modules were never updated to load from S3, which is where all javascript assets must be located.

Also this will fix the cacheing issue we were having when we took the file hashes off initially (bc dynamic modules were pointing to va.gov). Now they will have the same cache as all other js files. Should be able to remove hashes but will need a separate ticket for that.

Related PRs: https://github.com/department-of-veterans-affairs/vets-website/pulls?q=is%3Apr+author%3Atimwright12+hash

[timwright12]

Current status: a PR is in place to activate this on dev: https://github.com/department-of-veterans-affairs/vets-website/pull/15513

[meganhkelley]

2 things that need to happen:

• Content build pipeline failing, needs to be updated to work with the new file-manifest
• Cypress integration tests & Nightwatch e2e in pipeline activation failing - Tim looking into this

[timwright12]

This is active in staging and dev, PR to activate in prod https://github.com/department-of-veterans-affairs/vets-website/pull/15659

Slack ping: https://dsva.slack.com/archives/CQH357ZTP/p1610716163003800?thread_ts=1610131110.328700&cid=CQH357ZTP

[timwright12]

This ticket is complete, dynamic module assets are now loading from the proper S3 bucket on prod, staging, and dev. We can see this happening via full S3 paths in the file-manifest for each environment:

Prod: https://prod-va-gov-assets.s3-us-gov-west-1.amazonaws.com/generated/file-manifest.json Staging: https://staging-va-gov-assets.s3-us-gov-west-1.amazonaws.com/generated/file-manifest.json Dev: https://dev-va-gov-assets.s3-us-gov-west-1.amazonaws.com/generated/file-manifest.json

We can also spot check the modules themselves via:

Prod: https://www.va.gov/education/how-to-apply/ https://www.va.gov/resources/find-apps-you-can-use/

Staging: https://staging.va.gov/education/how-to-apply/ https://staging.va.gov/resources/find-apps-you-can-use/

Dev: https://dev.va.gov/education/how-to-apply/ https://dev.va.gov/resources/find-apps-you-can-use/