feat(collect): Make it easy to use with SPA

packages/cli/src/collect/collect.js

@@ -31,6 +31,10 @@ function buildCommand(yargs) {
     staticDistDir: {
       description: 'The build directory where your HTML files to run Lighthouse on are located.',
     },
+    isSinglePageApplication: {
+      description:
+        'If the application is created by Single Page Application, enable redirect to index.html.',
+    },
     chromePath: {
       description: 'The path to the Chrome or Chromium executable to use for collection.',
       default: process.env.CHROME_PATH || ChromeLauncher.getInstallations()[0],
@@ -125,7 +129,7 @@ async function startServerAndDetermineUrls(options) {
   }
 
   const pathToBuildDir = path.resolve(process.cwd(), options.staticDistDir);
-  const server = new FallbackServer(pathToBuildDir);
+  const server = new FallbackServer(pathToBuildDir, options.isSinglePageApplication);
   await server.listen();
   process.stdout.write(`Started a web server on port ${server.port}...\n`);
 

packages/cli/src/collect/fallback-server.js

@@ -13,12 +13,16 @@ const createHttpServer = require('http').createServer;
 class FallbackServer {
   /**
    * @param {string} pathToBuildDir
+   * @param {boolean|undefined} isSinglePageApplication
    */
-  constructor(pathToBuildDir) {
+  constructor(pathToBuildDir, isSinglePageApplication) {
     this._pathToBuildDir = pathToBuildDir;
     this._app = express();
     this._app.use(compression());
     this._app.use('/', express.static(pathToBuildDir));
+    if (isSinglePageApplication) {
+      this._app.use('/*', (req, res) => res.sendFile(pathToBuildDir + '/index.html'));
+    }
     this._port = 0;
     /** @type {undefined|ReturnType<typeof createHttpServer>} */
     this._server = undefined;

types/collect.d.ts

@@ -41,6 +41,7 @@ declare global {
       export interface Options {
         url?: string | string[];
         staticDistDir?: string;
+        isSinglePageApplication?: boolean;
         startServerCommand?: string;
         startServerReadyPattern: string;
         chromePath?: string;