New spdy option to enable/disable HTTP/2 with HTTPS

bin/options.js

@@ -87,6 +87,11 @@ const options = {
     group: SSL_GROUP,
     describe: 'HTTPS',
   },
+  http2: {
+    type: 'boolean',
+    group: SSL_GROUP,
+    describe: 'HTTP/2, must be used with HTTPS',
+  },
   key: {
     type: 'string',
     describe: 'Path to a SSL key.',

lib/Server.js

@@ -87,6 +87,10 @@ class Server {
       throw new Error("'filename' option must be set in lazy mode.");
     }
 
+    if (options.http2 && !options.https) {
+      throw new Error("'https' option must be enabled to use HTTP/2");
+    }
+
     this.hot = options.hot || options.hotOnly;
     this.headers = options.headers;
     this.progress = options.progress;
@@ -630,12 +634,6 @@ class Server {
       options.https.key = options.https.key || fakeCert;
       options.https.cert = options.https.cert || fakeCert;
 
-      if (!options.https.spdy) {
-        options.https.spdy = {
-          protocols: ['h2', 'http/1.1'],
-        };
-      }
-
       // `spdy` is effectively unmaintained, and as a consequence of an
       // implementation that extensively relies on Node’s non-public APIs, broken
       // on Node 10 and above. In those cases, only https will be used for now.
@@ -645,9 +643,12 @@ class Server {
       // - https://github.com/nodejs/node/issues/21665
       // - https://github.com/webpack/webpack-dev-server/issues/1449
       // - https://github.com/expressjs/express/issues/3388
-      if (semver.gte(process.version, '10.0.0')) {
+      if (semver.gte(process.version, '10.0.0') || !options.http2) {
         this.listeningApp = https.createServer(options.https, app);
       } else {
+        options.https.spdy = {
+          protocols: ['h2', 'http/1.1'],
+        };
         /* eslint-disable global-require */
         // The relevant issues are:
         // https://github.com/spdy-http2/node-spdy/issues/350

lib/options.json

@@ -162,6 +162,9 @@
         }
       ]
     },
+    "http2": {
+      "type": "boolean"
+    },
     "contentBase": {
       "anyOf": [
         {
@@ -321,6 +324,7 @@
       "disableHostCheck": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserver-disablehostcheck)",
       "public": "should be {String} (https://webpack.js.org/configuration/dev-server/#devserver-public)",
       "https": "should be {Object|Boolean} (https://webpack.js.org/configuration/dev-server/#devserver-https)",
+      "http2": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserver-http2)",
       "contentBase": "should be {Array} (https://webpack.js.org/configuration/dev-server/#devserver-contentbase)",
       "watchContentBase": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserver-watchcontentbase)",
       "open": "should be {String|Boolean} (https://webpack.js.org/configuration/dev-server/#devserver-open)",

lib/utils/createConfig.js

@@ -136,6 +136,10 @@ function createConfig(config, argv, { port }) {
     options.https = true;
   }
 
+  if (argv.http2) {
+    options.http2 = true;
+  }
+
   if (argv.key) {
     options.key = argv.key;
   }

test/CreateConfig.test.js

@@ -559,6 +559,28 @@ describe('createConfig', () => {
     expect(config).toMatchSnapshot();
   });
 
+  it('http2 option', () => {
+    const config = createConfig(
+      webpackConfig,
+      Object.assign({}, argv, { https: true, http2: true }),
+      { port: 8080 }
+    );
+
+    expect(config).toMatchSnapshot();
+  });
+
+  it('http2 option (in devServer config)', () => {
+    const config = createConfig(
+      Object.assign({}, webpackConfig, {
+        devServer: { https: true, http2: true },
+      }),
+      argv,
+      { port: 8080 }
+    );
+
+    expect(config).toMatchSnapshot();
+  });
+
   it('key option', () => {
     const config = createConfig(
       webpackConfig,

test/Http2.test.js

@@ -0,0 +1,99 @@
+'use strict';
+
+const path = require('path');
+const http2 = require('http2');
+const request = require('supertest');
+const semver = require('semver');
+const helper = require('./helper');
+const config = require('./fixtures/contentbase-config/webpack.config');
+
+const contentBasePublic = path.join(
+  __dirname,
+  'fixtures/contentbase-config/public'
+);
+
+describe('HTTP2', () => {
+  let server;
+  let req;
+
+  describe('without https it should throw an error', () => {
+    it('create server', () => {
+      expect(() => {
+        helper.start(config, {
+          http2: true,
+        });
+      }).toThrow(/'https' option must be enabled/);
+    });
+  });
+
+  // HTTP/2 will only work with node versions below 10.0.0
+  // since spdy is broken past that point
+  if (semver.lt(process.version, '10.0.0')) {
+    describe('http2 works with https', () => {
+      beforeAll((done) => {
+        server = helper.start(
+          config,
+          {
+            contentBase: contentBasePublic,
+            https: true,
+            http2: true,
+          },
+          done
+        );
+        req = request(server.app);
+      });
+
+      it('confirm http2 client can connect', (done) => {
+        const client = http2.connect('https://localhost:8080', {
+          rejectUnauthorized: false,
+        });
+        client.on('error', (err) => console.error(err));
+
+        const http2Req = client.request({ ':path': '/' });
+
+        http2Req.on('response', (headers) => {
+          expect(headers[':status']).toEqual(200);
+        });
+
+        http2Req.setEncoding('utf8');
+        let data = '';
+        http2Req.on('data', (chunk) => {
+          data += chunk;
+        });
+        http2Req.on('end', () => {
+          expect(data).toEqual(expect.stringMatching(/Heyo/));
+          done();
+        });
+        http2Req.end();
+      });
+
+      afterAll(helper.close);
+    });
+  }
+
+  describe('https without http2 disables HTTP/2', () => {
+    beforeAll((done) => {
+      server = helper.start(
+        config,
+        {
+          contentBase: contentBasePublic,
+          https: true,
+        },
+        done
+      );
+      req = request(server.app);
+    });
+
+    it('Request to index', (done) => {
+      req
+        .get('/')
+        .expect(200, /Heyo/)
+        .then(({ res }) => {
+          expect(res.httpVersion).not.toEqual('2.0');
+          done();
+        });
+    });
+
+    afterAll(helper.close);
+  });
+});