Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Dec 10, 2025

When JSX appears in class fields with setPublicClassFields: true, the class properties transform moves the JSX into a constructor. The this parameter was being omitted from jsxDEV calls in these constructors when a superclass exists.

Changes

  • Removed can_add_self_attribute check for automatic dev mode - In automatic mode, this is passed as a function argument to jsxDEV(), not accessed as a property. Safe even before super().
  • Kept check for classic mode - Classic mode adds __self: this to props object, which requires the check to avoid "this before super" errors.
  • Added test coverage - Classes with and without superclass.

Example

Input:

export class Foo extends Object { foo = <div/> }

Before (incorrect):

this.foo = jsxDEV("div", {}, void 0, false, {
  fileName: _jsxFileName,
  lineNumber: 1,
  columnNumber: 42
});

After (correct):

this.foo = jsxDEV("div", {}, void 0, false, {
  fileName: _jsxFileName,
  lineNumber: 1,
  columnNumber: 42
}, this);

Matches esbuild, SWC, TypeScript, and Babel behavior.

Original prompt

This section details on the original issue you should resolve

<issue_title>transformer: JSX in class field is missing this param for dev automatic transform when assumptions.setPublicClassFields: true</issue_title>
<issue_description>```jsx
export class Foo1 extends Object { foo =

}

is transformed to
```js
var _jsxFileName = "foo.tsx";
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
export class Foo1 extends Object {
        constructor(..._args) {
                super(..._args);
                this.foo = /* @__PURE__ */ _jsxDEV("div", {}, void 0, false, {
                        fileName: _jsxFileName,
                        lineNumber: 2,
                        columnNumber: 42
                });
        }
        foo;
}

but this should be

var _jsxFileName = "foo.tsx";
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
export class Foo1 extends Object {
        constructor(..._args) {
                super(..._args);
                this.foo = /* @__PURE__ */ _jsxDEV("div", {}, void 0, false, {
                        fileName: _jsxFileName,
                        lineNumber: 2,
                        columnNumber: 42
                }, this);
        }
        foo;
}

(stackblitz).

esbuild (esbuild try), SWC (playground), TypeScript (playground) all generates this.</issue_description>

Comments on the Issue (you are @copilot in this section)


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Copilot AI and others added 3 commits December 10, 2025 01:45
Remove can_add_self_attribute check for automatic dev mode. In automatic dev mode, `this` is passed as an argument to jsxDEV which is safe even in constructors before super(), unlike classic mode where it's added to props.

Co-authored-by: Dunqing <[email protected]>
Copilot AI changed the title [WIP] Fix JSX transformation in class field for public class fields fix(transformer): add this param to jsxDEV in automatic dev mode for class fields Dec 10, 2025
Copilot AI requested a review from Dunqing December 10, 2025 01:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

transformer: JSX in class field is missing this param for dev automatic transform when assumptions.setPublicClassFields: true

2 participants