Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

A new version of the custom elements has been released at some point in the past (not sure when, as I haven't directly used the spec for awhile). Is there any polyfill or environment that implements the new custom elements specification?

Reason I am asking is that I will be giving a talk on Friday about the web components specs and it will hardly do to give a talk without a demonstrations, but from what I can see all browsers and polyfills still implement the old spec. Looking at web archive I can see that the new spec has been around for at least a few months, so I would expect it to be implemented at least somewhere.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
225 views
Welcome To Ask or Share your Answers For Others

1 Answer

2020 Update: now it runs in Chrome, Opera and Edge (Blink), Firefox (Gecko), and partially on Safari (WebKit).

Otherwise you can use a polyfill from WebReflection for IE11 / Firefox / Chrome.

Presentation of what has changed here.


The Custom Elements v1 Specification is available since Chrome v53. It's a native implementation.

Note: You have to run it with a flag to activate the feature:

> chrome --enable-blink-features=CustomElementsV1

You can add the flag in your shortcut if you want.

PS: I recommend to use the last build (Canary) because the implementation is being updated on a regular basis.


Running Example :

class CEv1 extends HTMLElement 
{
  constructor () 
  {
    super()
    console.log( "created this=", this )            
  }
  
  connectedCallback ()
  {
    this.innerHTML = "Hello V1!"
  }
} 
customElements.define( "test-v1", CEv1 )
<test-v1>Feature not activated</test-v1>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...