@embroider/compat 3.8.1 → 4.0.0-alpha.1

package/src/compat-app.js

@@ -18,8 +18,8 @@ const broccoli_funnel_1 = __importDefault(require("broccoli-funnel"));
 const broccoli_merge_trees_1 = __importDefault(require("broccoli-merge-trees"));
 const broccoli_source_1 = require("broccoli-source");
 const resolve_1 = __importDefault(require("resolve"));
+const content_for_config_1 = __importDefault(require("./content-for-config"));
 const v1_config_1 = require("./v1-config");
-const v1_appboot_1 = require("./v1-appboot");
 const fs_extra_1 = require("fs-extra");
 const add_to_tree_1 = __importDefault(require("./add-to-tree"));
 const dummy_package_1 = __importDefault(require("./dummy-package"));
@@ -27,12 +27,12 @@ const node_1 = require("@embroider/macros/src/node");
 const resolve_package_path_1 = __importDefault(require("resolve-package-path"));
 const broccoli_concat_1 = __importDefault(require("broccoli-concat"));
 const mapKeys_1 = __importDefault(require("lodash/mapKeys"));
-const synthesize_template_only_components_1 = __importDefault(require("./synthesize-template-only-components"));
 const detect_babel_plugins_1 = require("./detect-babel-plugins");
 const prepare_htmlbars_ast_plugins_1 = __importDefault(require("./prepare-htmlbars-ast-plugins"));
 const fs_1 = require("fs");
 const semver_1 = __importDefault(require("semver"));
 const compat_app_builder_1 = require("./compat-app-builder");
+const walk_sync_1 = __importDefault(require("walk-sync"));
 const broccoli_file_creator_1 = __importDefault(require("broccoli-file-creator"));
 // This runs at broccoli-pipeline-construction time, whereas the
 // CompatAppBuilder instance only becomes available during tree-building time.
@@ -78,9 +78,6 @@ class CompatApp {
         // eslint-disable-next-line @typescript-eslint/no-require-imports
         return require(resolve_1.default.sync(specifier, { basedir: this.emberCLILocation }));
     }
-    get configReplace() {
-        return this.requireFromEmberCLI('broccoli-config-replace');
-    }
     get configLoader() {
         return this.requireFromEmberCLI('broccoli-config-loader');
     }
@@ -114,20 +111,21 @@ class CompatApp {
             return new v1_config_1.V1Config(this.configTree, 'test');
         }
     }
+    get contentFor() {
+        const configPaths = [
+            { file: '/index.html', path: (0, path_1.join)('environments', `${this.legacyEmberAppInstance.env}.json`) },
+        ];
+        if (this.shouldBuildTests)
+            configPaths.push({ file: '/tests/index.html', path: (0, path_1.join)('environments', `test.json`) });
+        return new content_for_config_1.default(this.configTree, {
+            availableContentForTypes: this.options.availableContentForTypes,
+            configPaths,
+            pattern: this.filteredPatternsByContentFor.contentFor,
+        });
+    }
     get autoRun() {
         return this.legacyEmberAppInstance.options.autoRun;
     }
-    get appBoot() {
-        let env = this.legacyEmberAppInstance.env;
-        let appBootContentTree = new v1_appboot_1.WriteV1AppBoot();
-        let patterns = this.configReplacePatterns;
-        appBootContentTree = new this.configReplace(appBootContentTree, this.configTree, {
-            configPath: (0, path_1.join)('environments', `${env}.json`),
-            files: ['config/app-boot.js'],
-            patterns,
-        });
-        return new v1_appboot_1.ReadV1AppBoot(appBootContentTree);
-    }
     get storeConfigInMeta() {
         return this.legacyEmberAppInstance.options.storeConfigInMeta;
     }
@@ -138,93 +136,36 @@ class CompatApp {
             storeConfigInMeta: this.storeConfigInMeta,
         });
     }
