Add a workbox-window package

.eslintrc.js

@@ -11,11 +11,14 @@ module.exports = {
     sourceType: 'module',
   },
   globals: {
-    workbox: false,
-    WorkboxSW: false,
-    SyncEvent: false,
     BroadcastChannel: false,
     Comlink: false,
+    expect: true,
+    sinon: false,
+    SyncEvent: false,
+    workbox: false,
+    Workbox: true,
+    WorkboxSW: false,
   },
   rules: {
     "jsdoc/check-types": 2,
@@ -38,10 +41,13 @@ module.exports = {
     },
   }, {
     files: [
+      'infra/testing/webdriver/executeAsyncAndCatch.js',
+      'infra/utils/log-helper.js',
       'packages/workbox-core/_private/logger.mjs',
       'packages/workbox-sw/_default.mjs',
-      'infra/utils/log-helper.js',
       'packages/workbox-cli/src/lib/logger.js',
+      'test/workbox-window/integration/test.js',
+      'test/workbox-window/unit/test-Workbox.mjs',
     ],
     rules: {
       'no-console': 0,

gulp-tasks/build-packages.js

@@ -29,7 +29,8 @@ gulp.task('build-packages:clean', gulp.series(
 
 gulp.task('build-packages:build', gulp.parallel(
     'build-node-packages',
-    'build-browser-packages'
+    'build-browser-packages',
+    'build-window-packages'
 ));
 
 gulp.task('build-packages', gulp.series(

gulp-tasks/build-window-packages.js

@@ -0,0 +1,37 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+const gulp = require('gulp');
+
+const buildWindowBundle = require('./utils/build-window-bundle');
+const versionModule = require('./utils/version-module');
+const constants = require('./utils/constants');
+const packageRunnner = require('./utils/package-runner');
+
+gulp.task('build-window-packages:window-bundle', gulp.series(
+    Object.keys(constants.BUILD_TYPES).map((buildKey) => packageRunnner(
+        'build-window-packages:window-bundle',
+        'window',
+        buildWindowBundle,
+        constants.BUILD_TYPES[buildKey],
+    ))
+));
+
+gulp.task('build-window-packages:version-module', gulp.series(
+    Object.keys(constants.BUILD_TYPES).map((buildKey) => packageRunnner(
+        'build-window-packages:version-module',
+        'window',
+        versionModule,
+        constants.BUILD_TYPES[buildKey],
+    ))
+));
+
+gulp.task('build-window-packages', gulp.series(
+    'build-window-packages:version-module',
+    'build-window-packages:window-bundle',
+));

gulp-tasks/test-integration.js

@@ -68,12 +68,14 @@ const runIntegrationTestSuite = async (testPath, nodeEnv, seleniumBrowser,
 
     const testFiles = glob.sync(path.posix.join(__dirname, '..', testPath,
         '*.js'));
-    await runFiles(testFiles);
 
-    process.env.NODE_ENV = originalNodeEnv;
+    await runFiles(testFiles);
   } catch (err) {
-    process.env.NODE_ENV = originalNodeEnv;
+    // Log the error, so it's easier to debug failures.
+    console.error(err); // eslint-disable-line no-console
     throw new Error(`'gulp test-integration' discovered errors.`);
+  } finally {
+    process.env.NODE_ENV = originalNodeEnv;
   }
 };
 

gulp-tasks/utils/build-browser-bundle.js

@@ -178,10 +178,7 @@ module.exports = (packagePath, buildType) => {
     },
   })
       .on('error', (err) => {
-        const args = [];
-        Object.keys(err).forEach((key) => {
-          args.push(`${key}: ${err[key]}`);
-        });
+        const args = Object.keys(err).map((key) => `${key}: ${err[key]}`);
         logHelper.error(err, `\n\n${args.join('\n')}`);
         throw err;
       })

gulp-tasks/utils/build-window-bundle.js

@@ -0,0 +1,94 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+const buffer = require('vinyl-buffer');
+const fs = require('fs-extra');
+const gulp = require('gulp');
+const path = require('path');
+const rename = require('gulp-rename');
+const rollup = require('rollup');
+const rollupStream = require('rollup-stream');
+const source = require('vinyl-source-stream');
+const sourcemaps = require('gulp-sourcemaps');
+
+const constants = require('./constants');
+const logHelper = require('../../infra/utils/log-helper');
+const pkgPathToName = require('./pkg-path-to-name');
+const rollupHelper = require('./rollup-helper');
+
+
+const ERROR_NO_MODULE_BROWSER =
+  `Could not find the module's index.mjs file: `;
+
+
+module.exports = (packagePath, buildType) => {
+  const packageName = pkgPathToName(packagePath);
+  const moduleBrowserPath = path.join(packagePath, `index.mjs`);
+
+  // First check if the bundle file exists, if it doesn't
+  // there is nothing to build
+  if (!fs.existsSync(moduleBrowserPath)) {
+    logHelper.error(ERROR_NO_MODULE_BROWSER + packageName);
+    return Promise.reject(ERROR_NO_MODULE_BROWSER + packageName);
+  }
+
+  const outputFilename = `${packageName}.${buildType.slice(0, 4)}.mjs`;
+  const outputDirectory = path.join(
+      packagePath, constants.PACKAGE_BUILD_DIRNAME);
+
+  logHelper.log(
+      `Building Window Bundle: ${logHelper.highlight(outputFilename)}`);
+
+  // TODO(philipwalton): ensure all loaded workbox modules conform to
+  // the same conventions we document to external developers. This can be
+  // done with a Rollup plugin that validates them.
+  const plugins = rollupHelper.getDefaultPlugins(buildType, {module: true});
+
+  return rollupStream({
+    input: moduleBrowserPath,
+    rollup,
+    output: {
+      sourcemap: true,
+      format: 'es',
+    },
+    plugins,
+    onwarn: (warning) => {
+      if (buildType === constants.BUILD_TYPES.prod &&
+        warning.code === 'UNUSED_EXTERNAL_IMPORT') {
+        // This can occur when using rollup-plugin-replace.
+        logHelper.warn(`[${warning.code}] ${warning.message}`);
+        return;
+      }
+
+      // The final builds should have no warnings.
+      if (warning.code && warning.message) {
+        throw new Error(`Unhandled Rollup Warning: [${warning.code}] ` +
+          `${warning.message}`);
+      } else {
+        throw new Error(`Unhandled Rollup Warning: ${warning}`);
+      }
+    },
+  })
+      .on('error', (err) => {
+        const args = Object.keys(err).map((key) => `${key}: ${err[key]}`);
+        logHelper.error(err, `\n\n${args.join('\n')}`);
+        throw err;
+      })
+  // We must give the generated stream the same name as the entry file
+  // for the sourcemaps to work correctly
+      .pipe(source(moduleBrowserPath))
+  // gulp-sourcemaps don't work with streams so we need
+      .pipe(buffer())
+  // This tells gulp-sourcemaps to load the inline sourcemap
+      .pipe(sourcemaps.init({loadMaps: true}))
+  // This renames the output file
+      .pipe(rename(outputFilename))
+  // This writes the sourcemap alongside the final build file
+      .pipe(sourcemaps.write('.'))
+      .pipe(gulp.dest(outputDirectory));
+};

gulp-tasks/utils/output-filename-to-package-map.js

@@ -10,7 +10,14 @@ const {getPackages} = require('./get-packages');
 
 
 const outputFilenameToPkgMap = {};
-getPackages({type: 'browser'}).forEach((pkg) => {
+
+
+const windowAndBrowserPackages = [
+  ...getPackages({type: 'browser'}),
+  ...getPackages({type: 'window'}),
+];
+
+windowAndBrowserPackages.forEach((pkg) => {
   // When no `outputFilename` property exists, the package name is used.
   const outputFilename = pkg.workbox.outputFilename || pkg.name;
 

gulp-tasks/utils/rollup-helper.js

@@ -17,7 +17,7 @@ module.exports = {
   // Every use of rollup should have minification and the replace
   // plugin set up and used to ensure as consist set of tests
   // as possible.
-  getDefaultPlugins: (buildType) => {
+  getDefaultPlugins: (buildType, {module = false} = {}) => {
     const plugins = [];
 
     const babelConfig = {
@@ -35,6 +35,7 @@ module.exports = {
     let minifyBuild = buildType === constants.BUILD_TYPES.prod;
     if (minifyBuild) {
       const terserOptions = {
+        module,
         mangle: {
           properties: {
             reserved: [

gulpfile.js

@@ -32,6 +32,7 @@ global.cliOptions = options;
 const gulpTaskFiles = [
   'build-node-packages',
   'build-browser-packages',
+  'build-window-packages',
   'build-packages',
   'build',
   'lint',

infra/testing/activate-and-control.js

@@ -8,6 +8,7 @@
 
 const activateSWSafari = require('./activate-sw-safari');
 
+// TODO(philipwalton): remove this in favor of using workbox-window.
 module.exports = async (swUrl) => {
   if (global.__workbox.seleniumBrowser.getId() === 'safari') {
     return activateSWSafari(swUrl);

infra/testing/activate-sw-safari.js

@@ -6,6 +6,7 @@
   https://opensource.org/licenses/MIT.
 */
 
+// TODO(philipwalton): remove this in favor of using workbox-window.
 module.exports = async (swUrl) => {
   // First step: Wait for the page to activate
   let error = await global.__workbox.webdriver.executeAsyncScript((swUrl, cb) => {

infra/testing/server/index.js

@@ -7,6 +7,7 @@
 */
 
 const express = require('express');
+const nunjucks = require('nunjucks');
 const path = require('path');
 const requireDir = require('require-dir');
 const serveIndex = require('serve-index');
@@ -22,8 +23,11 @@ let server;
 
 function initApp() {
   app = express();
-  requestCounters = new Set();
 
+  // Configure nunjucks to work with express routes.
+  nunjucks.configure(path.join(__dirname, 'templates'), {express: app});
+
+  requestCounters = new Set();
   app.use((req, res, next) => {
     for (const requestCounter of requestCounters) {
       requestCounter.count(req);

infra/testing/server/routes/build-file.js

@@ -31,7 +31,7 @@ async function handler(req, res) {
   }
 
   if (extension) {
-    fileName = fileName.replace(/\.js$/, `.${extension}`);
+    fileName = fileName.replace(/\.m?js$/, `.${extension}`);
   }
 
   const filePath = path.resolve(__dirname, buildPath, fileName);

infra/testing/server/routes/templates.js

@@ -0,0 +1,37 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+const path = require('path');
+const templateData = require('../template-data');
+
+// Matches any URL with a filename that includes `*.tmp.*`.
+// When matched, a file in the `../templates/*` directory will be used.
+const match = /\.tmp\.[a-z]+$/;
+
+async function handler(req, res) {
+  const ext = path.extname(req.path);
+  const basename = path.basename(req.path);
+
+  switch (ext) {
+    case '.js':
+    case '.mjs':
+      res.set('Content-Type', 'text/javascript');
+      break;
+    case '.html':
+      res.set('Content-Type', 'text/html');
+      break;
+  }
+
+  const file = path.join(__dirname, '..', 'templates', basename);
+  res.render(file, templateData.get());
+}
+
+module.exports = {
+  handler,
+  match,
+};

infra/testing/server/template-data.js

@@ -0,0 +1,22 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+// We have to use a global variable instead of a local variable because
+// at the moment we're using `clear-require` to reset all modules between
+// tests, which means all local variables get reset, but globals persist.
+global.__templateData = {};
+
+const get = () => {
+  return Object.assign({}, global.__templateData);
+};
+
+const assign = (newData) => {
+  Object.assign(global.__templateData, newData);
+};
+
+module.exports = {get, assign};

infra/testing/server/templates/sw-clients-claim.tmp.js

@@ -0,0 +1,12 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+// {{ version }}
+
+addEventListener('install', (event) => event.waitUntil(skipWaiting()));
+addEventListener('activate', (event) => event.waitUntil(clients.claim()));

infra/testing/server/templates/sw-no-skip-waiting.tmp.js

@@ -0,0 +1,9 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+// {{ version }}

infra/testing/server/templates/sw-skip-waiting-deferred.tmp.js

@@ -0,0 +1,19 @@
+/*
+  Copyright 2019 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+
+// {{ version }}
+
+addEventListener('install', (event) => {
+  const doneInstalling = new Promise((resolve) => {
+    setTimeout(() => {
+      skipWaiting();
+      resolve();
+    }, 500);
+  });
+  event.waitUntil(doneInstalling);
+});