Add a test that covers addon templates and fix ember-try to include correct ember-cli versions

.github/workflows/ci.yml

@@ -31,6 +31,7 @@ jobs:
     runs-on: ${{ matrix.os }}-latest
 
     strategy:
+      fail-fast: false
       matrix:
         os: [ubuntu, windows]
         node-version: [12.x, 14.x]
@@ -73,9 +74,12 @@ jobs:
     needs: [test, lint]
 
     strategy:
+      fail-fast: false
       matrix:
         ember-try-scenario:
          - ember-lts-3.8
+         - ember-lts-3.12
+         - ember-lts-3.16
          - ember-lts-3.20
          - ember-lts-3.24
          - ember-lts-3.28

config/ember-try.js

@@ -12,6 +12,25 @@ module.exports = async function () {
         npm: {
           devDependencies: {
             'ember-source': '~3.8.0',
+            'ember-cli': '~3.8.0',
+          },
+        },
+      },
+      {
+        name: 'ember-lts-3.12',
+        npm: {
+          devDependencies: {
+            'ember-source': '~3.12.0',
+            'ember-cli': '~3.12.0',
+          },
+        },
+      },
+      {
+        name: 'ember-lts-3.16',
+        npm: {
+          devDependencies: {
+            'ember-source': '~3.16.0',
+            'ember-cli': '~3.16.0',
           },
         },
       },
@@ -20,6 +39,7 @@ module.exports = async function () {
         npm: {
           devDependencies: {
             'ember-source': '~3.20.5',
+            'ember-cli': '~3.20.0',
           },
         },
       },
@@ -28,6 +48,7 @@ module.exports = async function () {
         npm: {
           devDependencies: {
             'ember-source': '~3.24.3',
+            'ember-cli': '~3.24.0',
           },
         },
       },
@@ -36,6 +57,7 @@ module.exports = async function () {
         npm: {
           devDependencies: {
             'ember-source': '~3.28.0',
+            'ember-cli': '~3.28.0',
           },
         },
       },

lib/ember-addon-main.js

@@ -96,13 +96,36 @@ module.exports = {
         }
 
         this._addon.logger.debug(`setup *.hbs compiler with ${htmlbarsOptions.pluginNames}`);
-        return debugTree(
+        let output = debugTree(
           this._addon.transpileTree(inputTree, {
             isProduction,
             ...htmlbarsOptions,
           }),
           '03-output'
         );
+
+        let checker = new VersionChecker(this._addon.project).for('ember-cli', 'npm');
+        let requiresBabelTree = checker.lt('3.13.0');
+        let isAddon = this._addon.parent !== this._addon.project;
+
+        // as a result of https://github.com/ember-cli/ember-cli-htmlbars/pull/749 we are relying
+        // on babel for all template comilation. This works fine since ember-cli@3.13 but before
+        // that there was a different path for **addon** templates and they would not be compiled
+        // correctly. This change wraps the output of addons in a babel tree since ember-cli
+        // isn't doing that properly.
+        if (requiresBabelTree && isAddon) {
+          let babelAddon = this._addon.parent.addons.find(
+            (addon) => addon.name === 'ember-cli-babel'
+          );
+          output = babelAddon.transpileTree(output, {
+            babel: this._addon.parent.options.babel,
+            'ember-cli-babel': {
+              compileModules: false,
+            },
+          });
+        }
+
+        return output;
       },
 
       precompile(string, _options) {

package.json

@@ -79,6 +79,7 @@
     "ember-resolver": "^8.0.2",
     "ember-source": "~3.28.0",
     "ember-source-channel-url": "^3.0.0",
+    "ember-styleguide": "^5.0.0",
     "ember-template-lint": "^3.6.0",
     "ember-try": "^1.4.0",
     "eslint": "^7.32.0",
@@ -109,6 +110,9 @@
     "main": "lib/ember-addon-main.js",
     "configPath": "tests/dummy/config"
   },
+  "resolutions": {
+    "ember-cli-htmlbars": "link:."
+  },
   "release-it": {
     "plugins": {
       "release-it-lerna-changelog": {

tests/acceptance/styleguide-test.js

@@ -0,0 +1,15 @@
+import { module, test } from 'qunit';
+import { visit, currentURL } from '@ember/test-helpers';
+import { setupApplicationTest } from 'ember-qunit';
+
+module('Acceptance | styleguide', function (hooks) {
+  setupApplicationTest(hooks);
+
+  test('visiting /styleguide', async function (assert) {
+    await visit('/styleguide');
+
+    assert.equal(currentURL(), '/styleguide');
+
+    assert.dom('[data-test-es-note-heading]').containsText('says...');
+  });
+});

tests/dummy/app/router.js

@@ -6,6 +6,8 @@ const Router = EmberRouter.extend({
   rootURL: config.rootURL,
 });
 
-Router.map(function () {});
+Router.map(function () {
+  this.route('styleguide');
+});
 
 export default Router;

tests/dummy/app/templates/styleguide.hbs

@@ -0,0 +1 @@
+<EsNote>You should try out this cool note component</EsNote>