-    get htmlTree() {
-        if (this.legacyEmberAppInstance.tests) {
-            return (0, broccoli_merge_trees_1.default)([this.indexTree, this.testIndexTree]);
-        }
-        else {
-            return this.indexTree;
-        }
-    }
-    get indexTree() {
-        let indexFilePath = this.legacyEmberAppInstance.options.outputPaths.app.html;
-        let index = (0, broccoli_funnel_1.default)(this.legacyEmberAppInstance.trees.app, {
-            allowEmpty: true,
-            include: [`index.html`],
-            getDestinationPath: () => indexFilePath,
-            annotation: 'app/index.html',
-        });
-        return new this.configReplace(index, this.configTree, {
-            configPath: (0, path_1.join)('environments', `${this.legacyEmberAppInstance.env}.json`),
-            files: [indexFilePath],
-            patterns: this.configReplacePatterns,
-            annotation: 'ConfigReplace/indexTree',
-        });
-    }
-    get testIndexTree() {
-        let index = (0, broccoli_funnel_1.default)(this.legacyEmberAppInstance.trees.tests, {
-            allowEmpty: true,
-            include: [`index.html`],
-            destDir: 'tests',
-            annotation: 'tests/index.html',
-        });
-        return new this.configReplace(index, this.configTree, {
-            configPath: (0, path_1.join)('environments', `test.json`),
-            files: ['tests/index.html'],
-            patterns: this.configReplacePatterns,
-            annotation: 'ConfigReplace/testIndexTree',
-        });
+    get filteredPatternsByContentFor() {
+        const filter = '/{{content-for [\'"](.+?)["\']}}/g';
+        return {
+            contentFor: this.configReplacePatterns.find((pattern) => filter.includes(pattern.match.toString())),
+            others: this.configReplacePatterns.filter((pattern) => !filter.includes(pattern.match.toString())),
+        };
     }
-    babelConfig() {
-        // this finds all the built-in babel configuration that comes with ember-cli-babel
-        const babelAddon = this.legacyEmberAppInstance.project.findAddonByName('ember-cli-babel');
-        const babelConfig = babelAddon.buildBabelOptions({
-            'ember-cli-babel': {
-                ...this.legacyEmberAppInstance.options['ember-cli-babel'],
-                includeExternalHelpers: true,
-                compileModules: false,
-                disableDebugTooling: false,
-                disablePresetEnv: false,
-                disableEmberModulesAPIPolyfill: false,
-            },
-        });
-        let plugins = babelConfig.plugins;
-        let presets = babelConfig.presets;
-        // this finds any custom babel configuration that's on the app (either
-        // because the app author explicitly added some, or because addons have
-        // pushed plugins into it).
+    extraBabelPlugins() {
+        // this finds any custom babel plugins on the app (either because the app
+        // author explicitly added some, or because addons have pushed plugins into
+        // it).
         let appBabel = this.legacyEmberAppInstance.options.babel;
         if (appBabel) {
             if (appBabel.plugins) {
-                plugins = appBabel.plugins.concat(plugins);
-            }
-            if (appBabel.presets) {
-                presets = appBabel.presets.concat(presets);
+                return appBabel.plugins.filter(p => {
+                    // even if the app was using @embroider/macros, we drop it from the config
+                    // here in favor of our globally-configured one.
+                    return (!(0, node_1.isEmbroiderMacrosPlugin)(p) &&
+                        // similarly, if the app was already using an inline template compiler
+                        // babel plugin, we remove it here because we have our own
+                        // always-installed version of that (v2 addons are allowed to assume it
+                        // will be present in the final app build, the app doesn't get to turn
+                        // that off or configure it.)
+                        !(0, detect_babel_plugins_1.isInlinePrecompilePlugin)(p) &&
+                        !(0, detect_babel_plugins_1.isEmberAutoImportDynamic)(p) &&
+                        !(0, detect_babel_plugins_1.isHtmlbarColocation)(p));
+                });
             }
         }
-        plugins = plugins.filter(p => {
-            // even if the app was using @embroider/macros, we drop it from the config
-            // here in favor of our globally-configured one.
-            return (!(0, node_1.isEmbroiderMacrosPlugin)(p) &&
-                // similarly, if the app was already using an inline template compiler
-                // babel plugin, we remove it here because we have our own
-                // always-installed version of that (v2 addons are allowed to assume it
-                // will be present in the final app build, the app doesn't get to turn
-                // that off or configure it.)
-                !(0, detect_babel_plugins_1.isInlinePrecompilePlugin)(p) &&
-                !(0, detect_babel_plugins_1.isEmberAutoImportDynamic)(p));
-        });
-        const config = {
-            babelrc: false,
-            plugins,
-            presets,
-            // this is here because broccoli-middleware can't render a codeFrame full
-            // of terminal codes. It would be nice to add something like
-            // https://github.com/mmalecki/ansispan to broccoli-middleware so we can
-            // leave color enabled.
-            highlightCode: false,
-        };
-        return config;
+        return [];
     }
     babelMajorVersion() {
         var _a, _b;
@@ -378,11 +319,32 @@ class CompatApp {
                 (0, fs_extra_1.ensureDirSync)((0, path_1.dirname)(destPath));
                 (0, fs_extra_1.copySync)(sourcePath, destPath);
             }
+            if (this.shouldBuildTests) {
+                (0, fs_extra_1.writeFileSync)((0, path_1.join)(outputPath, 'testem.js'), `/*
+ * This is dummy file that exists for the sole purpose
+ * of allowing tests to run directly in the browser as
+ * well as by Testem.
+ *
+ * Testem is configured to run tests directly against
+ * the test build of index.html, which requires a
+ * snippet to load the testem.js file:
+ *   <script src="/testem.js"></script>
+ * This has to go before the qunit framework and app
+ * tests are loaded.
+ *
+ * Testem internally supplies this file. However, if you
+ * run the tests directly in the browser (localhost:8000/tests),
+ * this file does not exist.
+ *
+ * Hence the purpose of this fake file. This file is served
+ * directly from the express server to satisify the script load.
+*/`);
+                this._publicAssets['/testem.js'] = './testem.js';
+            }
             let remapAsset = this.remapAsset.bind(this);
             let addonMeta = {
-                type: 'addon',
                 version: 2,
-                'implicit-scripts': this._implicitScripts.map(remapAsset),
+                'implicit-scripts': this._implicitScripts.map(remapAsset).filter(forbiddenVendorPath),
                 'implicit-styles': this._implicitStyles.map(remapAsset),
                 'implicit-test-scripts': this.legacyEmberAppInstance.legacyTestFilesToAppend.map(remapAsset),
                 'implicit-test-styles': this.legacyEmberAppInstance.vendorTestStaticStyles.map(remapAsset),
@@ -426,7 +388,7 @@ class CompatApp {
             // internal implementation detail, and respecting outputPaths here is
             // unnecessary complexity. The corresponding code that adjusts the HTML
             // <link> is in updateHTML in app.ts.
-            outputPaths: { app: `/assets/${this.name}.css` },
+            outputPaths: { app: `/@embroider/virtual/app.css` },
             registry: this.legacyEmberAppInstance.registry,
             minifyCSS: this.legacyEmberAppInstance.options.minifyCSS.options,
         };
@@ -434,14 +396,13 @@ class CompatApp {
         let styles = this.preprocessors.preprocessCss(nestedInput, '/app/styles', '/assets', options);
         return new add_to_tree_1.default(styles, outputPath => {
             let addonMeta = {
-                type: 'addon',
                 version: 2,
                 'public-assets': {},
             };
-            let assetPath = (0, path_1.join)(outputPath, 'assets');
+            let assetPath = (0, path_1.join)(outputPath, '@embroider', 'virtual');
             if ((0, fs_extra_1.pathExistsSync)(assetPath)) {
-                for (let file of (0, fs_extra_1.readdirSync)(assetPath)) {
-                    addonMeta['public-assets'][`./assets/${file}`] = `/assets/${file}`;
+                for (let file of (0, walk_sync_1.default)(assetPath, { directories: false })) {
+                    addonMeta['public-assets'][`./@embroider/virtual/${file}`] = `/@embroider/virtual/${file}`;
                 }
             }
             let meta = {
@@ -488,19 +449,6 @@ class CompatApp {
         }
         return './' + asset;
     }
-    preprocessJS(tree) {
-        // we're saving all our babel compilation for the final stage packager
-        this.legacyEmberAppInstance.registry.remove('js', 'ember-cli-babel');
-        // auto-import is supported natively so we don't need it here
-        this.legacyEmberAppInstance.registry.remove('js', 'ember-auto-import-analyzer');
-        tree = (0, broccoli_funnel_1.default)(tree, { destDir: this.name });
-        tree = this.preprocessors.preprocessJs(tree, `/`, '/', {
-            annotation: 'v1-app-preprocess-js',
-            registry: this.legacyEmberAppInstance.registry,
-        });
-        tree = (0, broccoli_funnel_1.default)(tree, { srcDir: this.name });
-        return tree;
-    }
     get htmlbarsPlugins() {
         let plugins = (0, prepare_htmlbars_ast_plugins_1.default)(this.legacyEmberAppInstance.registry);
         // even if the app was using @embroider/macros, we drop it from the config
@@ -508,25 +456,6 @@ class CompatApp {
         plugins = plugins.filter((p) => !(0, node_1.isEmbroiderMacrosPlugin)(p));
         return plugins;
     }
-    // our own appTree. Not to be confused with the one that combines the app js
-    // from all addons too.
-    get appTree() {
-        return this.preprocessJS((0, broccoli_funnel_1.default)(this.legacyEmberAppInstance.trees.app, {
-            exclude: ['styles/**', '*.html'],
-        }));
-    }
-    get testsTree() {
-        if (this.shouldBuildTests && this.legacyEmberAppInstance.trees.tests) {
-            return this.preprocessJS((0, broccoli_funnel_1.default)(this.legacyEmberAppInstance.trees.tests, {
-                destDir: 'tests',
-            }));
-        }
-    }
-    get lintTree() {
-        if (this.shouldBuildTests) {
-            return this.legacyEmberAppInstance.getLintTests();
-        }
-    }
     get vendorTree() {
         return this.ensureTree(this.legacyEmberAppInstance.trees.vendor);
     }
@@ -550,69 +479,6 @@ class CompatApp {
     get preprocessors() {
         return this.requireFromEmberCLI('ember-cli-preprocess-registry/preprocessors');
     }
-    get publicTree() {
-        return this.ensureTree(this.legacyEmberAppInstance.trees.public);
-    }
-    processAppJS() {
-        let appTree = this.appTree;
-        let testsTree = this.testsTree;
-        let lintTree = this.lintTree;
-        let config = new v1_config_1.WriteV1Config(this.config, this.storeConfigInMeta, this.testConfig);
-        let patterns = this.configReplacePatterns;
-        let configReplaced = new this.configReplace(config, this.configTree, {
-            configPath: (0, path_1.join)('environments', `${this.legacyEmberAppInstance.env}.json`),
-            files: ['config/environment.js'],
-            patterns,
-        });
-        let trees = [];
-        trees.push(appTree);
-        trees.push(new synthesize_template_only_components_1.default(appTree, { allowedPaths: ['components'], templateExtensions: ['.hbs'] }));
-        trees.push(configReplaced);
-        if (testsTree) {
-            trees.push(testsTree);
-        }
-        if (lintTree) {
-            trees.push(lintTree);
-        }
-        return {
-            appJS: (0, broccoli_merge_trees_1.default)(trees, { overwrite: true }),
-        };
-    }
-    withoutRootURL(src) {
-        let rootURL = this.config.readConfig().rootURL;
-        if ((src.startsWith(rootURL) && rootURL) || (!rootURL && !src.startsWith('/'))) {
-            src = '/' + src.slice(rootURL.length);
-        }
-        else if (src.startsWith('/' + rootURL)) {
-            src = src.slice(rootURL.length);
-        }
-        return src;
-    }
-    findAppScript(scripts, entrypoint) {
-        let appJS = scripts.find(script => this.withoutRootURL(script.src) === this.legacyEmberAppInstance.options.outputPaths.app.js);
-        return throwIfMissing(appJS, this.legacyEmberAppInstance.options.outputPaths.app.js, scripts.map(s => s.src), entrypoint, 'app javascript');
-    }
-    findAppStyles(styles, entrypoint) {
-        let style = styles.find(style => this.withoutRootURL(style.href) === this.legacyEmberAppInstance.options.outputPaths.app.css.app);
-        return throwIfMissing(style, this.legacyEmberAppInstance.options.outputPaths.app.css.app, styles.map(s => s.href), entrypoint, 'app css');
-    }
-    findVendorScript(scripts, entrypoint) {
-        let vendor = scripts.find(script => this.withoutRootURL(script.src) === this.legacyEmberAppInstance.options.outputPaths.vendor.js);
-        return throwIfMissing(vendor, this.legacyEmberAppInstance.options.outputPaths.vendor.js, scripts.map(s => s.src), entrypoint, 'vendor javascript');
-    }
-    findVendorStyles(styles, entrypoint) {
-        let vendorStyle = styles.find(style => this.withoutRootURL(style.href) === this.legacyEmberAppInstance.options.outputPaths.vendor.css);
-        return throwIfMissing(vendorStyle, this.legacyEmberAppInstance.options.outputPaths.vendor.css, styles.map(s => s.href), entrypoint, 'vendor css');
-    }
-    findTestSupportStyles(styles) {
-        return styles.find(style => this.withoutRootURL(style.href) === this.legacyEmberAppInstance.options.outputPaths.testSupport.css);
-    }
-    findTestSupportScript(scripts) {
-        return scripts.find(script => this.withoutRootURL(script.src) === this.legacyEmberAppInstance.options.outputPaths.testSupport.js.testSupport);
-    }
-    findTestScript(scripts) {
-        return scripts.find(script => this.withoutRootURL(script.src) === this.legacyEmberAppInstance.options.outputPaths.tests.js);
-    }
     constructor(legacyEmberAppInstance, _options) {
         this.legacyEmberAppInstance = legacyEmberAppInstance;
         this.annotation = '@embroider/compat/app';
@@ -640,17 +506,11 @@ class CompatApp {
         });
     }
     inTrees(prevStageTree) {
-        let publicTree = this.publicTree;
         let configTree = this.config;
-        if (this.options.extraPublicTrees.length > 0) {
-            publicTree = (0, broccoli_merge_trees_1.default)([publicTree, ...this.options.extraPublicTrees].filter(Boolean));
-        }
+        let contentForTree = this.contentFor;
         return {
-            appJS: this.processAppJS().appJS,
-            htmlTree: this.htmlTree,
-            publicTree,
             configTree,
-            appBootTree: this.appBoot,
+            contentForTree,
             prevStageTree,
         };
     }
@@ -666,25 +526,25 @@ class CompatApp {
             return packageCache.get(this.root);
         }
     }
-    async instantiate(root, packageCache, configTree) {
+    async instantiate(packageCache, configTree, contentForTree) {
         let origAppPkg = this.appPackage();
         let movedAppPkg = packageCache.withRewrittenDeps(origAppPkg);
         let workingDir = (0, core_1.locateEmbroiderWorkingDir)(this.root);
-        return new compat_app_builder_1.CompatAppBuilder(root, origAppPkg, movedAppPkg, this.options, this, configTree, packageCache.get((0, path_1.join)(workingDir, 'rewritten-packages', '@embroider', 'synthesized-vendor')), packageCache.get((0, path_1.join)(workingDir, 'rewritten-packages', '@embroider', 'synthesized-styles')));
+        return new compat_app_builder_1.CompatAppBuilder(origAppPkg, movedAppPkg, this.options, this, configTree, contentForTree, packageCache.get((0, path_1.join)(workingDir, 'rewritten-packages', '@embroider', 'synthesized-vendor')), packageCache.get((0, path_1.join)(workingDir, 'rewritten-packages', '@embroider', 'synthesized-styles')));
     }
     asStage(prevStage) {
         let resolve;
         let promise = new Promise(r => (resolve = r));
         let tree = () => {
             let inTrees = this.inTrees(prevStage.tree);
-            return new core_1.WaitForTrees(inTrees, this.annotation, async (treePaths) => {
+            return new core_1.WaitForTrees(inTrees, this.annotation, async (_treePaths) => {
                 if (!this.active) {
                     let { outputPath } = await prevStage.ready();
                     let packageCache = core_1.RewrittenPackageCache.shared('embroider', this.root);
-                    this.active = await this.instantiate(outputPath, packageCache, inTrees.configTree);
+                    this.active = await this.instantiate(packageCache, inTrees.configTree, inTrees.contentForTree);
                     resolve({ outputPath });
                 }
-                await this.active.build(treePaths);
+                await this.active.build();
             });
         };
         return {
@@ -724,13 +584,13 @@ __decorate([
 ], CompatApp.prototype, "testConfig", null);
 __decorate([
     (0, typescript_memoize_1.Memoize)()
-], CompatApp.prototype, "appBoot", null);
+], CompatApp.prototype, "contentFor", null);
 __decorate([
     (0, typescript_memoize_1.Memoize)()
 ], CompatApp.prototype, "configReplacePatterns", null);
 __decorate([
     (0, typescript_memoize_1.Memoize)()
-], CompatApp.prototype, "babelConfig", null);
+], CompatApp.prototype, "extraBabelPlugins", null);
 __decorate([
     (0, typescript_memoize_1.Memoize)()
 ], CompatApp.prototype, "babelMajorVersion", null);
@@ -743,12 +603,9 @@ __decorate([
 __decorate([
     (0, typescript_memoize_1.Memoize)()
 ], CompatApp.prototype, "appPackage", null);
-function throwIfMissing(asset, needle, haystack, entryfile, context) {
-    if (!asset) {
-        throw new Error(`Could not find ${context}: "${needle}" in ${entryfile}. Found the following instead:\n${haystack
-            .map(asset => ` - ${asset}`)
-            .join('\n')}\n\nFor more information about this error: https://github.com/thoov/stitch/wiki/Could-not-find-asset-in-entry-file-error-help`);
-    }
-    return asset;
+function forbiddenVendorPath(path) {
+    // ember-source does not go in vendor under embroider (we always use the
+    // separate ES modules)
+    return !['./vendor/ember/ember.js'].includes(path);
 }
 //# sourceMappingURL=compat-app.js.map