Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

✨ Launch minimal-wrapper native CEv1 #26360

Merged
merged 3 commits into from
Jan 23, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 1 addition & 8 deletions build-system/global-configs/experiments-config.json
Original file line number Diff line number Diff line change
@@ -1,12 +1,5 @@
{
"experimentA": {},
"experimentB": {},
"experimentC": {
"name": "Native Custom Elements V1",
"environment": "AMP",
"command": "gulp dist --defineExperimentConstant=NATIVE_CUSTOM_ELEMENTS_V1",
"issue": "https://github.com/ampproject/amphtml/issues/17243",
"expirationDateUTC": "2020-01-01",
"defineExperimentConstant": "NATIVE_CUSTOM_ELEMENTS_V1"
}
"experimentC": {}
}
5 changes: 1 addition & 4 deletions src/friendly-iframe-embed.js
Original file line number Diff line number Diff line change
Expand Up @@ -866,10 +866,7 @@ function installPolyfillsInChildWindow(parentWin, childWin) {
installDOMTokenList(childWin);
// The anonymous class parameter allows us to detect native classes vs
// transpiled classes.
installCustomElements(
childWin,
NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
);
installCustomElements(childWin, class {});
}

/**
Expand Down
2 changes: 1 addition & 1 deletion src/polyfills.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ if (self.document) {
installGetBoundingClientRect(self);
// The anonymous class parameter allows us to detect native classes vs
// transpiled classes.
installCustomElements(self, NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined);
installCustomElements(self, class {});
}

// TODO(#18268, erwinm): For whatever reason imports to modules that have no
Expand Down
15 changes: 8 additions & 7 deletions src/polyfills/custom-elements.js
Original file line number Diff line number Diff line change
Expand Up @@ -937,9 +937,9 @@ export function copyProperties(obj, prototype) {
* done.
*
* @param {!Window} win
* @param {!Function=} opt_ctor
* @param {!Function} ctor
*/
export function install(win, opt_ctor) {
export function install(win, ctor) {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not just remove ctor parameter?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because we still need to detect if we're in ESM (real classes) or ES5 (transpiled classes).

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can be inlined in install() which would make the API a bit cleaner (optional).

// Don't install in no-DOM environments e.g. worker.
const shouldInstall = win.document;
const hasCE = hasCustomElements(win);
Expand All @@ -950,23 +950,24 @@ export function install(win, opt_ctor) {
let install = true;
let installWrapper = false;

if (opt_ctor && hasCE) {
if (ctor && hasCE) {
// If ctor is constructable without new, it's a function. That means it was
// compiled down, and we need to do the minimal polyfill because all you
// cannot extend HTMLElement without native classes.
try {
const {Reflect} = win;

// "Construct" ctor using ES5 idioms
const instance = /** @type {!Function} */ (Object.create(
opt_ctor.prototype
));
// I'm not sure why, but Closure will complain at the
// `Function.call.call()` below unless we cast to a Function instance
// here.
const instance = /** @type {!Function} */ (Object.create(ctor.prototype));
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is this the right type?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not really sure, but closure doesn't like the Function.call.call() below without it.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe add a comment?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.


// This will throw an error unless we're in a transpiled environemnt.
// Native classes must be called as `new Ctor`, not `Ctor.call(instance)`.
// We use `Function.call.call` because Closure is too smart for regular
// `Ctor.call`.
Function.call.call(opt_ctor, instance);
Function.call.call(ctor, instance);

// If that didn't throw, we're transpiled.
// Let's find out if we can wrap HTMLElement and avoid a full patch.
Expand Down
5 changes: 1 addition & 4 deletions testing/describes.js
Original file line number Diff line number Diff line change
Expand Up @@ -648,10 +648,7 @@ class RealWinFixture {
} else {
// The anonymous class parameter allows us to detect native classes
// vs transpiled classes.
installCustomElements(
win,
NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
);
installCustomElements(win, class {});

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We always transpile our testing code right? Did we try running our test suite against the native CE code path?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if the ESM builds ran with this RTV experiment enabled. @erwinmombay?

}

// Intercept event listeners
Expand Down
5 changes: 1 addition & 4 deletions testing/iframe.js
Original file line number Diff line number Diff line change
Expand Up @@ -245,10 +245,7 @@ export function createIframePromise(opt_runtimeOff, opt_beforeLayoutCallback) {
installRuntimeServices(iframe.contentWindow);
// The anonymous class parameter allows us to detect native classes vs
// transpiled classes.
installCustomElements(
iframe.contentWindow,
NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
);
installCustomElements(iframe.contentWindow, class {});
installAmpdocServices(ampdoc);
Services.resourcesForDoc(ampdoc).ampInitComplete();
// Act like no other elements were loaded by default.
Expand Down