fix(compiler): ensure event emitters defined before user statements

ionic-team · Jun 30, 2020 · 1b52d43 · 1b52d43
1 parent 2ba24b1
commit 1b52d43
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 2 deletions.
diff --git a/src/compiler/transformers/component-lazy/lazy-constructor.ts b/src/compiler/transformers/component-lazy/lazy-constructor.ts
@@ -14,8 +14,8 @@ export const updateLazyComponentConstructor = (classMembers: ts.ClassElement[],
 
     const body = ts.updateBlock(cstrMethod.body, [
       registerInstanceStatement(moduleFile),
-      ...cstrMethod.body.statements,
       ...addCreateEvents(moduleFile, cmp),
+      ...cstrMethod.body.statements,
       ...addLegacyProps(moduleFile, cmp),
     ]);
 

diff --git a/src/compiler/transformers/component-native/native-constructor.ts b/src/compiler/transformers/component-native/native-constructor.ts
@@ -14,7 +14,7 @@ export const updateNativeConstructor = (classMembers: ts.ClassElement[], moduleF
     // add to the existing constructor()
     const cstrMethod = classMembers[cstrMethodIndex] as ts.ConstructorDeclaration;
 
-    let statements: ts.Statement[] = [...nativeInit(moduleFile, cmp), ...cstrMethod.body.statements, ...addCreateEvents(moduleFile, cmp), ...addLegacyProps(moduleFile, cmp)];
+    let statements: ts.Statement[] = [...nativeInit(moduleFile, cmp), ...addCreateEvents(moduleFile, cmp), ...cstrMethod.body.statements, ...addLegacyProps(moduleFile, cmp)];
 
     if (ensureSuper) {
       const hasSuper = cstrMethod.body.statements.some(s => s.kind === ts.SyntaxKind.SuperKeyword);

diff --git a/src/runtime/test/event.spec.tsx b/src/runtime/test/event.spec.tsx
@@ -58,6 +58,25 @@ describe('event', () => {
     `);
   });
 
+  it('should set Event in constructor before users constructor statements', async () => {
+    @Component({ tag: 'cmp-a' })
+    class CmpA {
+      constructor() {
+        this.style.emit();
+      }
+      @Event() style: EventEmitter;
+    }
+
+    const { root } = await newSpecPage({
+      components: [CmpA],
+      html: `<cmp-a></cmp-a>`,
+    });
+
+    expect(root).toEqualHtml(`
+      <cmp-a></cmp-a>
+    `);
+  });
+
   it('should have custom name', async () => {
     @Component({ tag: 'cmp-a' })
     class CmpA {