Error on class fields accesses through super in JS files

src/compiler/utilitiesPublic.ts

@@ -102,7 +102,9 @@ import {
  isArrowFunction,
  isAssignmentExpression,
  isBinaryExpression,
+ isBindableStaticAccessExpression,
  isBindableStaticElementAccessExpression,
+ isBindableStaticNameExpression,
  isBindingElement,
  isBlock,
  isCallExpression,
@@ -111,6 +113,7 @@ import {
  isClassStaticBlockDeclaration,
  isDecorator,
  isElementAccessExpression,
+ isExpandoPropertyDeclaration,
  isExportAssignment,
  isExportDeclaration,
  isExportSpecifier,
@@ -153,6 +156,7 @@ import {
  isPropertyAccessExpression,
  isPropertyAssignment,
  isPropertyDeclaration,
+ isPrototypeAccess,
  isRootedDiskPath,
  isSourceFile,
  isStringLiteral,
@@ -1705,7 +1709,10 @@ export function isAutoAccessorPropertyDeclaration(node: Node): node is AutoAcces
 }
 
 /** @internal */
-export function isClassFieldAndNotAutoAccessor(node: Node): boolean {
+export function isClassFieldAndNotAutoAccessor(node: Declaration): boolean {
+ if (isInJSFile(node) && isExpandoPropertyDeclaration(node)) {
+ return (!isBindableStaticAccessExpression(node) || !isPrototypeAccess(node.expression)) && !isBindableStaticNameExpression(node, /*excludeThisKeyword*/ true);
+ }
  return node.parent && isClassLike(node.parent) && isPropertyDeclaration(node) && !hasAccessorModifier(node);
 }
 

tests/baselines/reference/classFieldSuperAccessible.js

@@ -16,6 +16,15 @@ class C extends Array {
  console.log(super.length);
  }
 }
+
+class D {
+ accessor b = () => {}
+}
+class E extends D {
+ foo() {
+ super.b()
+ }
+}
 
 
 //// [classFieldSuperAccessible.js]
@@ -35,3 +44,11 @@ class C extends Array {
  console.log(super.length);
  }
 }
+class D {
+ accessor b = () => { };
+}
+class E extends D {
+ foo() {
+ super.b();
+ }
+}

tests/baselines/reference/classFieldSuperAccessible.symbols

@@ -46,3 +46,23 @@ class C extends Array {
  }
 }
 
+class D {
+>D : Symbol(D, Decl(classFieldSuperAccessible.ts, 14, 1))
+
+ accessor b = () => {}
+>b : Symbol(D.b, Decl(classFieldSuperAccessible.ts, 16, 9))
+}
+class E extends D {
+>E : Symbol(E, Decl(classFieldSuperAccessible.ts, 18, 1))
+>D : Symbol(D, Decl(classFieldSuperAccessible.ts, 14, 1))
+
+ foo() {
+>foo : Symbol(E.foo, Decl(classFieldSuperAccessible.ts, 19, 19))
+
+ super.b()
+>super.b : Symbol(D.b, Decl(classFieldSuperAccessible.ts, 16, 9))
+>super : Symbol(D, Decl(classFieldSuperAccessible.ts, 14, 1))
+>b : Symbol(D.b, Decl(classFieldSuperAccessible.ts, 16, 9))
+ }
+}
+

tests/baselines/reference/classFieldSuperAccessible.types

@@ -50,3 +50,25 @@ class C extends Array {
  }
 }
 
+class D {
+>D : D
+
+ accessor b = () => {}
+>b : () => void
+>() => {} : () => void
+}
+class E extends D {
+>E : E
+>D : D
+
+ foo() {
+>foo : () => void
+
+ super.b()
+>super.b() : void
+>super.b : () => void
+>super : D
+>b : () => void
+ }
+}
+

tests/baselines/reference/classFieldSuperAccessibleJs1.errors.txt

