feature #888 updating stimulus-bridge plugin to work with proposed new loader (weaverryan)

This PR was squashed before being merged into the main branch.

Discussion
----------

updating stimulus-bridge plugin to work with proposed new loader

Partner to symfony/stimulus-bridge#14

* [x] Wait for partner PR to be merged

Commits
-------

5640760 updating stimulus-bridge plugin to work with proposed new loader

Author: weaverryan

fixtures/stimulus/assets/app.js

@@ -1,4 +1,3 @@
 import { startStimulusApp } from '@symfony/stimulus-bridge';
-import '@symfony/autoimport';
 
 export const app = startStimulusApp(require.context('./controllers', true, /\.(j|t)sx?$/));

fixtures/stimulus/autoimport/index.js

@@ -131,6 +131,7 @@ class WebpackConfig {
             resolveUrlLoader: true,
             resolveUrlLoaderOptions: {}
         };
+        /** @deprecated */
         this.stimulusOptions = {
             controllerJsonPath: null,
         };
@@ -686,6 +687,9 @@ class WebpackConfig {
         }
 
         this.stimulusOptions.controllersJsonPath = controllerJsonPath;
+        this.addAliases({
+            '@symfony/stimulus-bridge/controllers.json': path.resolve(controllerJsonPath),
+        });
     }
 
     enableBuildCache(buildDependencies, callback = (cache) => {}) {

fixtures/stimulus/autoimport/package.json

@@ -151,7 +151,7 @@ const features = {
     stimulus: {
         method: 'enableStimulusBridge()',
         packages: [
-            { name: '@symfony/stimulus-bridge' },
+            { name: '@symfony/stimulus-bridge', enforce_version: true },
             { name: 'stimulus' }
         ],
         description: 'enable Stimulus bridge'

fixtures/stimulus/controllers/index.js

@@ -12,16 +12,28 @@
 const WebpackConfig = require('../WebpackConfig'); //eslint-disable-line no-unused-vars
 const loaderFeatures = require('../features');
 const fs = require('fs');
+const packageHelper = require('../package-helper');
+const semver = require('semver');
 
 /**
+ * Support for @symfony/stimulus-bridge 1.1 or lower.
+ *
  * @param {Array} plugins
  * @param {WebpackConfig} webpackConfig
+ * @deprecated
  * @return {void}
  */
 module.exports = function(plugins, webpackConfig) {
     if (webpackConfig.useStimulusBridge) {
         loaderFeatures.ensurePackagesExistAndAreCorrectVersion('stimulus');
 
+        const version = packageHelper.getPackageVersion('@symfony/stimulus-bridge');
+        if (semver.satisfies(version, '^1.2.0')) {
+            // package is new and doesn't require this plugin
+
+            return;
+        }
+
         const createPlugin = require('@symfony/stimulus-bridge/webpack-helper'); // eslint-disable-line node/no-unpublished-require
 
         plugins.push({

fixtures/stimulus/controllers/package.json

@@ -58,10 +58,8 @@
     "@babel/plugin-transform-react-jsx": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.0.0",
-    "@symfony/autoimport": "file:fixtures/stimulus/autoimport",
-    "@symfony/controllers": "file:fixtures/stimulus/controllers",
     "@symfony/mock-module": "file:fixtures/stimulus/mock-module",
-    "@symfony/stimulus-bridge": "^1.0.0",
+    "@symfony/stimulus-bridge": "^1.1.0",
     "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
     "@vue/babel-preset-jsx": "^1.0.0",
     "@vue/compiler-sfc": "^3.0.2",

lib/WebpackConfig.js

@@ -18,6 +18,8 @@ const path = require('path');
 const testSetup = require('./helpers/setup');
 const fs = require('fs-extra');
 const getVueVersion = require('../lib/utils/get-vue-version');
+const packageHelper = require('../lib/package-helper');
+const semver = require('semver');
 
 function createWebpackConfig(outputDirName = '', command, argv = {}) {
     const webpackConfig = testSetup.createWebpackConfig(
@@ -427,15 +429,15 @@ describe('Functional tests using webpack', function() {
                     ]);
 
                     webpackAssert.assertOutputFileContains(
-                        'styles.79943add.css',
+                        'styles.[hash:8].css',
                         'font-size: 50px;'
                     );
                     webpackAssert.assertManifestPathDoesNotExist(
                         'styles.js'
                     );
                     webpackAssert.assertManifestPath(
                         'styles.css',
-                        '/styles.79943add.css'
+                        '/styles.[hash:8].css'
                     );
 
                     done();
@@ -466,7 +468,7 @@ describe('Functional tests using webpack', function() {
                     );
                     webpackAssert.assertManifestPath(
                         'styles.css',
-                        '/styles.css?79943addbc894efe'
+                        '/styles.css?[hash:16]'
                     );
 
                     done();
@@ -535,7 +537,7 @@ describe('Functional tests using webpack', function() {
                     ]);
 
                 webpackAssert.assertOutputFileContains(
-                    'bg.2eff0999.css',
+                    'bg.[hash:8].css',
                     '/build/images/symfony_logo.91beba37.png'
                 );
 
@@ -1913,9 +1915,17 @@ module.exports = {
             });
         });
 
-        it('Symfony - Stimulus standard app is built correctly', (done) => {
+        it('Symfony - Stimulus standard app is built correctly', function(done) {
             const appDir = testSetup.createTestAppDir();
 
+            const version = packageHelper.getPackageVersion('@symfony/stimulus-bridge');
+            if (!semver.satisfies(version, '^1.2.0')) {
+                // we support the old version, but it's not tested
+                this.skip();
+
+                return;
+            }
+
             const config = testSetup.createWebpackConfig(appDir, 'www/build', 'dev');
             config.enableSingleRuntimeChunk();
             config.setPublicPath('/build');
@@ -1930,13 +1940,14 @@ module.exports = {
                     'main.js',
                     'main.css',
                     'manifest.json',
+                    'node_modules_symfony_mock-module_dist_controller_js.js',
                     'entrypoints.json',
                     'runtime.js',
                 ]);
 
                 // test controllers and style are shipped
                 webpackAssert.assertOutputFileContains('main.js', 'app-controller');
-                webpackAssert.assertOutputFileContains('main.js', 'mock-module-controller');
+                webpackAssert.assertOutputFileContains('node_modules_symfony_mock-module_dist_controller_js.js', 'mock-module-controller');
                 webpackAssert.assertOutputFileContains('main.css', 'body {}');
 
                 done();