fix(transform): always update lazy class declaration

src/compiler/transformers/test/lazy-component.spec.ts

@@ -0,0 +1,34 @@
+import * as d from '../../../declarations';
+import { transpileModule } from './transpile';
+import { lazyComponentTransform } from '../component-lazy/transform-lazy-component';
+import { mockCompilerCtx } from '@stencil/core/testing';
+
+describe('lazy-component', () => {
+  it('add registerInstance() to constructor w/ decorator on class', () => {
+    const compilerCtx = mockCompilerCtx();
+    const transformOpts: d.TransformOptions = {
+      coreImportPath: '@stencil/core',
+      componentExport: 'lazy',
+      componentMetadata: null,
+      currentDirectory: '/',
+      proxy: null,
+      style: 'static',
+    };
+
+    const code = `
+      @Component({
+        tag: 'cmp-a'
+      })
+      export class CmpA {
+        @format something = '12';
+      }
+    `;
+
+    const transformer = lazyComponentTransform(compilerCtx, transformOpts);
+
+    const t = transpileModule(code, null, compilerCtx, null, [], [transformer]);
+
+    expect(t.outputText).toContain(`import { registerInstance as __stencil_registerInstance } from "@stencil/core"`);
+    expect(t.outputText).toContain(`__stencil_registerInstance(this, hostRef)`);
+  });
+});

src/compiler/transformers/test/transpile.ts

@@ -3,8 +3,17 @@ import { convertDecoratorsToStatic } from '../decorators-to-static/convert-decor
 import { convertStaticToMeta } from '../static-to-meta/visitor';
 import { mockBuildCtx, mockCompilerCtx, mockConfig, mockStencilSystem } from '@stencil/core/testing';
 import ts from 'typescript';
-
-export function transpileModule(input: string, config?: d.Config, compilerCtx?: d.CompilerCtx, sys?: d.StencilSystem) {
+import { updateModule } from '../static-to-meta/parse-static';
+import { getScriptTarget } from '../transform-utils';
+
+export function transpileModule(
+  input: string,
+  config?: d.Config,
+  compilerCtx?: d.CompilerCtx,
+  sys?: d.CompilerSystem,
+  beforeTransformers: ts.TransformerFactory<ts.SourceFile>[] = [],
+  afterTransformers: ts.TransformerFactory<ts.SourceFile>[] = [],
+) {
   const options = ts.getDefaultCompilerOptions();
   options.isolatedModules = true;
   options.suppressOutputPathCheck = true;
@@ -15,6 +24,7 @@ export function transpileModule(input: string, config?: d.Config, compilerCtx?:
   options.types = undefined;
   options.noEmit = undefined;
   options.noEmitOnError = undefined;
+  options.noEmitHelpers = true;
   options.paths = undefined;
   options.rootDirs = undefined;
   options.declaration = undefined;
@@ -25,7 +35,7 @@ export function transpileModule(input: string, config?: d.Config, compilerCtx?:
   options.noResolve = true;
 
   options.module = ts.ModuleKind.ESNext;
-  options.target = ts.ScriptTarget.ES2017;
+  options.target = getScriptTarget();
   options.experimentalDecorators = true;
 
   options.jsx = ts.JsxEmit.React;
@@ -36,9 +46,16 @@ export function transpileModule(input: string, config?: d.Config, compilerCtx?:
 
   let outputText: string;
 
+  const emitCallback: ts.WriteFileCallback = (emitFilePath, data, _w, _e, tsSourceFiles) => {
+    if (emitFilePath.endsWith('.js')) {
+      outputText = data;
+      updateModule(config, compilerCtx, buildCtx, tsSourceFiles[0], data, emitFilePath, tsTypeChecker, null);
+    }
+  };
+
   const compilerHost: ts.CompilerHost = {
     getSourceFile: fileName => (fileName === inputFileName ? sourceFile : undefined),
-    writeFile: (_, text) => (outputText = text),
+    writeFile: emitCallback,
     getDefaultLibFileName: () => 'lib.d.ts',
     useCaseSensitiveFileNames: () => false,
     getCanonicalFileName: fileName => fileName,
@@ -50,28 +67,27 @@ export function transpileModule(input: string, config?: d.Config, compilerCtx?:
     getDirectories: () => [],
   };
 
-  const program = ts.createProgram([inputFileName], options, compilerHost);
-
-  const typeChecker = program.getTypeChecker();
+  const tsProgram = ts.createProgram([inputFileName], options, compilerHost);
+  const tsTypeChecker = tsProgram.getTypeChecker();
 
   config = config || mockConfig();
   compilerCtx = compilerCtx || mockCompilerCtx();
-  sys = sys || mockStencilSystem();
+  sys = sys || (mockStencilSystem() as any);
 
   const buildCtx = mockBuildCtx(config, compilerCtx);
 
   const transformOpts: d.TransformOptions = {
     coreImportPath: '@stencil/core',
     componentExport: 'lazy',
     componentMetadata: null,
-    styleImport: null,
-    scopeCss: false,
-    style: 'inline',
+    currentDirectory: '/',
+    proxy: null,
+    style: 'static',
   };
 
-  program.emit(undefined, undefined, undefined, undefined, {
-    before: [convertDecoratorsToStatic(config, buildCtx.diagnostics, typeChecker)],
-    after: [convertStaticToMeta(config, compilerCtx, buildCtx, typeChecker, null, transformOpts)],
+  tsProgram.emit(undefined, undefined, undefined, undefined, {
+    before: [convertDecoratorsToStatic(config, buildCtx.diagnostics, tsTypeChecker), ...beforeTransformers],
+    after: [convertStaticToMeta(config, compilerCtx, buildCtx, tsTypeChecker, null, transformOpts), ...afterTransformers],
   });
 
   while (outputText.includes('  ')) {

src/compiler/transformers/update-component-class.ts

@@ -7,20 +7,19 @@ export const updateComponentClass = (
   heritageClauses: ts.HeritageClause[] | ts.NodeArray<ts.HeritageClause>,
   members: ts.ClassElement[],
 ) => {
+  let classModifiers = Array.isArray(classNode.modifiers) ? classNode.modifiers.slice() : [];
+
   if (transformOpts.module === 'cjs') {
     // CommonJS, leave component class as is
-    let classModifiers = Array.isArray(classNode.modifiers) ? classNode.modifiers.slice() : [];
 
     if (transformOpts.componentExport === 'customelement') {
       // remove export from class
       classModifiers = classModifiers.filter(m => {
         return m.kind !== ts.SyntaxKind.ExportKeyword;
       });
     }
-
-    return ts.updateClassDeclaration(classNode, classNode.decorators, classModifiers, classNode.name, classNode.typeParameters, heritageClauses, members);
   }
 
   // ESM with export
-  return classNode;
+  return ts.updateClassDeclaration(classNode, classNode.decorators, classModifiers, classNode.name, classNode.typeParameters, heritageClauses, members);
 };