@@ -0,0 +1,18 @@
+index.js(9,23): error TS2565: Property 'blah2' is used before being assigned.
+
+
+==== index.js (1 errors) ====
+ class C {
+ static blah1 = 123;
+ }
+ C.blah2 = 456;
+
+ class D extends C {
+ static {
+ console.log(super.blah1);
+ console.log(super.blah2);
+ ~~~~~
+!!! error TS2565: Property 'blah2' is used before being assigned.
+ }
+ }
+

tests/baselines/reference/classFieldSuperAccessibleJs1.symbols

@@ -0,0 +1,37 @@
+//// [tests/cases/compiler/classFieldSuperAccessibleJs1.ts] ////
+
+=== index.js ===
+class C {
+>C : Symbol(C, Decl(index.js, 0, 0), Decl(index.js, 2, 1))
+
+ static blah1 = 123;
+>blah1 : Symbol(C.blah1, Decl(index.js, 0, 9))
+}
+C.blah2 = 456;
+>C.blah2 : Symbol(C.blah2, Decl(index.js, 2, 1))
+>C : Symbol(C, Decl(index.js, 0, 0), Decl(index.js, 2, 1))
+>blah2 : Symbol(C.blah2, Decl(index.js, 2, 1))
+
+class D extends C {
+>D : Symbol(D, Decl(index.js, 3, 14))
+>C : Symbol(C, Decl(index.js, 0, 0), Decl(index.js, 2, 1))
+
+ static {
+ console.log(super.blah1);
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>super.blah1 : Symbol(C.blah1, Decl(index.js, 0, 9))
+>super : Symbol(C, Decl(index.js, 0, 0), Decl(index.js, 2, 1))
+>blah1 : Symbol(C.blah1, Decl(index.js, 0, 9))
+
+ console.log(super.blah2);
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>super.blah2 : Symbol(C.blah2, Decl(index.js, 2, 1))
+>super : Symbol(C, Decl(index.js, 0, 0), Decl(index.js, 2, 1))
+>blah2 : Symbol(C.blah2, Decl(index.js, 2, 1))
+ }
+}
+

tests/baselines/reference/classFieldSuperAccessibleJs1.types

@@ -0,0 +1,42 @@
+//// [tests/cases/compiler/classFieldSuperAccessibleJs1.ts] ////
+
+=== index.js ===
+class C {
+>C : C
+
+ static blah1 = 123;
+>blah1 : number
+>123 : 123
+}
+C.blah2 = 456;
+>C.blah2 = 456 : 456
+>C.blah2 : number
+>C : typeof C
+>blah2 : number
+>456 : 456
+
+class D extends C {
+>D : D
+>C : C
+
+ static {
+ console.log(super.blah1);
+>console.log(super.blah1) : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>super.blah1 : number
+>super : typeof C
+>blah1 : number
+
+ console.log(super.blah2);
+>console.log(super.blah2) : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>super.blah2 : number
+>super : typeof C
+>blah2 : number
+ }
+}
+

tests/baselines/reference/classFieldSuperAccessibleJs2.symbols

