Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* refractor service worker * exclude license * update dependencies to webpack5 compatible * improve sw * downgrade html-webpack-plugin * precache manifest.json * run e2e test against production * set port * add e2e tests for offline * clean wait * cleanup action * upgrade workbox-webpack-plugin to v6 * revert async function * clean for cypress v6 * fix e2e test * clean test
- Loading branch information
Showing
10 changed files
with
632 additions
and
367 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,4 @@ | ||
{ | ||
"baseUrl": "http://localhost:3000", | ||
"baseUrl": "http://localhost:4200", | ||
"video": false | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,81 @@ | ||
// https://github.com/cypress-io/cypress-example-recipes/blob/master/examples/server-communication__offline/cypress/integration/offline-spec.js | ||
|
||
const goOffline = () => { | ||
cy.log('**go offline**') | ||
.then(() => { | ||
return Cypress.automation('remote:debugger:protocol', { | ||
command: 'Network.enable', | ||
}); | ||
}) | ||
.then(() => { | ||
return Cypress.automation('remote:debugger:protocol', { | ||
command: 'Network.emulateNetworkConditions', | ||
params: { | ||
offline: true, | ||
latency: -1, | ||
downloadThroughput: -1, | ||
uploadThroughput: -1, | ||
}, | ||
}); | ||
}); | ||
}; | ||
|
||
const goOnline = () => { | ||
// disable offline mode, otherwise we will break our tests :) | ||
cy.log('**go online**') | ||
.then(() => { | ||
// https://chromedevtools.github.io/devtools-protocol/1-3/Network/#method-emulateNetworkConditions | ||
return Cypress.automation('remote:debugger:protocol', { | ||
command: 'Network.emulateNetworkConditions', | ||
params: { | ||
offline: false, | ||
latency: -1, | ||
downloadThroughput: -1, | ||
uploadThroughput: -1, | ||
}, | ||
}); | ||
}) | ||
.then(() => { | ||
return Cypress.automation('remote:debugger:protocol', { | ||
command: 'Network.disable', | ||
}); | ||
}); | ||
}; | ||
|
||
describe('offline', () => { | ||
describe('site', { browser: '!firefox' }, () => { | ||
// make sure we get back online, even if a test fails | ||
// otherwise the Cypress can lose the browser connection | ||
beforeEach(goOnline); | ||
afterEach(goOnline); | ||
|
||
it('shows /migrate/ page', () => { | ||
const url = '/migrate/'; | ||
const text = 'Migrate'; | ||
|
||
cy.visit(url); | ||
cy.get('h1').contains(text); | ||
|
||
goOffline(); | ||
|
||
cy.visit(url); | ||
cy.get('h1').contains(text); | ||
|
||
// click `guides` link | ||
cy.get('a[title="guides"]').click(); | ||
cy.get('h1').contains('Guides'); | ||
}); | ||
|
||
it('open print dialog when accessing /printable url', () => { | ||
const url = '/migrate/printable'; | ||
cy.visit(url, { | ||
onBeforeLoad: (win) => { | ||
cy.stub(win, 'print'); | ||
}, | ||
}); | ||
cy.window().then((win) => { | ||
expect(win.print).to.be.calledOnce; | ||
}); | ||
}); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
// we need to precache some assets from ssg too | ||
// they're previously handled by require('./src/utilities/find-files-in-dist')(['.css', '.ico', '.svg']) | ||
|
||
const { Compilation, sources } = require('webpack'); | ||
const getManifestEntriesFromCompilation = require('workbox-webpack-plugin/build/lib/get-manifest-entries-from-compilation'); | ||
|
||
module.exports = class PrecacheSsgManifestPlugin { | ||
apply(compiler) { | ||
compiler.hooks.thisCompilation.tap( | ||
'PrecacheSsgManifestPlugin', | ||
(compilation) => { | ||
compilation.hooks.processAssets.tapPromise( | ||
{ | ||
name: 'PrecacheSsgManifestPlugin', | ||
stage: Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_TRANSFER - 10, | ||
}, | ||
async () => { | ||
const { sortedEntries } = await getManifestEntriesFromCompilation( | ||
compilation, | ||
{ | ||
// we don't want to include all html pages | ||
// as that would take too many storages | ||
// svg excluded as it's already included with InjectManifest | ||
include: [/\.(ico|css)/i, /app-shell/i], | ||
} | ||
); | ||
compilation.emitAsset( | ||
'ssg-manifest.json', | ||
new sources.RawSource(JSON.stringify(sortedEntries)) | ||
); | ||
} | ||
); | ||
} | ||
); | ||
} | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import { precacheAndRoute, matchPrecache } from 'workbox-precaching'; | ||
import { registerRoute } from 'workbox-routing'; | ||
import { CacheableResponsePlugin } from 'workbox-cacheable-response'; | ||
import { CacheFirst, NetworkOnly } from 'workbox-strategies'; | ||
import { ExpirationPlugin } from 'workbox-expiration'; | ||
import { setDefaultHandler, setCatchHandler } from 'workbox-routing'; | ||
import ssgManifest from '../dist/ssg-manifest.json'; | ||
|
||
// Precache assets built with webpack | ||
precacheAndRoute(self.__WB_MANIFEST); | ||
|
||
precacheAndRoute(ssgManifest); | ||
|
||
// Precache manifest.json as ssgManifest couldn't catch it | ||
precacheAndRoute([ | ||
{ | ||
url: '/manifest.json', | ||
revision: '1', // manually update needed when content changed | ||
}, | ||
]); | ||
|
||
// Cache Google Fonts | ||
registerRoute( | ||
/https:\/\/fonts\.gstatic\.com/, | ||
new CacheFirst({ | ||
cacheName: 'google-fonts-cache', | ||
plugins: [ | ||
// Ensure that only requests that result in a 200 status are cached | ||
new CacheableResponsePlugin({ | ||
statuses: [200], | ||
}), | ||
new ExpirationPlugin({ | ||
// Cache for one year | ||
maxAgeSeconds: 60 * 60 * 24 * 365, | ||
maxEntries: 30, | ||
}), | ||
], | ||
}) | ||
); | ||
|
||
setDefaultHandler(new NetworkOnly()); | ||
setCatchHandler(({ event }) => { | ||
switch (event.request.destination) { | ||
case 'document': | ||
return matchPrecache('/app-shell/index.html'); | ||
default: | ||
return Response.error(); | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
b57379d
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs: