"supper" keyword with Arrow function methods

[dungdm93]

Code

class Base {
    public foo = () => { console.log("Hello world"); }
    // public foo() {     // No error if declare "foo" like this
    //     console.log("Hello world");
    // }
}

class Child extends Base {
    public bar() { super.foo(); };
}

Actual behavior:
ERROR

public bar() { super.foo(); };
                     ~~~                                                                                                                                                                         
src/main.ts(9,26): error TS2340: Only public and protected methods of the base class are accessible via the 'super' keyword.

TypeScript: 2.0.3
OS: Windows 10 x64
Node: 6.3.0

[jesseschalken]

super.foo() is trying to call Base.prototype.foo, which doesn't exist, because public foo = .. is a property, not a method. Methods exist on the prototype chain, properties exist directly on the concrete object.

[DanielRosenwasser]

This is actually per ES spec.

---

From MakeSuperPropertyReference:

If env.HasSuperBinding() is false, throw a ReferenceError exception.

https://tc39.github.io/ecma262/#sec-makesuperpropertyreference

---

From HasSuperBinding:

If envRec.[[ThisBindingStatus]] is "lexical", return false.

https://tc39.github.io/ecma262/2016/#sec-function-environment-records-hassuperbinding

---

From NewFunctionEnvironment:

If F.[[ThisMode]] is lexical, set envRec.[[ThisBindingStatus]] to "lexical".

https://tc39.github.io/ecma262/2016/#sec-newfunctionenvironment

---

From FunctionInitialize:

If kind is Arrow, set F.[[ThisMode]] to lexical.

https://tc39.github.io/ecma262/2016#sec-function-environment-records-hassuperbinding

[nomaed]

I have a similar case but with getter/setter.
Getters and setters are on the prototype chain however.

This works fine when transpiling to ES2015 but not when transpiling to ES5.

Example from the playground:

class Foo {
    private _foobar: string;

    public get foobar(): string {
        return this._foobar;
    }

    public set foobar(value: string) {
        this._foobar = value;
    }
}

class Bar extends Foo {
    constructor() {
        super();
    }

    public set foobar(value: string) {
        super.foobar = `child-${value}`;
    }
}

or when using as a getter

class Bar extends Foo {
    constructor() {
        super();
        console.log(super.foobar);
    }
}