Don't insert __self: this within constructors of derived classes (#13552)

* Don't insert `__self: this` prior to `super()` calls (#13550)

`__self: this` is inserted for debugging purposes. However, it will cause a runtime error if it is inserted prior to a `super()` call in a constructor. This commit will prevent `__self: this` from inserted when there is a following `super()` call.

* Prevent adding `__self` within a constructor that has `super()` altogether.

* Fix 2 typos in the comments.

* Add an additional test case for constructors that do not have a `super()` call.

* Detect `super()` call by testing whether the class has a superclass.

* Update method name and corresponding comments

* Add an additional test for the case where the derived class do not have a `super()` call.

* Apply the same changes to babel-plugin-transform-react-jsx
This commit is contained in:
Rin Tepis
2021-07-27 01:32:29 +08:00
committed by GitHub
parent 4a56387330
commit 224a35c5c6
8 changed files with 570 additions and 13 deletions

View File

@@ -0,0 +1,51 @@
class A { }
class B extends A {
constructor() {
<sometag1 />;
super(<sometag2 />);
<sometag3 />;
}
}
class C {
constructor() {
<sometag4 />;
class D extends A {
constructor() {
super();
}
}
const E = class extends A {
constructor() {
super();
}
};
}
}
class E extends A {
constructor() {
this.x = () => <sometag5 />;
this.y = function () {
return <sometag6 />;
};
function z() {
return <sometag7 />;
}
{ <sometag8 /> }
super();
}
}
class F {
constructor() {
<sometag9 />
}
}
class G extends A {
constructor() {
return <sometag10 />;
}
}

View File

@@ -0,0 +1,118 @@
var _reactJsxDevRuntime = require("react/jsx-dev-runtime");
var _jsxFileName = "<CWD>\\packages\\babel-plugin-transform-react-jsx-development\\test\\fixtures\\windows\\within-derived-classes-constructor-windows\\input.js";
class A {}
class B extends A {
constructor() {
/*#__PURE__*/
_reactJsxDevRuntime.jsxDEV("sometag1", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 5,
columnNumber: 5
}, void 0);
super( /*#__PURE__*/_reactJsxDevRuntime.jsxDEV("sometag2", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 6,
columnNumber: 11
}, void 0));
/*#__PURE__*/
_reactJsxDevRuntime.jsxDEV("sometag3", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 7,
columnNumber: 5
}, void 0);
}
}
class C {
constructor() {
/*#__PURE__*/
_reactJsxDevRuntime.jsxDEV("sometag4", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 13,
columnNumber: 5
}, this);
class D extends A {
constructor() {
super();
}
}
const E = class extends A {
constructor() {
super();
}
};
}
}
class E extends A {
constructor() {
this.x = function () {
return /*#__PURE__*/_reactJsxDevRuntime.jsxDEV("sometag5", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 29,
columnNumber: 20
}, void 0);
};
this.y = function () {
return /*#__PURE__*/_reactJsxDevRuntime.jsxDEV("sometag6", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 31,
columnNumber: 14
}, this);
};
function z() {
return /*#__PURE__*/_reactJsxDevRuntime.jsxDEV("sometag7", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 34,
columnNumber: 14
}, this);
}
{
/*#__PURE__*/
_reactJsxDevRuntime.jsxDEV("sometag8", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 36,
columnNumber: 7
}, void 0);
}
super();
}
}
class F {
constructor() {
/*#__PURE__*/
_reactJsxDevRuntime.jsxDEV("sometag9", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 43,
columnNumber: 5
}, this);
}
}
class G extends A {
constructor() {
return /*#__PURE__*/_reactJsxDevRuntime.jsxDEV("sometag10", {}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 12
}, void 0);
}
}