HTML Caching and SW Communication API Implementation. #1905

revanth0212 · 2019-10-18T20:19:23Z

Description

HTML Caching and Service Worker Communication API Implementation. The service worker will be following the StaleWhileRevalidate strategy for all HTML files. It will return the readily available file from the cache and try to update the file in the background. If the file happens to be different from the one already in the cache, it will send a message to the UI about an update available and a button in the message to refresh the page.

Related Issue

Closes #1772 #1781

Verification Steps

Build and start the server using yarn build && yarn stage:venia.
Refresh the page once after it has loaded up. This will make sure that the Service Worker is installed successfully.
Open venia-concept/dist/index.html and make a change like adding a new script tag
<script>console.log('Hey this is a new HTML')</script>
Now navigate to a different page like Category or Product by clicking on the appropriate links/pictures. Note: Do not refresh the page.
Once you navigate to a new page, a toast should show up in the bottom letting you know that an update is available.

Screenshots / Screen Captures (if appropriate)

Checklist

No functional change. Make sure both yarn stage:venia and yarn watch:venia should work like previous.
Should be merged only after Service Worker HTML Handling #1874 is merged.

… is not mentioned. Weird.

Co-Authored-By: Andy Terranova <13182778+supernova-at@users.noreply.github.com>

…gento/pwa-studio into revanth/serviceWorkerRefactor

…ime.

…ngRefactor' into revanth/swCachingHTML

packages/peregrine/lib/store/actions/app/actions.js

packages/peregrine/lib/store/reducers/app.js

packages/peregrine/lib/store/actions/app/actions.js

sirugh · 2019-10-30T15:29:38Z

packages/venia-concept/src/registerSW.js

