feature #1400 Remove deprecated --https flag and devServerConfig.https option (Kocal)

This PR was merged into the main branch.

Discussion
----------

Remove deprecated `--https` flag and `devServerConfig.https` option

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | yes <!-- please update CHANGELOG.md file -->
| Deprecations? | no <!-- please update CHANGELOG.md file -->
| Issues        | Fix #... <!-- prefix each issue number with "Fix #", no need to create an issue if none exists, explain below instead -->
| License       | MIT

<!--
Replace this notice by a description of your feature/bugfix.
This will help reviewers and should be a good start for the documentation.

Additionally (see https://symfony.com/releases):
 - Always add tests and ensure they pass.
 - Features and deprecations must be submitted against the latest branch.
 - For new features, provide some code snippets to help understand usage.
 - Changelog entry should follow https://symfony.com/doc/current/contributing/code/conventions.html#writing-a-changelog-entry
 - Never break backward compatibility.
-->

Commits
-------

c5d7afa Remove deprecated `--https` flag and `devServerConfig.https` option

Author: Kocal

CHANGELOG.md

@@ -16,6 +16,7 @@ This is a new major version that contains several backwards-compatibility breaks
 * Remove unmaintained file-loader dependency 
   The `[N]` placeholder (regex capture groups in filename patterns) is no longer supported. 
   If you were using patterns like `[1]` or `[2]` in your `Encore.copyFiles()` filename option, you will need to restructure your file organization or use a different naming strategy.
+* Remove deprecated `--https` flag and `devServerConfig.https` option for webpack-dev-server, use `--server-type https` or `configureDevServerOptions()` with `server: 'https'` instead
 
 ### Features
 

lib/config-generator.js

@@ -58,25 +58,17 @@ class ConfigGenerator {
     getWebpackConfig() {
         const devServerConfig = this.webpackConfig.useDevServer() ? this.buildDevServerConfig() : null;
         /*
-         * An unfortunate situation where we need to configure the final runtime
-         * config later in the process. The problem is that devServer https can
-         * be activated with either a --server-type=https flag or by setting the devServer.server.type='https'
-         * config to true. So, only at this moment can we determine
-         * if https has been activated by either method.
+         * We need to configure the final runtime config later in the process.
+         * The devServer https can be activated by setting devServer.server to
+         * 'https' or { type: 'https' }. Only at this point can we determine
+         * if https has been activated.
          */
         if (this.webpackConfig.useDevServer() &&
             (
-                devServerConfig.https
-                || devServerConfig.server === 'https'
+                devServerConfig.server === 'https'
                 || (typeof devServerConfig.server === 'object' && devServerConfig.server.type === 'https')
-                || this.webpackConfig.runtimeConfig.devServerHttps
             )) {
             this.webpackConfig.runtimeConfig.devServerFinalIsHttps = true;
-
-            if (devServerConfig.https) {
-                logger.deprecation('The "https" option inside of configureDevServerOptions() is deprecated. Use "server = { type: \'https\' }" instead.');
-            }
-
         } else {
             this.webpackConfig.runtimeConfig.devServerFinalIsHttps = false;
         }
@@ -612,11 +604,6 @@ class ConfigGenerator {
             headers: { 'Access-Control-Allow-Origin': '*' },
             compress: true,
             historyApiFallback: true,
-            // In webpack-dev-server v4 beta 0, liveReload always causes
-            // the page to refresh, not allowing HMR to update the page.
-            // This is somehow related to the "static" option, but it's
-            // unknown if there is a better option.
-            // See https://github.com/webpack/webpack-dev-server/issues/2893
             liveReload: false,
             // see https://github.com/symfony/webpack-encore/issues/931#issuecomment-784483725
             host: this.webpackConfig.runtimeConfig.devServerHost,

lib/config/RuntimeConfig.js

@@ -17,7 +17,6 @@ class RuntimeConfig {
         this.environment = process.env.NODE_ENV ? process.env.NODE_ENV : 'dev';
 
         this.useDevServer = false;
-        this.devServerHttps = null;
         // see config-generator - getWebpackConfig()
         this.devServerFinalIsHttps = null;
         this.devServerHost = null;

lib/config/parse-runtime.js

@@ -43,10 +43,6 @@ module.exports = function(argv, cwd) {
             runtimeConfig.useDevServer = true;
             runtimeConfig.devServerKeepPublicPath = argv.keepPublicPath || false;
 
-            if (argv.https || argv.serverType === 'https') {
-                runtimeConfig.devServerHttps = true;
-            }
-
             if (typeof argv.public === 'string') {
                 runtimeConfig.devServerPublic = argv.public;
             }

test/bin/encore.js

@@ -284,6 +284,74 @@ module.exports = Encore.getWebpackConfig();
         }, 5000);
     });
 
+    it('Run the webpack-dev-server with --server-type https', function(done) {
+        testSetup.emptyTmpDir();
+        const testDir = testSetup.createTestAppDir();
+
+        fs.writeFileSync(
+            path.join(testDir, 'package.json'),
+            `{
+                "devDependencies": {
+                    "@symfony/webpack-encore": "*"
+                }
+            }`
+        );
+
+        fs.writeFileSync(
+            path.join(testDir, 'webpack.config.js'),
+            `
+const Encore = require('../../index.js');
+Encore
+    .enableSingleRuntimeChunk()
+    .setOutputPath('build/')
+    .setPublicPath('/build')
+    .addEntry('main', './js/no_require')
+;
+
+module.exports = Encore.getWebpackConfig();
+            `
+        );
+
+        const binPath = path.resolve(__dirname, '../', '../', 'bin', 'encore.js');
+        const abortController = new AbortController();
+        const node = spawn('node', [binPath, 'dev-server', '--server-type', 'https', `--context=${testDir}`], {
+            cwd: testDir,
+            env: Object.assign({}, process.env, { NO_COLOR: 'true' }),
+            signal: abortController.signal
+        });
+
+        let stdout = '';
+        let stderr = '';
+
+        node.stdout.on('data', (data) => {
+            stdout += data.toString();
+        });
+
+        node.stderr.on('data', (data) => {
+            stderr += data.toString();
+        });
+
+        node.on('error', (error) => {
+            if (error.name !== 'AbortError') {
+                throw new Error('Error executing encore', { cause: error });
+            }
+
+            expect(stdout).to.contain('Running webpack-dev-server ...');
+            expect(stdout).to.contain('Compiled successfully in');
+            expect(stdout).to.contain('webpack compiled successfully');
+
+            expect(stderr).to.contain('[webpack-dev-server] Project is running at:');
+            expect(stderr).to.contain('[webpack-dev-server] Loopback: https://localhost:8080/');
+            expect(stderr).to.contain('[webpack-dev-server] Content not from webpack is served from');
+
+            done();
+        });
+
+        setTimeout(() => {
+            abortController.abort();
+        }, 5000);
+    });
+
     describe('Without webpack-dev-server installed', function() {
         before(function() {
             execSync('yarn remove webpack-dev-server --dev', { cwd: projectDir });

test/config-generator.js

@@ -590,13 +590,15 @@ describe('The config-generator function', function() {
             expect(config.runtimeConfig.devServerFinalIsHttps).is.false;
         });
 
-        it('devServer enabled only at the command line', function() {
+        it('devServer enabled with https via configureDevServerOptions', function() {
             const config = createConfig();
             config.runtimeConfig.useDevServer = true;
-            config.runtimeConfig.devServerHttps = true;
             config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
             config.setPublicPath('/');
             config.addEntry('main', './main');
+            config.configureDevServerOptions(options => {
+                options.server = 'https';
+            });
 
             configGenerator(config);
             // this should be set when running the config generator

test/config/parse-runtime.js

@@ -80,17 +80,6 @@ describe('parse-runtime', function() {
         expect(config.environment).to.equal('dev');
         expect(config.devServerHost).to.equal('foohost.l');
         expect(config.devServerPort).to.equal(9999);
-        expect(config.devServerHttps).to.be.null;
-    });
-
-    it('dev-server command https', function() {
-        const testDir = createTestDirectory();
-        const config = parseArgv(createArgv(['dev-server', '--https', '--host', 'foohost.l', '--port', '9999']), testDir);
-
-        expect(config.useDevServer).to.be.true;
-        expect(config.devServerHost).to.equal('foohost.l');
-        expect(config.devServerPort).to.equal(9999);
-        expect(config.devServerHttps).to.equal(true);
     });
 
     it('dev-server command server-type https', function() {
@@ -100,7 +89,6 @@ describe('parse-runtime', function() {
         expect(config.useDevServer).to.be.true;
         expect(config.devServerHost).to.equal('foohost.l');
         expect(config.devServerPort).to.equal(9999);
-        expect(config.devServerHttps).to.equal(true);
     });
 
     it('dev-server command public', function() {

test/config/path-util.js

@@ -13,6 +13,7 @@ const expect = require('chai').expect;
 const WebpackConfig = require('../../lib/WebpackConfig');
 const RuntimeConfig = require('../../lib/config/RuntimeConfig');
 const pathUtil = require('../../lib/config/path-util');
+const configGenerator = require('../../lib/config-generator');
 const process = require('process');
 
 function createConfig() {
@@ -166,4 +167,60 @@ describe('path-util getContentBase()', function() {
             expect(pathUtil.calculateDevServerUrl(runtimeConfig)).to.equal('https://myhost.local:9090');
         });
     });
+
+    describe('calculateDevServerUrl with configGenerator integration', function() {
+        it('generates http URL without server option', function() {
+            const config = createConfig();
+            config.runtimeConfig.useDevServer = true;
+            config.runtimeConfig.devServerHost = 'localhost';
+            config.runtimeConfig.devServerPort = 8080;
+            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
+            config.setPublicPath('/');
+            config.addEntry('main', './main');
+            config.enableSingleRuntimeChunk();
+
+            // Run config generator to set devServerFinalIsHttps
+            configGenerator(config);
+
+            expect(pathUtil.calculateDevServerUrl(config.runtimeConfig)).to.equal('http://localhost:8080');
+        });
+
+        it('generates https URL with server: "https" option', function() {
+            const config = createConfig();
+            config.runtimeConfig.useDevServer = true;
+            config.runtimeConfig.devServerHost = 'localhost';
+            config.runtimeConfig.devServerPort = 8080;
+            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
+            config.setPublicPath('/');
+            config.addEntry('main', './main');
+            config.enableSingleRuntimeChunk();
+            config.configureDevServerOptions(options => {
+                options.server = 'https';
+            });
+
+            // Run config generator to set devServerFinalIsHttps
+            configGenerator(config);
+
+            expect(pathUtil.calculateDevServerUrl(config.runtimeConfig)).to.equal('https://localhost:8080');
+        });
+
+        it('generates https URL with server: { type: "https" } option', function() {
+            const config = createConfig();
+            config.runtimeConfig.useDevServer = true;
+            config.runtimeConfig.devServerHost = 'localhost';
+            config.runtimeConfig.devServerPort = 8080;
+            config.outputPath = isWindows ? 'C:\\tmp\\public' : '/tmp/public';
+            config.setPublicPath('/');
+            config.addEntry('main', './main');
+            config.enableSingleRuntimeChunk();
+            config.configureDevServerOptions(options => {
+                options.server = { type: 'https' };
+            });
+
+            // Run config generator to set devServerFinalIsHttps
+            configGenerator(config);
+
+            expect(pathUtil.calculateDevServerUrl(config.runtimeConfig)).to.equal('https://localhost:8080');
+        });
+    });
 });