diff --git a/lib/babel-plugin.ts b/lib/babel-plugin.ts index 907cc17..c4af1fb 100644 --- a/lib/babel-plugin.ts +++ b/lib/babel-plugin.ts @@ -1,11 +1,12 @@ import { parse, PluginObj } from '@babel/core'; import type * as BabelTypesNamespace from '@babel/types'; import { + AssignmentExpression, Identifier, ImportDefaultSpecifier, ImportNamespaceSpecifier, ImportSpecifier, - Program, StringLiteral + Program, Statement, StringLiteral } from '@babel/types'; import * as glimmer from '@glimmer/syntax'; import { @@ -182,15 +183,16 @@ class HotAstProcessor { if (original?.includes('.')) return; if (!original) return; const param = glimmer.builders.path(`${importVar}.${original}`); - parent.params.splice(0, 1); - parent.params.push(param); + parent.params.splice(0, 1, param); + importBindings.add(original); + return; } if (importVar) { if (findImport(node.original)) { - node.original = `${importVar}.${original}` + node.original.split('.').slice(1).join('.'); + node.original = `${importVar}.${node.original}`; node.parts = node.original.split('.'); - importBindings.add(original) + importBindings.add(original); } return; } @@ -245,12 +247,13 @@ export default function hotReplaceAst( klass.body.body.push(t.classProperty(t.identifier(local), t.identifier(local), null, [t.decorator(tracked)])); } - const assign = t.assignmentExpression('=', t.identifier(hotAstProcessor.meta.importVar), klass); + const newExp = t.newExpression(klass, []); + const assign = t.assignmentExpression('=', t.identifier(hotAstProcessor.meta.importVar), newExp); const varDeclaration = path.node.body.findIndex((e: BabelTypesNamespace.Statement) => e.type === 'VariableDeclaration' && (e.declarations[0]!.id as BabelTypesNamespace.Identifier).name === hotAstProcessor.meta.importVar) + 1; const lastImportIndex = path.node.body.findLastIndex((e: BabelTypesNamespace.Statement) => e.type === 'ImportDeclaration') + 1 - path.node.body.splice(Math.max(varDeclaration, lastImportIndex), 0, assign as any); + path.node.body.splice(Math.max(varDeclaration, lastImportIndex), 0, assign as unknown as Statement); const findImport = function findImport(specifier) { return path.node.body.find(b => b.type === 'ImportDeclaration' && b.specifiers.some(s => s.local.name === specifier)); diff --git a/package.json b/package.json index ec33775..bb6d50e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-vite-hmr", - "version": "1.4.3", + "version": "1.4.4", "keywords": [ "ember-addon" ], diff --git a/tests/babel-plugin.test.js b/tests/babel-plugin.test.js index 9ca2184..440ae92 100644 --- a/tests/babel-plugin.test.js +++ b/tests/babel-plugin.test.js @@ -63,14 +63,14 @@ describe('convert template with hot reload helpers', () => { import myhelper from "embroider_compat/helpers/my-helper"; import { precompileTemplate } from "@ember/template-compilation"; import { tracked } from "@glimmer/tracking"; - template__imports__ = class _Imports { + template__imports__ = new class _Imports { static { [_init_NamedComponent, _init_SomeComponent, _init_myhelper] = _applyDecs2203R(this, [[tracked, 0, "NamedComponent"], [tracked, 0, "SomeComponent"], [tracked, 0, "myhelper"]], []).e; } NamedComponent = _init_NamedComponent(this, NamedComponent); SomeComponent = _init_SomeComponent(this, SomeComponent); myhelper = _init_myhelper(this, myhelper); - } + }() export default precompileTemplate("\\n {{(template__imports__.myhelper)}}\\n \\n \\n ", { moduleName: 'a.hbs', scope: () => ({ @@ -114,14 +114,14 @@ describe('convert template with hot reload helpers', () => { import myhelper from "embroider_compat/helpers/my-helper"; import { createTemplateFactory } from "@ember/template-factory"; import { tracked } from "@glimmer/tracking"; - template__imports__ = class _Imports { + template__imports__ = new class _Imports { static { [_init_NamedComponent, _init_SomeComponent, _init_myhelper] = _applyDecs2203R(this, [[tracked, 0, "NamedComponent"], [tracked, 0, "SomeComponent"], [tracked, 0, "myhelper"]], []).e; } NamedComponent = _init_NamedComponent(this, NamedComponent); SomeComponent = _init_SomeComponent(this, SomeComponent); myhelper = _init_myhelper(this, myhelper); - } + }() export default createTemplateFactory( /* @@ -156,6 +156,7 @@ describe('convert template with hot reload helpers', () => { @@ -184,7 +185,7 @@ describe('convert template with hot reload helpers', () => { import templateOnly from "@ember/component/template-only"; import { tracked } from "@glimmer/tracking"; let template__imports__ = null; - template__imports__ = class _Imports { + template__imports__ = new class _Imports { static { [_init_NamedComponent, _init_Other, _init_SomeComponent, _init_myhelper] = _applyDecs2203R(this, [[tracked, 0, "NamedComponent"], [tracked, 0, "Other"], [tracked, 0, "SomeComponent"], [tracked, 0, "myhelper"]], []).e; } @@ -192,14 +193,14 @@ describe('convert template with hot reload helpers', () => { Other = _init_Other(this, Other); SomeComponent = _init_SomeComponent(this, SomeComponent); myhelper = _init_myhelper(this, myhelper); - } + }() const T = setComponentTemplate(precompileTemplate("\\n \\n ", { scope: () => ({ template__imports__ }), strictMode: true }), templateOnly()); - export default setComponentTemplate(precompileTemplate("\\n {{(template__imports__.myhelper)}}\\n \\n \\n ", { + export default setComponentTemplate(precompileTemplate("\\n {{(template__imports__.myhelper)}}\\n {{component template__imports__.SomeComponent}}\\n \\n \\n ", { scope: () => ({ template__imports__ }), @@ -238,7 +239,7 @@ describe('convert template with hot reload helpers', () => { import templateOnly from "@ember/component/template-only"; import { tracked } from "@glimmer/tracking"; let template__imports__ = null; - template__imports__ = class _Imports { + template__imports__ = new class _Imports { static { [_init_NamedComponent, _init_Other, _init_SomeComponent, _init_myhelper] = _applyDecs2203R(this, [[tracked, 0, "NamedComponent"], [tracked, 0, "Other"], [tracked, 0, "SomeComponent"], [tracked, 0, "myhelper"]], []).e; } @@ -246,7 +247,7 @@ describe('convert template with hot reload helpers', () => { Other = _init_Other(this, Other); SomeComponent = _init_SomeComponent(this, SomeComponent); myhelper = _init_myhelper(this, myhelper); - } + }() const T = setComponentTemplate(createTemplateFactory( /* @@ -264,13 +265,14 @@ describe('convert template with hot reload helpers', () => { /* {{(myhelper)}} + {{component SomeComponent}} */ { "id": "--id--", - "block": "[[[1,\\"\\\\n \\"],[1,[28,[32,0,[\\"myhelper\\"]],null,null]],[1,\\"\\\\n \\"],[8,[32,0,[\\"SomeComponent\\"]],null,null,null],[1,\\"\\\\n \\"],[8,[32,0,[\\"NamedComponent\\"]],null,null,null],[1,\\"\\\\n \\"]],[],false,[]]", + "block": "[[[1,\\"\\\\n \\"],[1,[28,[32,0,[\\"myhelper\\"]],null,null]],[1,\\"\\\\n \\"],[46,[32,0,[\\"SomeComponent\\"]],null,null,null],[1,\\"\\\\n \\"],[8,[32,0,[\\"SomeComponent\\"]],null,null,null],[1,\\"\\\\n \\"],[8,[32,0,[\\"NamedComponent\\"]],null,null,null],[1,\\"\\\\n \\"]],[],false,[\\"component\\"]]", "moduleName": "/rewritten-app/a.gts", "scope": () => [template__imports__], "isStrictMode": true