@@ -0,0 +1,77 @@
+//// [tests/cases/compiler/classFieldSuperAccessibleJs2.ts] ////
+
+=== index.js ===
+class C {
+>C : Symbol(C, Decl(index.js, 0, 0))
+
+ constructor() {
+ this.foo = () => {
+>this.foo : Symbol(C.foo, Decl(index.js, 5, 3))
+>this : Symbol(C, Decl(index.js, 0, 0))
+>foo : Symbol(C.foo, Decl(index.js, 1, 17))
+
+ console.log("called arrow");
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+
+ };
+ }
+ foo() {
+>foo : Symbol(C.foo, Decl(index.js, 5, 3))
+
+ console.log("called method");
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+ }
+}
+
+class D extends C {
+>D : Symbol(D, Decl(index.js, 9, 1))
+>C : Symbol(C, Decl(index.js, 0, 0))
+
+ foo() {
+>foo : Symbol(D.foo, Decl(index.js, 11, 19))
+
+ console.log("SUPER:");
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+
+ super.foo();
+>super.foo : Symbol(C.foo, Decl(index.js, 5, 3))
+>super : Symbol(C, Decl(index.js, 0, 0))
+>foo : Symbol(C.foo, Decl(index.js, 5, 3))
+
+ console.log("THIS:");
+>console.log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+>console : Symbol(console, Decl(lib.dom.d.ts, --, --))
+>log : Symbol(Console.log, Decl(lib.dom.d.ts, --, --))
+
+ this.foo();
+>this.foo : Symbol(D.foo, Decl(index.js, 11, 19))
+>this : Symbol(D, Decl(index.js, 9, 1))
+>foo : Symbol(D.foo, Decl(index.js, 11, 19))
+ }
+}
+
+const obj = new D();
+>obj : Symbol(obj, Decl(index.js, 20, 5))
+>D : Symbol(D, Decl(index.js, 9, 1))
+
+obj.foo();
+>obj.foo : Symbol(D.foo, Decl(index.js, 11, 19))
+>obj : Symbol(obj, Decl(index.js, 20, 5))
+>foo : Symbol(D.foo, Decl(index.js, 11, 19))
+
+D.prototype.foo.call(obj);
+>D.prototype.foo.call : Symbol(CallableFunction.call, Decl(lib.es5.d.ts, --, --))
+>D.prototype.foo : Symbol(D.foo, Decl(index.js, 11, 19))
+>D.prototype : Symbol(D.prototype)
+>D : Symbol(D, Decl(index.js, 9, 1))
+>prototype : Symbol(D.prototype)
+>foo : Symbol(D.foo, Decl(index.js, 11, 19))
+>call : Symbol(CallableFunction.call, Decl(lib.es5.d.ts, --, --))
+>obj : Symbol(obj, Decl(index.js, 20, 5))
+

tests/baselines/reference/classFieldSuperAccessibleJs2.types

@@ -0,0 +1,92 @@
+//// [tests/cases/compiler/classFieldSuperAccessibleJs2.ts] ////
+
+=== index.js ===
+class C {
+>C : C
+
+ constructor() {
+ this.foo = () => {
+>this.foo = () => { console.log("called arrow"); } : () => void
+>this.foo : () => void
+>this : this
+>foo : () => void
+>() => { console.log("called arrow"); } : () => void
+
+ console.log("called arrow");
+>console.log("called arrow") : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>"called arrow" : "called arrow"
+
+ };
+ }
+ foo() {
+>foo : () => void
+
+ console.log("called method");
+>console.log("called method") : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>"called method" : "called method"
+ }
+}
+
+class D extends C {
+>D : D
+>C : C
+
+ foo() {
+>foo : () => void
+
+ console.log("SUPER:");
+>console.log("SUPER:") : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>"SUPER:" : "SUPER:"
+
+ super.foo();
+>super.foo() : void
+>super.foo : () => void
+>super : C
+>foo : () => void
+
+ console.log("THIS:");
+>console.log("THIS:") : void
+>console.log : (...data: any[]) => void
+>console : Console
+>log : (...data: any[]) => void
+>"THIS:" : "THIS:"
+
+ this.foo();
+>this.foo() : void
+>this.foo : () => void
+>this : this
+>foo : () => void
+ }
+}
+
+const obj = new D();
+>obj : D
+>new D() : D
+>D : typeof D
+
+obj.foo();
+>obj.foo() : void
+>obj.foo : () => void
+>obj : D
+>foo : () => void
+
+D.prototype.foo.call(obj);
+>D.prototype.foo.call(obj) : void
+>D.prototype.foo.call : <T, A extends any[], R>(this: (this: T, ...args: A) => R, thisArg: T, ...args: A) => R
+>D.prototype.foo : () => void
+>D.prototype : D
+>D : typeof D
+>prototype : D
+>foo : () => void
+>call : <T, A extends any[], R>(this: (this: T, ...args: A) => R, thisArg: T, ...args: A) => R
+>obj : D
+