babel: [Bug]: subclassing seems broken in older Chrome
💻
- Would you like to work on a fix?
How are you using Babel?
babel-loader (webpack)
Input code
(function (cb) {
class Foo extends HTMLElement {
connectedCallback() {
this._baz = 'hello';
}
baz() {
return this._baz;
}
}
class Fooz extends Foo {
connectedCallback() {
super.connectedCallback();
this._baz = this._baz + ' world';
}
}
customElements.define('web-test-fooz', Fooz);
document.body.appendChild(new Fooz());
var fooz = document.getElementsByTagName('web-test-fooz')[0];
cb(fooz.baz() === 'hello world');
})(callback);
Configuration file name
No response
Configuration
https://github.com/mrhenry/web-tests/blob/main/webpack-core-web.config.js#L166-L217
use: {
loader: 'babel-loader',
options: {
comments: false,
presets: [
[
'@babel/preset-env',
{
corejs: '^3.6.3',
bugfixes: true,
targets: {
browsers: [
"IE >= 8",
"Opera >= 12",
"Safari >= 5.1",
"Chrome >= 15",
"Edge >= 12",
"Firefox >= 4"
]
},
useBuiltIns: 'usage',
exclude: [
"web.dom-collections.iterator",
"web.dom-collections.for-each"
]
}
]
]
}
}
Current and expected behavior
Current :
Uncaught TypeError: Cannot call a class as a function
In function _classCallCheck
Expected subclasses to work.
Environment
Started occurring after upgrading @babel/core
from 7.16.0 to 7.16.5
Possible solution
No response
Additional context
Test results page : https://mrhenry.github.io/web-tests/#53d613d8-773c-43d5-800b-a78aeeab8ef7
Results for chrome <=36 dropped below 1.0
indicating that the test is now failing.
The only change between tests passing and tests failing is this commit : https://github.com/mrhenry/web-tests/commit/16599fd5bd5716d24c63d9dbed57ca63408796c9
(build outputs are included in git)
Test source code : https://github.com/mrhenry/web-tests/blob/main/specifications/whatwg/html/4.13.4.customElements.define.super/test.pure.js
Git blame for the affected build output :
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Reactions: 2
- Comments: 35 (21 by maintainers)
Commits related to this issue
- [Fix] `Object.defineProperty`: Chrome <= 36 has a broken dP when setting "prototype" while changing writability See https://github.com/babel/babel/issues/14056#issuecomment-998938396 — committed to es-shims/es5-shim by ljharb 3 years ago
- [Fix] `Object.defineProperty`: when shimmed in Chrome <= 36, properly handle writability See https://github.com/babel/babel/issues/14056#issuecomment-999017731 — committed to es-shims/es5-shim by ljharb 3 years ago
- add a fix of a V8 ~ Chrome 36- `Object.defineProperty` bug https://bugs.chromium.org/p/v8/issues/detail?id=3334 https://github.com/babel/babel/issues/14056 — committed to zloirock/core-js by zloirock 3 years ago
@nicolo-ribaudo the fix is in es5-shim v4.6.3.
@ljharb are you sure that the current descriptor is writable and you will be able properly check it (for example https://bugs.chromium.org/p/v8/issues/detail?id=1570)?
Yes, since
Object.defineProperty
is an ES5 feature.Looks promising, haven’t spotted negative delta’s (no new failures)
Running now with these changes : https://github.com/mrhenry/web-tests/pull/263/files
this will take a while
Thanks! I figured out how to test old chrome, I’ll work on this later today.
Uncaught TypeError: Cannot redefine property: prototype
My change based on your comment :
https://github.com/mrhenry/web-tests/pull/260/files
It might be caused by https://github.com/babel/babel/pull/12115