Bad TS class translation

[pierreduot]

What version of Bun is running?

1.1.12

What platform is your computer?

Linux 5.15.0-107-generic x86_64 x86_64

What steps can reproduce the bug?

Considering following TS code:

abstract class Cparent {
    public parentVal: string;
    constructor() {
        this.parentVal = 'parent';
        this.init();
    }
    init() { }
}

class Achild extends Cparent {
    public childVal!: string;
    constructor() {
        super();
    }
    override init() {
        this.childVal = 'child';
    }
}

const a = new Achild();
console.log(a.parentVal, a.childVal);

What is the expected behavior?

Expected behavior when compiling with TS:

"use strict";
class Cparent {
    constructor() {
        this.parentVal = 'parent';
        this.init();
    }
    init() { }
}
class Achild extends Cparent {
    constructor() {
        super();
    }
    init() {
        this.childVal = 'child';
    }
}
const a = new Achild();
console.log(a.parentVal, a.childVal);

And when running:

"parent",  "child"

What do you see instead?

When building with bun:

// buntest.ts
class Cparent {
  parentVal;
  constructor() {
    this.parentVal = "parent";
    this.init();
  }
  init() {
  }
}

class Achild extends Cparent {
  childVal;
  constructor() {
    super();
  }
  init() {
    this.childVal = "child";
  }
}
var a = new Achild;
console.log(a.parentVal, a.childVal);

When running:

parent undefined

Additional information

No response

[codehz]

I think it is related to useDefineForClassFields in tsconfig.json
which is defaulted to true in ESNext

ref: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#the-usedefineforclassfields-flag-and-the-declare-property-modifier
so the code should be compiled to:

"use strict";
class Cparent {
    parentVal;
    constructor() {
        this.parentVal = 'parent';
        this.init();
    }
    init() { }
}
class Achild extends Cparent {
    childVal;
    constructor() {
        super();
    }
    init() {
        this.childVal = 'child';
    }
}
const a = new Achild();
console.log(a.parentVal, a.childVal);

which will give you "parent", undefined

[pierreduot]

If I set useDefineForClassFields, the result is :

"use strict";
class Cparent {
    constructor() {
        Object.defineProperty(this, "parentVal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
        this.parentVal = 'parent';
        this.init();
    }
    init() { }
}
class Achild extends Cparent {
    constructor() {
        super();
        Object.defineProperty(this, "childVal", {
            enumerable: true,
            configurable: true,
            writable: true,
            value: void 0
        });
    }
    init() {
        this.childVal = 'child';
    }
}
const a = new Achild();
console.log(a.parentVal, a.childVal);

And result is parent, undefined because childVal property is redifined after super().

But I think that the logical behavior should be this result : parent, child.
I'm right or not ?

[codehz]

check this microsoft/TypeScript#33509 it should be considered as correct behavior in spec...
if you don't like it, set useDefineForClassFields to false

[pierreduot]

Thanks for the ref.
I understand the differences in behavior better.
In fact, I think the problem mainly comes from having the parent call the init function implemented in the child.
By writing differently, I would no longer have problems!
I can close the issue ! :-)