Disable the modules API polyfill on latest Ember

Disables the modules API polyfill on the latest versions of Ember.
ember-cli · Mar 16, 2021 · 4d205a4 · 4d205a4
1 parent e3818be
commit 4d205a4
Show file tree

Hide file tree

Showing 6 changed files with 105 additions and 40 deletions.
diff --git a/lib/colocated-babel-plugin.js b/lib/colocated-babel-plugin.js
@@ -3,7 +3,11 @@
 module.exports = function (babel) {
   let t = babel.types;
 
-  function makeSetComponentTemplateMemberExpression() {
+  function makeSetComponentTemplateExpression(state) {
+    if (!state.opts.requiresModuleApiPolyfill) {
+      return state._colocationEnsureImport('setComponentTemplate', '@ember/component');
+    }
+
     return t.memberExpression(t.identifier('Ember'), t.identifier('_setComponentTemplate'));
   }
 
@@ -15,6 +19,53 @@ module.exports = function (babel) {
     name: 'ember-cli-htmlbars-colocation-template',
 
     visitor: {
+      Program(path, state) {
+        let allAddedImports = {};
+
+        state._colocationEnsureImport = (exportName, moduleName) => {
+          let addedImports = (allAddedImports[moduleName] = allAddedImports[moduleName] || {});
+
+          if (addedImports[exportName]) return addedImports[exportName];
+
+          let importDeclarations = path.get('body').filter((n) => n.type === 'ImportDeclaration');
+
+          let preexistingImportDeclaration = importDeclarations.find(
+            (n) => n.get('source').get('value').node === moduleName
+          );
+
+          if (preexistingImportDeclaration) {
+            let importSpecifier = preexistingImportDeclaration
+              .get('specifiers')
+              .find(({ node }) => {
+                return exportName === 'default'
+                  ? t.isImportDefaultSpecifier(node)
+                  : node.imported.name === exportName;
+              });
+
+            if (importSpecifier) {
+              addedImports[exportName] = importSpecifier.node.local;
+            }
+          }
+
+          if (!addedImports[exportName]) {
+            let uid = path.scope.generateUidIdentifier(
+              exportName === 'default' ? moduleName : exportName
+            );
+            addedImports[exportName] = uid;
+
+            let newImportSpecifier =
+              exportName === 'default'
+                ? t.importDefaultSpecifier(uid)
+                : t.importSpecifier(uid, t.identifier(exportName));
+
+            let newImport = t.importDeclaration([newImportSpecifier], t.stringLiteral(moduleName));
+            path.unshiftContainer('body', newImport);
+          }
+
+          return addedImports[exportName];
+        };
+      },
+
       VariableDeclarator(path, state) {
         if (path.node.id.name === '__COLOCATED_TEMPLATE__') {
           state.colocatedTemplateFound = true;
@@ -38,7 +89,7 @@ module.exports = function (babel) {
 
         state.setComponentTemplateInjected = true;
         let defaultExportDeclaration = path.node.declaration;
-        let setComponentTemplateMemberExpression = makeSetComponentTemplateMemberExpression();
+        let setComponentTemplateMemberExpression = makeSetComponentTemplateExpression(state);
         let colocatedTemplateIdentifier = makeColocatedTemplateIdentifier();
 
         if (defaultExportDeclaration.type === 'ClassDeclaration') {
@@ -85,7 +136,7 @@ module.exports = function (babel) {
           state.setComponentTemplateInjected = true;
           path.parent.body.push(
             t.expressionStatement(
-              t.callExpression(makeSetComponentTemplateMemberExpression(), [
+              t.callExpression(makeSetComponentTemplateExpression(state), [
                 makeColocatedTemplateIdentifier(),
                 defaultSpecifier.local,
               ])

diff --git a/lib/ember-addon-main.js b/lib/ember-addon-main.js
@@ -3,6 +3,7 @@
 const path = require('path');
 const SilentError = require('silent-error');
 const utils = require('./utils');
+const VersionChecker = require('ember-cli-version-checker');
 
 let registryInvocationCounter = 0;
 
@@ -62,7 +63,7 @@ module.exports = {
   transpileTree(inputTree, htmlbarsOptions) {
     const TemplateCompiler = require('./template-compiler-plugin');
 
-    return new TemplateCompiler(inputTree, htmlbarsOptions);
+    return new TemplateCompiler(inputTree, htmlbarsOptions, this._requiresModuleApiPolyfill);
   },
 
   setupPreprocessorRegistry(type, registry) {
@@ -169,6 +170,9 @@ module.exports = {
 
     let isProduction = process.env.EMBER_ENV === 'production';
 
+    let checker = new VersionChecker(this.parent).for('ember-source', 'npm');
+    this._requiresModuleApiPolyfill = checker.exists() && checker.lt('3.27.0-alpha.1');
+
     // This is an option intended to be used only be `ember-template-imports`.
     // DO NOT USE THIS
     let customModules =
@@ -190,7 +194,8 @@ module.exports = {
           this.projectConfig(),
           templateCompilerPath,
           isProduction,
-          customModules
+          customModules,
+          this._requiresModuleApiPolyfill
         );
 
         babelPlugins.push(htmlbarsInlinePrecompilePlugin);
@@ -205,14 +210,18 @@ module.exports = {
           projectConfig: this.projectConfig(),
           templateCompilerPath,
           modules: customModules,
+          requiresModuleApiPolyfill: this._requiresModuleApiPolyfill,
         });
 
         babelPlugins.push(htmlBarsPlugin);
       }
     }
 
     if (this._shouldColocateTemplates() && !utils.isColocatedBabelPluginRegistered(babelPlugins)) {
-      babelPlugins.push(require.resolve('./colocated-babel-plugin'));
+      babelPlugins.push([
+        require.resolve('./colocated-babel-plugin'),
+        { requiresModuleApiPolyfill: this._requiresModuleApiPolyfill },
+      ]);
     }
   },
 

diff --git a/lib/template-compiler-plugin.js b/lib/template-compiler-plugin.js
@@ -24,7 +24,7 @@ function rethrowBuildError(error) {
 }
 
 class TemplateCompiler extends Filter {
-  constructor(inputTree, _options) {
+  constructor(inputTree, _options, requiresModuleApiPolyfill) {
     let options = _options || {};
 
     if (!('persist' in options)) {
@@ -35,6 +35,7 @@ class TemplateCompiler extends Filter {
 
     this.options = options;
     this.inputTree = inputTree;
+    this.requiresModuleApiPolyfill = requiresModuleApiPolyfill;
 
     // TODO: do we need this?
     this.precompile = this.options.templateCompiler.precompile;
@@ -63,27 +64,25 @@ class TemplateCompiler extends Filter {
       // sooooooo...... we are forced to maintain that **absolutely bonkers** ordering
       let astPlugins = this.options.plugins ? [...this.options.plugins.ast].reverse() : [];
 
-      let result =
-        'export default ' +
-        utils.template(this.options.templateCompiler, stripBom(string), {
-          contents: string,
-          isProduction: this.options.isProduction,
-          moduleName: relativePath,
-          parseOptions: {
-            srcName: srcName,
-          },
-
-          // intentionally not using `plugins: this.options.plugins` here
-          // because if we do, Ember will mutate the shared plugins object (adding
-          // all of the built in AST transforms into plugins.ast, which breaks
-          // persistent caching)
-          plugins: {
-            ast: astPlugins,
-          },
-        }) +
-        ';';
+      let precompiled = this.options.templateCompiler.precompile(stripBom(string), {
+        contents: string,
+        isProduction: this.options.isProduction,
+        moduleName: relativePath,
+        parseOptions: {
+          srcName: srcName,
+        },
+      });
+
+      let result;
+
+      if (this.requiresModuleApiPolyfill) {
+        result = `export default Ember.HTMLBars.template(${precompiled});`;
+      } else {
+        result = `import { createTemplateFactory } from '@ember/template-factory';\n\nexport default createTemplateFactory(${precompiled});`;
+      }
+
       if (this.options.dependencyInvalidation) {
-        let plugins = pluginsWithDependencies(this.options.plugins.ast);
+        let plugins = pluginsWithDependencies(astPlugins);
         let dependencies = [];
         for (let i = 0; i < plugins.length; i++) {
           let pluginDeps = plugins[i].getDependencies(relativePath);

diff --git a/lib/utils.js b/lib/utils.js
@@ -50,17 +50,20 @@ function isInlinePrecompileBabelPluginRegistered(plugins) {
 }
 
 function isColocatedBabelPluginRegistered(plugins) {
-  return plugins.some(
-    (plugin) => typeof plugin === 'string' && plugin === require.resolve('./colocated-babel-plugin')
-  );
+  return plugins.some((plugin) => {
+    let path = Array.isArray(plugin) ? plugin[0] : plugin;
+
+    return typeof path === 'string' && path === require.resolve('./colocated-babel-plugin');
+  });
 }
 
 function buildParalleizedBabelPlugin(
   pluginInfo,
   projectConfig,
   templateCompilerPath,
   isProduction,
-  customModules
+  customModules,
+  requiresModuleApiPolyfill
 ) {
   let parallelBabelInfo = {
     requireFile: require.resolve('./require-from-worker'),
@@ -71,6 +74,7 @@ function buildParalleizedBabelPlugin(
       projectConfig,
       parallelConfigs: pluginInfo.parallelConfigs,
       modules: Object.assign({}, customModules, INLINE_PRECOMPILE_MODULES),
+      requiresModuleApiPolyfill,
     },
   };
 
@@ -199,12 +203,6 @@ function initializeEmberENV(templateCompiler, EmberENV) {
   }
 }
 
-function template(templateCompiler, string, options) {
-  let precompiled = templateCompiler.precompile(string, options);
-
-  return 'Ember.HTMLBars.template(' + precompiled + ')';
-}
-
 function setup(pluginInfo, options) {
   let projectConfig = options.projectConfig || {};
   let templateCompilerPath = options.templateCompilerPath;
@@ -261,7 +259,7 @@ function setup(pluginInfo, options) {
     {
       precompile,
       isProduction: options.isProduction,
-      ensureModuleApiPolyfill: true,
+      ensureModuleApiPolyfill: options.requiresModuleApiPolyfill,
       modules: Object.assign({}, options.modules, INLINE_PRECOMPILE_MODULES),
     },
     'ember-cli-htmlbars:inline-precompile',
@@ -355,7 +353,6 @@ function setupPlugins(wrappers) {
 module.exports = {
   buildOptions,
   initializeEmberENV,
-  template,
   setup,
   makeCacheKey,
   setupPlugins,

diff --git a/package.json b/package.json
@@ -39,6 +39,7 @@
     "broccoli-plugin": "^4.0.3",
     "common-tags": "^1.8.0",
     "ember-cli-babel-plugin-helpers": "^1.1.1",
+    "ember-cli-version-checker": "^5.1.2",
     "fs-tree-diff": "^2.0.1",
     "hash-for-dep": "^1.5.1",
     "heimdalljs-logger": "^0.1.10",
@@ -69,7 +70,6 @@
     "ember-cli-babel": "^7.23.1",
     "ember-cli-dependency-checker": "^3.2.0",
     "ember-cli-inject-live-reload": "^2.0.2",
-    "ember-cli-version-checker": "^5.1.1",
     "ember-compatibility-helpers": "^1.2.2",
     "ember-export-application-global": "^2.0.1",
     "ember-load-initializers": "^2.1.1",

diff --git a/yarn.lock b/yarn.lock
@@ -4456,6 +4456,15 @@ ember-cli-version-checker@^5.0.2, ember-cli-version-checker@^5.1.1:
     semver "^7.3.2"
     silent-error "^1.1.1"
 
+ember-cli-version-checker@^5.1.2:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/ember-cli-version-checker/-/ember-cli-version-checker-5.1.2.tgz#649c7b6404902e3b3d69c396e054cea964911ab0"
+  integrity sha512-rk7GY+FmLn/2e22HsZs0Ycrz8HQ1W3Fv+2TFOuEFW9optnDXDgkntPBIl6gact/LHsfBM5RKbM3dHsIIeLgl0Q==
+  dependencies:
+    resolve-package-path "^3.1.0"
+    semver "^7.3.4"
+    silent-error "^1.1.1"
+
 ember-cli@~3.25.2:
   version "3.25.2"
   resolved "https://registry.yarnpkg.com/ember-cli/-/ember-cli-3.25.2.tgz#e48203adfb2e6ff8f93d88b602f2c7c3b1633be2"