+                console.log('SW Registered');
+            })
+            .catch(() => {
+                window.console.warn('Failed to register SW.');


Why window here and not in the .then?

Hmm yeah I thought this got dropped to just console.log and our minifier would drop console.logs (so this won't show up in production)

Yeah console.* gets removed by webpack for production. But we need a warning for SW not registering. That is why I used window.console.*

Please add a comment to that affect so we don't accidentally "fix" that in some later work.

sirugh

Verification steps work! This looks good. I had a few small things I'd like to see but otherwise this is great. Fix them and I'll approve.

sirugh · 2019-10-30T20:14:55Z

packages/venia-concept/src/registerSW.js

+                console.log('SW Registered');
+            })
+            .catch(() => {
+                window.console.warn('Failed to register SW.');


Please add a comment to that affect so we don't accidentally "fix" that in some later work.

sirugh · 2019-10-30T20:15:23Z

packages/venia-concept/src/registerSW.js

@@ -0,0 +1,22 @@
+import { handleMessageFromSW } from '@magento/venia-ui/lib/util/swUtils';


If moving this stuff to venia-concept is a "TODO" then open an issue for it :)

revanth0212 · 2019-10-30T20:34:36Z

Verification steps work! This looks good. I had a few small things I'd like to see but otherwise this is great. Fix them and I'll approve.

I have added the comment. Regarding moving files to venia-ui I am not sure if we need to do it or not. I feel we do but it is @zetlen who has to make the call.

revanth0212 and others added 30 commits September 30, 2019 15:44

Refactored sw.js

48ee864

Modified webpack to use the new service worker folder structure.

25b6a92

Refactored ServiceWorkerPlugin.

1c3e8b2

Refactored configureWebpack.js

b3cdb0b

Fix fileDependencies check.

9ceb7ea

Merged develop into current.

8ded8b8

Minor.

4dbf7c6

Adding png to image loader test regex.

36c96de

Enabling service worker debugging.

b652430

for of syntax change because jest does not understand if const or let…

44cf162

… is not mentioned. Weird.

Tests update.

8900491

Merge branch 'develop' into revanth/serviceWorkerRefactor

fcd2e44

Code refactor to fix build issues.

9971595

Merge branch 'develop' into revanth/serviceWorkerRefactor

23ac826

Renaming default variable names.

0a12afb

Update packages/pwa-buildpack/lib/Utilities/getServiceWorkerConfig.js

9b40504

Co-Authored-By: Andy Terranova <13182778+supernova-at@users.noreply.github.com>

Created MAX_NUM_OF_IMAGES_TO_CACHE default.

7bd9e22

Added JSDocs for ServiceWorkerPlugin.

c75084c

Merge branch 'revanth/serviceWorkerRefactor' of https://github.com/ma…

d2b6629

…gento/pwa-studio into revanth/serviceWorkerRefactor

ServiceWorkerPlugin tests refactor.

e0798aa

Rearranging registerRoutes to match venia-ui upward.yml

02d7003

Route matcher regex update.

c48d6d4

Minor.

e6d8ec1

Merge branch 'develop' into revanth/serviceWorkerRouteHandlingRefactor

24deb10

Changed cache key while saving html files.

16c818b

JS files route regex fix.

22a8d38

Intercepting html requests and modifying them to get same html everyt…

e561c7a

…ime.

Merged develop into current.

8b8a923

Merge remote-tracking branch 'origin/revanth/serviceWorkerRouteHandli…

3989313

…ngRefactor' into revanth/swCachingHTML

Added workbox-window dependency.

7aa3a24

sirugh reviewed Oct 30, 2019

View reviewed changes

packages/peregrine/lib/store/actions/app/actions.js Outdated Show resolved Hide resolved

sirugh reviewed Oct 30, 2019

View reviewed changes

packages/peregrine/lib/store/reducers/app.js Outdated Show resolved Hide resolved

sirugh reviewed Oct 30, 2019

View reviewed changes

packages/peregrine/lib/store/actions/app/actions.js Outdated Show resolved Hide resolved

sirugh reviewed Oct 30, 2019

View reviewed changes

Another set of stale code removed.

72d2aab

revanth0212 dismissed supernova-at’s stale review via 72d2aab October 30, 2019 15:30

revanth0212 and others added 2 commits October 30, 2019 10:31

More stale code deleted.

c0c269e

Merge branch 'develop' into revanth/workboxWindowIntegration

a8fc460

m2-community-project bot added Progress: changes requested and removed Progress: approved labels Oct 30, 2019

revanth0212 mentioned this pull request Oct 30, 2019

Improve Jest error detection and reporter output (#1615) #1948

Merged

revanth0212 and others added 3 commits October 30, 2019 13:22

Minor.

9e32bae

Merge branch 'develop' into revanth/workboxWindowIntegration

a3dde44

Mocking .section for env variables.

257bd98

sirugh requested changes Oct 30, 2019

View reviewed changes

Minor.

c146c2e

sirugh approved these changes Oct 30, 2019

View reviewed changes

revanth0212 and others added 2 commits October 31, 2019 10:08

Merge branch 'develop' into revanth/workboxWindowIntegration

d6efff9

Merge branch 'develop' into revanth/workboxWindowIntegration

c82d607

m2-community-project bot added Progress: approved and removed Progress: changes requested labels Oct 31, 2019

m2-community-project bot removed the Progress: approved label Oct 31, 2019

Merge branch 'develop' into revanth/workboxWindowIntegration

137e657

dpatil-magento merged commit 1883d21 into develop Oct 31, 2019

dpatil-magento deleted the revanth/workboxWindowIntegration branch October 31, 2019 17:42

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

HTML Caching and SW Communication API Implementation. #1905

HTML Caching and SW Communication API Implementation. #1905

revanth0212 commented Oct 18, 2019 •

edited

Loading

sirugh Oct 30, 2019

supernova-at Oct 30, 2019

revanth0212 Oct 30, 2019

sirugh Oct 30, 2019

sirugh left a comment

sirugh Oct 30, 2019

sirugh Oct 30, 2019

revanth0212 commented Oct 30, 2019

		@@ -0,0 +1,22 @@
		import { handleMessageFromSW } from '@magento/venia-ui/lib/util/swUtils';

HTML Caching and SW Communication API Implementation. #1905

HTML Caching and SW Communication API Implementation. #1905

Conversation

revanth0212 commented Oct 18, 2019 • edited Loading

Description

Related Issue

Verification Steps

Screenshots / Screen Captures (if appropriate)

Checklist

sirugh Oct 30, 2019

Choose a reason for hiding this comment

supernova-at Oct 30, 2019

Choose a reason for hiding this comment

revanth0212 Oct 30, 2019

Choose a reason for hiding this comment

sirugh Oct 30, 2019

Choose a reason for hiding this comment

sirugh left a comment

Choose a reason for hiding this comment

sirugh Oct 30, 2019

Choose a reason for hiding this comment

sirugh Oct 30, 2019

Choose a reason for hiding this comment

revanth0212 commented Oct 30, 2019

revanth0212 commented Oct 18, 2019 •

edited

Loading