Merge pull request #15352 from vector-im/t3chguy/remove-workbox

Remove workbox
This commit is contained in:
Michael Telatynski 2020-10-01 14:40:26 +01:00 committed by GitHub
commit 7b71db94e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 98 additions and 1313 deletions

View File

@ -143,8 +143,7 @@
"typescript": "^3.7.3", "typescript": "^3.7.3",
"webpack": "^4.41.2", "webpack": "^4.41.2",
"webpack-cli": "^3.3.10", "webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0", "webpack-dev-server": "^3.9.0"
"workbox-webpack-plugin": "^5.1.4"
}, },
"jest": { "jest": {
"testEnvironment": "jest-environment-jsdom-fourteen", "testEnvironment": "jest-environment-jsdom-fourteen",

1
res/sw.js Normal file
View File

@ -0,0 +1 @@
self.addEventListener('fetch', () => {});

View File

@ -61,6 +61,7 @@ const INCLUDE_LANGS = [
// "dest/b/...". // "dest/b/...".
const COPY_LIST = [ const COPY_LIST = [
["res/manifest.json", "webapp"], ["res/manifest.json", "webapp"],
["res/sw.js", "webapp"],
["res/welcome.html", "webapp"], ["res/welcome.html", "webapp"],
["res/welcome/**", "webapp/welcome"], ["res/welcome/**", "webapp/welcome"],
["res/themes/**", "webapp/themes"], ["res/themes/**", "webapp/themes"],

View File

@ -55,6 +55,16 @@
<section id="matrixchat" style="height: 100%; overflow: auto;" class="notranslate"></section> <section id="matrixchat" style="height: 100%; overflow: auto;" class="notranslate"></section>
<script src="<%= htmlWebpackPlugin.files.chunks['bundle'].entry %>"></script> <script src="<%= htmlWebpackPlugin.files.chunks['bundle'].entry %>"></script>
<!-- Legacy supporting Prefetch images -->
<img src="<%= require('matrix-react-sdk/res/img/warning.svg') %>" width="24" height="23" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/e2e/warning.svg') %>" width="24" height="23" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/feather-customised/warning-triangle.svg') %>" width="24" height="23" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/format/bold.svg') %>" width="25" height="22" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/format/code.svg') %>" width="25" height="22" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/format/italics.svg') %>" width="25" height="22" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/format/quote.svg') %>" width="25" height="22" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<img src="<%= require('matrix-react-sdk/res/img/format/strikethrough.svg') %>" width="25" height="22" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<audio id="messageAudio"> <audio id="messageAudio">
<source src="media/message.ogg" type="audio/ogg" /> <source src="media/message.ogg" type="audio/ogg" />
<source src="media/message.mp3" type="audio/mpeg" /> <source src="media/message.mp3" type="audio/mpeg" />

View File

@ -28,6 +28,11 @@ require('highlight.js/styles/github.css');
import {parseQsFromFragment} from "./url_utils"; import {parseQsFromFragment} from "./url_utils";
import './modernizr'; import './modernizr';
// load service worker if available on this platform
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js');
}
async function settled(...promises: Array<Promise<any>>) { async function settled(...promises: Array<Promise<any>>) {
for (const prom of promises) { for (const prom of promises) {
try { try {

View File

@ -34,21 +34,6 @@ const POKE_RATE_MS = 10 * 60 * 1000; // 10 min
export default class WebPlatform extends VectorBasePlatform { export default class WebPlatform extends VectorBasePlatform {
private runningVersion: string = null; private runningVersion: string = null;
constructor() {
super();
// load service worker if available on this platform
if ('serviceWorker' in navigator) {
// Service worker is disabled in webpack-dev-server: https://github.com/GoogleChrome/workbox/issues/1790
if (!process.env.WEBPACK_DEV_SERVER) {
navigator.serviceWorker.register('service-worker.js');
} else {
// we no longer run workbox when in webpack-dev-server, clean it up
navigator.serviceWorker.getRegistration().then(reg => reg && reg.unregister());
}
}
}
getHumanReadableName(): string { getHumanReadableName(): string {
return 'Web Platform'; // no translation required: only used for analytics return 'Web Platform'; // no translation required: only used for analytics
} }

View File

@ -1,10 +1,9 @@
const path = require('path'); const path = require('path');
const {EnvironmentPlugin} = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const WorkboxPlugin = require('workbox-webpack-plugin'); const webpack = require("webpack");
let og_image_url = process.env.RIOT_OG_IMAGE_URL; let og_image_url = process.env.RIOT_OG_IMAGE_URL;
if (!og_image_url) og_image_url = 'https://app.element.io/themes/element/img/logos/opengraph.png'; if (!og_image_url) og_image_url = 'https://app.element.io/themes/element/img/logos/opengraph.png';
@ -32,87 +31,6 @@ module.exports = (env, argv) => {
const reactSdkSrcDir = path.resolve(require.resolve("matrix-react-sdk/package.json"), '..', 'src'); const reactSdkSrcDir = path.resolve(require.resolve("matrix-react-sdk/package.json"), '..', 'src');
const jsSdkSrcDir = path.resolve(require.resolve("matrix-js-sdk/package.json"), '..', 'src'); const jsSdkSrcDir = path.resolve(require.resolve("matrix-js-sdk/package.json"), '..', 'src');
const plugins = [
new EnvironmentPlugin(["WEBPACK_DEV_SERVER"]), // pass this as it is used for conditionally loading workbox
// This exports our CSS using the splitChunks and loaders above.
new MiniCssExtractPlugin({
filename: 'bundles/[hash]/[name].css',
ignoreOrder: false, // Enable to remove warnings about conflicting order
}),
// This is the app's main entry point.
new HtmlWebpackPlugin({
template: './src/vector/index.html',
// we inject the links ourselves via the template, because
// HtmlWebpackPlugin will screw up our formatting like the names
// of the themes and which chunks we actually care about.
inject: false,
excludeChunks: ['mobileguide', 'usercontent', 'jitsi'],
minify: argv.mode === 'production',
vars: {
og_image_url: og_image_url,
},
}),
// This is the jitsi widget wrapper (embedded, so isolated stack)
new HtmlWebpackPlugin({
template: './src/vector/jitsi/index.html',
filename: 'jitsi.html',
minify: argv.mode === 'production',
chunks: ['jitsi'],
}),
// This is the mobile guide's entry point (separate for faster mobile loading)
new HtmlWebpackPlugin({
template: './src/vector/mobile_guide/index.html',
filename: 'mobile_guide/index.html',
minify: argv.mode === 'production',
chunks: ['mobileguide'],
}),
// These are the static error pages for when the javascript env is *really unsupported*
new HtmlWebpackPlugin({
template: './src/vector/static/unable-to-load.html',
filename: 'static/unable-to-load.html',
minify: argv.mode === 'production',
chunks: [],
}),
new HtmlWebpackPlugin({
template: './src/vector/static/incompatible-browser.html',
filename: 'static/incompatible-browser.html',
minify: argv.mode === 'production',
chunks: [],
}),
// This is the usercontent sandbox's entry point (separate for iframing)
new HtmlWebpackPlugin({
template: './node_modules/matrix-react-sdk/src/usercontent/index.html',
filename: 'usercontent/index.html',
minify: argv.mode === 'production',
chunks: ['usercontent'],
}),
];
const isDevServer = process.env.WEBPACK_DEV_SERVER;
if (!isDevServer) {
plugins.push(new WorkboxPlugin.GenerateSW({
maximumFileSizeToCacheInBytes: 22000000,
runtimeCaching: [{
urlPattern: /i18n\/.*\.json$/,
handler: 'CacheFirst',
options: {
cacheName: 'i18n',
expiration: {
maxEntries: 2,
},
},
}],
}));
}
return { return {
...development, ...development,
@ -230,8 +148,8 @@ module.exports = (env, argv) => {
}, },
loader: 'babel-loader', loader: 'babel-loader',
options: { options: {
cacheDirectory: true, cacheDirectory: true
}, }
}, },
{ {
test: /\.css$/, test: /\.css$/,
@ -242,7 +160,7 @@ module.exports = (env, argv) => {
options: { options: {
importLoaders: 1, importLoaders: 1,
sourceMap: true, sourceMap: true,
}, }
}, },
{ {
loader: 'postcss-loader', loader: 'postcss-loader',
@ -280,7 +198,7 @@ module.exports = (env, argv) => {
"local-plugins": true, "local-plugins": true,
}, },
}, },
], ]
}, },
{ {
test: /\.scss$/, test: /\.scss$/,
@ -291,7 +209,7 @@ module.exports = (env, argv) => {
options: { options: {
importLoaders: 1, importLoaders: 1,
sourceMap: true, sourceMap: true,
}, }
}, },
{ {
loader: 'postcss-loader', loader: 'postcss-loader',
@ -318,7 +236,7 @@ module.exports = (env, argv) => {
"local-plugins": true, "local-plugins": true,
}, },
}, },
], ]
}, },
{ {
test: /\.wasm$/, test: /\.wasm$/,
@ -330,9 +248,9 @@ module.exports = (env, argv) => {
}, },
}, },
{ {
// cache-bust i18n .json files placed in // cache-bust languages.json file placed in
// riot-web/webapp/i18n during build by copy-res.js // riot-web/webapp/i18n during build by copy-res.js
test: /i18n\/.*\.json$/, test: /\.*languages.json$/,
type: "javascript/auto", type: "javascript/auto",
loader: 'file-loader', loader: 'file-loader',
options: { options: {
@ -376,10 +294,69 @@ module.exports = (env, argv) => {
}, },
], ],
}, },
], ]
}, },
plugins, plugins: [
// This exports our CSS using the splitChunks and loaders above.
new MiniCssExtractPlugin({
filename: 'bundles/[hash]/[name].css',
ignoreOrder: false, // Enable to remove warnings about conflicting order
}),
// This is the app's main entry point.
new HtmlWebpackPlugin({
template: './src/vector/index.html',
// we inject the links ourselves via the template, because
// HtmlWebpackPlugin will screw up our formatting like the names
// of the themes and which chunks we actually care about.
inject: false,
excludeChunks: ['mobileguide', 'usercontent', 'jitsi'],
minify: argv.mode === 'production',
vars: {
og_image_url: og_image_url,
},
}),
// This is the jitsi widget wrapper (embedded, so isolated stack)
new HtmlWebpackPlugin({
template: './src/vector/jitsi/index.html',
filename: 'jitsi.html',
minify: argv.mode === 'production',
chunks: ['jitsi'],
}),
// This is the mobile guide's entry point (separate for faster mobile loading)
new HtmlWebpackPlugin({
template: './src/vector/mobile_guide/index.html',
filename: 'mobile_guide/index.html',
minify: argv.mode === 'production',
chunks: ['mobileguide'],
}),
// These are the static error pages for when the javascript env is *really unsupported*
new HtmlWebpackPlugin({
template: './src/vector/static/unable-to-load.html',
filename: 'static/unable-to-load.html',
minify: argv.mode === 'production',
chunks: [],
}),
new HtmlWebpackPlugin({
template: './src/vector/static/incompatible-browser.html',
filename: 'static/incompatible-browser.html',
minify: argv.mode === 'production',
chunks: [],
}),
// This is the usercontent sandbox's entry point (separate for iframing)
new HtmlWebpackPlugin({
template: './node_modules/matrix-react-sdk/src/usercontent/index.html',
filename: 'usercontent/index.html',
minify: argv.mode === 'production',
chunks: ['usercontent'],
}),
],
output: { output: {
path: path.join(__dirname, "webapp"), path: path.join(__dirname, "webapp"),

1213
yarn.lock

File diff suppressed because it is too large Load Diff