Merge pull request #1955 from embroider-build/no-template-only-compilation-stage-2

Remove template-only components compilation from Stage 2

Author: ef4

packages/compat/src/audit/babel-visitor.ts

@@ -73,6 +73,8 @@ export function auditJS(rawSource: string, filename: string, babelConfig: Transf
             codeFrameIndex: saveCodeFrame(arg),
             specifiers: [],
           });
+        } else if (arg.type === 'BinaryExpression') {
+          // ignore binary expressions. Vite uses these (somehow) in the `@vite/client` import
         } else {
           problems.push({
             message: `audit tool is unable to understand this usage of ${

packages/compat/src/compat-app.ts

@@ -22,7 +22,6 @@ import { isEmbroiderMacrosPlugin, MacrosConfig } from '@embroider/macros/src/nod
 import resolvePackagePath from 'resolve-package-path';
 import Concat from 'broccoli-concat';
 import mapKeys from 'lodash/mapKeys';
-import SynthesizeTemplateOnlyComponents from './synthesize-template-only-components';
 import { isEmberAutoImportDynamic, isInlinePrecompilePlugin } from './detect-babel-plugins';
 import loadAstPlugins from './prepare-htmlbars-ast-plugins';
 import { readFileSync } from 'fs';
@@ -693,9 +692,6 @@ export default class CompatApp {
 
     let trees: BroccoliNode[] = [];
     trees.push(appTree);
-    trees.push(
-      new SynthesizeTemplateOnlyComponents(appTree, { allowedPaths: ['components'], templateExtensions: ['.hbs'] })
-    );
 
     if (testsTree) {
       trees.push(testsTree);

packages/core/src/app-files.ts

@@ -83,12 +83,23 @@ export class AppFiles {
       }
 
       if (relativePath.startsWith('components/')) {
-        // hbs files are resolvable, but not when they're used via co-location.
+        // hbs files are not resolvable when they're used via co-location with
+        // an associated js file because it's the js that is resolvable.
         // An hbs file is used via colocation when it's inside the components
         // directory, and also not named "template.hbs" (because that is an
         // older pattern used with pods-like layouts).
-        if (!relativePath.endsWith('.hbs') || relativePath.endsWith('/template.hbs')) {
+        let isHbs = relativePath.endsWith('.hbs');
+        if (!isHbs || relativePath.endsWith('/template.hbs')) {
           components.push(relativePath);
+        } else if (isHbs) {
+          // template-only components will be compiled as js files during the
+          // build process, so we push a virtual path to js in the list of files
+          // because the resolver will be able to recognize a template-only and
+          // give a correct answer in the end.
+          let jsPath = relativePath.replace(/\.hbs$/, '.js');
+          if (!combinedFiles.has(jsPath)) {
+            components.push(jsPath);
+          }
         }
         continue;
       }

packages/vite/src/hbs.ts

@@ -3,8 +3,9 @@
 import { createFilter } from '@rollup/pluginutils';
 import type { PluginContext, ResolvedId } from 'rollup';
 import type { Plugin } from 'vite';
-import { hbsToJS, ResolverLoader } from '@embroider/core';
+import { hbsToJS, ResolverLoader, cleanUrl } from '@embroider/core';
 import assertNever from 'assert-never';
+import { readFileSync } from 'fs-extra';
 import { parse as pathParse } from 'path';
 import makeDebug from 'debug';
 
@@ -30,15 +31,15 @@ export function hbs(): Plugin {
       }
     },
 
-    transform(source: string, id: string) {
+    load(id: string) {
       const meta = getMeta(this, id);
       if (!meta) {
         return;
       }
 
       switch (meta.type) {
         case 'template':
-          let code = hbsToJS(source);
+          let code = hbsToJS(`${readFileSync(cleanUrl(id))}`);
           return {
             code,
           };

test-packages/support/audit-assertions.ts

@@ -2,12 +2,13 @@ import type { AuditBuildOptions, Finding, Module } from '../../packages/compat/s
 import { httpAudit, type HTTPAuditOptions } from '../../packages/compat/src/http-audit';
 import type { Import } from '../../packages/compat/src/module-visitor';
 import { Audit } from '../../packages/compat/src/audit';
-import { explicitRelative } from '../../packages/shared-internals';
+import { cleanUrl, explicitRelative } from '../../packages/shared-internals';
 import { install as installCodeEqualityAssertions } from 'code-equality-assertions/qunit';
 import { posix } from 'path';
 import { distance } from 'fastest-levenshtein';
 import { sortBy } from 'lodash';
 import { getRewrittenLocation } from './rewritten-path';
+import { Memoize } from 'typescript-memoize';
 
 export { Import };
 
@@ -113,8 +114,14 @@ export class ExpectAuditResults {
 export class ExpectModule {
   constructor(private expectAudit: ExpectAuditResults, private inputName: string) {}
 
+  @Memoize()
   private get module() {
     let outputName = this.expectAudit.toRewrittenPath(this.inputName);
+    for (let [key, value] of Object.entries(this.expectAudit.result.modules)) {
+      if (cleanUrl(key) === outputName) {
+        return value;
+      }
+    }
     return this.expectAudit.result.modules[outputName];
   }
 
@@ -264,7 +271,15 @@ export class ExpectModule {
       this.emitMissingModule();
       return;
     }
-    this.expectAudit.assert.deepEqual(this.module.consumedFrom, paths.map(this.expectAudit.toRewrittenPath));
+
+    let consumedFrom = this.module.consumedFrom.map(m => {
+      if (typeof m === 'string') {
+        return cleanUrl(m);
+      }
+      return m;
+    });
+
+    this.expectAudit.assert.deepEqual(consumedFrom, paths.map(this.expectAudit.toRewrittenPath));
   }
 }