From 4bfb4cb3b6bfe6da630aaf9751655f3302ca9daa Mon Sep 17 00:00:00 2001 From: Robert Jackson Date: Tue, 26 Nov 2019 15:52:36 -0500 Subject: [PATCH 1/2] Add `broccoli-debug` debug trees throughout build infrastructure. --- ember-cli-build.js | 151 ++++++++++++++++++++++++++------------------- lib/index.js | 3 +- package.json | 2 +- 3 files changed, 90 insertions(+), 66 deletions(-) diff --git a/ember-cli-build.js b/ember-cli-build.js index 8bd6831af53..52343226be9 100644 --- a/ember-cli-build.js +++ b/ember-cli-build.js @@ -8,6 +8,7 @@ const testIndexHTML = require('./broccoli/test-index-html'); const testPolyfills = require('./broccoli/test-polyfills'); const rollupPackage = require('./broccoli/rollup-package'); const minify = require('./broccoli/minify'); +const debugTree = require('broccoli-debug').buildDebugCallback('ember-source:ember-cli-build'); const { routerES, @@ -63,74 +64,93 @@ module.exports = function({ project }) { let transpileTree = withTargets(project, emberSource.transpileTree.bind(emberSource)); let emberBundles = withTargets(project, emberSource.buildEmberBundles.bind(emberSource)); - let packages = new MergeTrees([ - // dynamically generated packages - emberVersionES(), + let packages = debugTree( + new MergeTrees([ + // dynamically generated packages + emberVersionES(), - // packages/** (after typescript compilation) - getPackagesES(), + // packages/** (after typescript compilation) + getPackagesES(), - // externalized helpers - babelHelpers(), - ]); + // externalized helpers + babelHelpers(), + ]), + 'packages:initial' + ); // Rollup if (SHOULD_ROLLUP) { - packages = new MergeTrees([ + packages = debugTree( + new MergeTrees([ + new Funnel(packages, { + exclude: [ + '@ember/-internals/browser-environment/index.js', + '@ember/-internals/browser-environment/lib/**', + '@ember/-internals/container/index.js', + '@ember/-internals/container/lib/**', + '@ember/-internals/environment/index.js', + '@ember/-internals/environment/lib/**', + '@ember/-internals/glimmer/index.js', + '@ember/-internals/glimmer/lib/**', + '@ember/-internals/metal/index.js', + '@ember/-internals/metal/lib/**', + '@ember/-internals/utils/index.js', + '@ember/-internals/utils/lib/**', + ], + }), + rollupPackage(packages, '@ember/-internals/browser-environment'), + rollupPackage(packages, '@ember/-internals/environment'), + rollupPackage(packages, '@ember/-internals/glimmer'), + rollupPackage(packages, '@ember/-internals/metal'), + rollupPackage(packages, '@ember/-internals/utils'), + rollupPackage(packages, '@ember/-internals/container'), + ]), + 'packages:rollup' + ); + } + + let dist = debugTree( + new MergeTrees([ new Funnel(packages, { + destDir: 'packages', exclude: [ - '@ember/-internals/browser-environment/index.js', - '@ember/-internals/browser-environment/lib/**', - '@ember/-internals/container/index.js', - '@ember/-internals/container/lib/**', - '@ember/-internals/environment/index.js', - '@ember/-internals/environment/lib/**', - '@ember/-internals/glimmer/index.js', - '@ember/-internals/glimmer/lib/**', - '@ember/-internals/metal/index.js', - '@ember/-internals/metal/lib/**', - '@ember/-internals/utils/index.js', - '@ember/-internals/utils/lib/**', + '**/package.json', + '@ember/-internals/*/tests/**' /* internal packages */, + '*/*/tests/**' /* scoped packages */, + '*/tests/**' /* packages */, + 'ember-template-compiler/**', + 'internal-test-helpers/**', ], }), - rollupPackage(packages, '@ember/-internals/browser-environment'), - rollupPackage(packages, '@ember/-internals/environment'), - rollupPackage(packages, '@ember/-internals/glimmer'), - rollupPackage(packages, '@ember/-internals/metal'), - rollupPackage(packages, '@ember/-internals/utils'), - rollupPackage(packages, '@ember/-internals/container'), - ]); - } - - let dist = new MergeTrees([ - new Funnel(packages, { - destDir: 'packages', - exclude: [ - '**/package.json', - '@ember/-internals/*/tests/**' /* internal packages */, - '*/*/tests/**' /* scoped packages */, - '*/tests/**' /* packages */, - 'ember-template-compiler/**', - 'internal-test-helpers/**', - ], - }), - new Funnel(emberHeaderFiles(), { destDir: 'header' }), - new Funnel(emberDependencies(ENV), { destDir: 'dependencies' }), - ]); + new Funnel(emberHeaderFiles(), { destDir: 'header' }), + new Funnel(emberDependencies(ENV), { destDir: 'dependencies' }), + ]), + 'dist' + ); // Test builds, tests, and test harness - let testFiles = new Funnel( - new MergeTrees([emberBundles(dist), testsBundle(packages, ENV, transpileTree), testHarness()]), - { - destDir: 'tests', - } + let testFiles = debugTree( + new Funnel( + new MergeTrees([ + emberBundles(dist), + testsBundle(packages, ENV, transpileTree), + testHarness(), + ]), + { + destDir: 'tests', + } + ), + 'testFiles' ); - let preBuilt = new Funnel(emberBundles(dist, false, { targets: modernBrowsers, loose: false }), { - getDestinationPath(path) { - return path.replace('ember.', 'ember.debug.'); - }, - }); + let preBuilt = debugTree( + new Funnel(emberBundles(dist, false, { targets: modernBrowsers, loose: false }), { + getDestinationPath(path) { + return path.replace('ember.', 'ember.debug.'); + }, + }), + 'preBuilt' + ); if (SHOULD_MINIFY) { preBuilt = minify(preBuilt); @@ -142,7 +162,7 @@ module.exports = function({ project }) { // Pre-built bundles preBuilt, - templateCompilerBundle(packages, transpileTree), + debugTree(templateCompilerBundle(packages, transpileTree), 'template-compiler'), testFiles, ]); @@ -150,14 +170,17 @@ module.exports = function({ project }) { function emberDependencies(environment) { // generate "loose" ES modules... - return new MergeTrees([ - backburnerES(), - rsvpES(), - dagES(), - routerES(), - routeRecognizerES(), - glimmerES(environment), - ]); + return debugTree( + new MergeTrees([ + backburnerES(), + rsvpES(), + dagES(), + routerES(), + routeRecognizerES(), + glimmerES(environment), + ]), + 'dependencies' + ); } function testsBundle(emberPackages, env, transpileTree) { diff --git a/lib/index.js b/lib/index.js index 40c9bd594a6..27054351ee7 100644 --- a/lib/index.js +++ b/lib/index.js @@ -8,6 +8,7 @@ const concatBundle = require('./concat-bundle'); const buildDebugMacroPlugin = require('./build-debug-macro-plugin'); const buildStripClassCallcheckPlugin = require('./build-strip-class-callcheck-plugin'); const injectBabelHelpers = require('./transforms/inject-babel-helpers'); +const debugTree = require('broccoli-debug').buildDebugCallback('ember-source:addon'); const PRE_BUILT_TARGETS = [ 'last 1 Chrome versions', @@ -253,6 +254,6 @@ module.exports = { }); } - return new MergeTrees([ember, templateCompiler, jquery]); + return debugTree(new MergeTrees([ember, templateCompiler, jquery]), 'vendor:final'); }, }; diff --git a/package.json b/package.json index ae2a541f34d..76efd2aee1d 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,7 @@ "babel-plugin-debug-macros": "^0.3.3", "babel-plugin-filter-imports": "^3.0.0", "broccoli-concat": "^3.7.4", + "broccoli-debug": "^0.6.4", "broccoli-funnel": "^2.0.2", "broccoli-merge-trees": "^3.0.2", "chalk": "^2.4.2", @@ -91,7 +92,6 @@ "babel-template": "^6.26.0", "backburner.js": "^2.6.0", "broccoli-babel-transpiler": "^7.3.0", - "broccoli-debug": "^0.6.4", "broccoli-file-creator": "^2.1.1", "broccoli-persistent-filter": "^2.3.1", "broccoli-plugin": "^3.0.0", From 60b8deeaf5acf389bb4bd1f4781d265698a8c4df Mon Sep 17 00:00:00 2001 From: Robert Jackson Date: Tue, 26 Nov 2019 16:00:26 -0500 Subject: [PATCH 2/2] [BUGFIX release] Ensure `loader.js` is transpiled via `targets`. Prior to this change, the `packages/loader/lib/index.js` file was not transpiled (at all). However, until 4a5b372e0 landed the file was still authored (manually) in IE11 compliant ES5 JavaScript. Once 4a5b372e0 landed however (first released in 3.14.0-beta.1) it is impossible to use the built assets in a browser that does not support `let` variable declaration (e.g. Safari 9). This ensures that `packages/loader/lib/index.js` passes through the same transpilation process as the rest of the application, and (confirmed manually) fixes the issue reported. Ironically, our CI did not catch this issue (even though we are properly testing in IE11) because IE11 actually supports `let` usage (with minor caveats). Also, since `loader.js` is the "one thing" that does not need modules transpilation, this also adds a new argument to `transpileTree`. Most of the time that option is `undefined` (and therefore not used at all), but for header files we need to avoid the module wrapping. --- lib/index.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/lib/index.js b/lib/index.js index 27054351ee7..d1c637a7cce 100644 --- a/lib/index.js +++ b/lib/index.js @@ -128,7 +128,7 @@ module.exports = { } }, - transpileTree(tree, isProduction) { + transpileTree(tree, isProduction, shouldCompileModules) { let emberCliBabel = this.addons.find(a => a.name === 'ember-cli-babel'); let parentOptions = this.parent && this.parent.options; @@ -158,6 +158,13 @@ module.exports = { }), }; + if (shouldCompileModules !== undefined) { + // ember-cli-babel internally uses **any** value that was provided IIF + // the option is set so this option must only be set when we have a + // useful value for it + options['ember-cli-babel'].compileModules = shouldCompileModules; + } + if (isProduction) { options.babel.plugins.push(buildStripClassCallcheckPlugin()); } @@ -173,7 +180,11 @@ module.exports = { isProduction ); - let headerFiles = new Funnel(tree, { srcDir: 'header' }); + let headerFiles = this.transpileTree( + new Funnel(tree, { srcDir: 'header' }), + isProduction, + false + ); let exclude = isProduction ? ['ember-testing/**'] : [];