-
Notifications
You must be signed in to change notification settings - Fork 116
question about document-register-element/test/ #115
Comments
this polyfill is for Custom Elements only. IE11 has no Shadow DOM so this test is skipped: |
Ah, I see. So if I had looked more carefully (my bad!), I would have noticed that on IE11 the test ouput whereas on Chrome the test ouput I didn't notice that the parenthetical numbers had a leading So inspecting more carefully, I also see
So that's why I see 89 tests pass on IE11. Is there an example of your very nice V1 polyfill running on IE11? Am I forced to use babel to compile ES6 classes into ES5? Or is there a simpler example to look at? |
are you targeting IE11 ? If so, how are you expecting to do so without transpiling classes? |
Anyway, these are transpiled Custom Elements behind HyperHTMLElement class and it works on IE11 too |
I figured I'd just start with whatever code the transpiler outputs. I'm just trying to learn how all this works on IE11. Ultimately we'd use Babel and classes, I guess. |
If so, you need this to make it happen or it will break because Babel has broken classes once transpiled. Welcome to transpilers hell 🎉 |
Yeah, I was hoping to look at an output so I could put off learning about transpiler hell. There are a lot of new concepts all at once for me, and our customer base has entrenched IE11, so I can't simply ignore it and jump in with both feet into the world of ES6 classes. I will study your hyperHTML-Element example, thank you very much for providing it! |
The output is produced by Babel, the transpiler ...
Nope, you have to test in there too. All I'm saying is that this polyfill works for IE11 (actuallyl even IE9) and Google AMP Project uses this polyfill too. Also StencilJS uses this polyfill too. It's the most battle-tested/compatible out there
You can if you know how to do that. You need Babel with preset ES2015 and also the transpiler plugin I've mentioned already, here again: https://github.com/WebReflection/babel-plugin-transform-builtin-classes |
P.S. there is a ready to use configuration in here: |
I may be missing something, or simply more ignorant or lazy than you are realizing, but isn't there some already transpiled output JS for a simple V1 CustomElement I could look at? My hope was to make a tiny IE11 test.html that included your scripts in the head, and also included this hoped-for simple-element.js, so I could look at what happens to the source code with |
And that is the output you are asking for. It's generated through Babel. Nobody writes that manually. |
I get that about writing it manually -- yikes! I was assuming I would bury all that boilerplate in a library. The introduction of "hyperHTML" has confused me somewhat, though. What is that? Is it a helper concept you've created? How does it relate to creating a simple V1 custom element, and then transpiling that element to IE11 ES5? |
On Chrome Version 60.0.3112.113 (Official Build) (64-bit) (running on Windows 10), the test returns
Passed 91 Tests
and then 40 result divs, each with class="pass".
On IE11, the same test
returns
Passed 89 Tests
and also, seemingly, the same 40 results divs.
This led to my question(s):
What are the 2 tests that didn't pass on IE11? Is there some way to get the test to show me? Finally, is this an expected difference?
The text was updated successfully, but these errors were encountered: