TPE DOM/Custom elements

Introduction

This project is to enable web authors to define and use new types of DOM elements in a document.

References:

• Custom Elements spec
• whatwg html wiki
• whatwg dom wiki
• blink-dev intent-to-implement
• Blink bugs
  • https://bugs.chromium.org/p/chromium/issues/detail?id=594918
• Safari bugs
  • https://bugs.webkit.org/show_bug.cgi?id=154907
  • https://bugs.webkit.org/show_bug.cgi?id=150225
  • https://bugs.webkit.org/show_bug.cgi?id=155108

Taipei Main Members

Engineers: Edgar Chen (main contact), John Dai

Meeting Minutes

Sync-up minutes

Roadmap

Summary

We are now at Stage 4, working on performance work, especially on the critical blocker from enabling this feature on Nightly.

• Estimated nightly version: 59
• Firefox dev-platform intent-to-implement

Details

[Stage 1] (completed)

1. Remove support of SVG-based custom element.
   • Bug: 1274505
2. Window interface
   • Separate control preference
   • Move mRegistry from document to window.customElements
   • Bugs: 1275833, 1275832, 1275838, 1275839
3. HTMLElement constructor
   • Support using ES6 classes
   • Construction stack
   • Bug: 1274159
4. Document interface
   • createElement, createElementNS
   • Bug: 1276579
5. window.customElements.define
   • Bug: 1275835

[Stage 2] (completed)

1. custom element upgrade reactions stack/queue
   • Upgrade reaction
2. Algorithm of creating an element
   • Spec: https://dom.spec.whatwg.org/#concept-create-element
   • Revise consumers (createElement[NS] and HTML parser accordingly
     • HTML parser: https://dxr.mozilla.org/mozilla-central/source/parser/html/nsHtml5TreeOperation.cpp#335

[Stage 3] (completed)

1. Callback reaction queue
2. Lifecycle callbacks
   • • sProcessingStack
     • EnqueueLifecycleCallback
   • connectedCallback
   • disconnectedCallback
   • attributeChangedCallback

[Stage 4] (WE'RE HERE)

1. Performance work
2. Enable on Nightly (estimated target 59)

[Stage 5]

1. Ride to train

[Stage 6 - Backlog]

1. Mutation algorithms (Shadow dom)
   • Spec:
     • https://dom.spec.whatwg.org/#mutation-algorithms
     • https://w3c.github.io/webcomponents/spec/custom/#dom-mutation-algorithms
2. CSS :define
3. Performance
4. Web-platform-tests

Project Dashboard

Meta Bugs

<bugzilla>

   {
       "id":["889230"]
   }

</bugzilla>

1st Impl. Shipping Blocker: Performance issues (INPROGRESS)

<bugzilla>

   {
       "blocks":["1396567"],
       "status":["NEW","REOPENED","ASSIGNED","RESOLVED","VERIFIED","CLOSED"],
       "include_fields": "id, summary, status, target_milestone, resolution, assigned_to, depends_on, blocks"
   }

</bugzilla>

Post 1st Ship: Stage_4 Bugs & Progress (BACKLOG)

<bugzilla>

   {
       "blocks":["889230"],
       "whiteboard":["dom-ce-m4"],
       "status":["NEW","REOPENED","ASSIGNED","RESOLVED","VERIFIED","CLOSED"],
       "include_fields": "id, summary, status, target_milestone, resolution, assigned_to, depends_on, blocks"
   }

</bugzilla>

What Have Been DONE

1st Impl. Shipping Blocker: Stage_1 Bugs & Progress (DONE)

<bugzilla>

   {
       "blocks":["889230"],
       "whiteboard":["dom-ce-m1"],
       "status":["NEW","REOPENED","ASSIGNED","RESOLVED","VERIFIED","CLOSED"],
       "include_fields": "id, summary, status, target_milestone, resolution, assigned_to, depends_on, blocks"
   }

</bugzilla>

1st Impl. Shipping Blocker: Stage_2 Bugs & Progress (IN PROGRESS)

<bugzilla>

   {
       "blocks":["889230"],
       "whiteboard":["dom-ce-m2"],
       "status":["NEW","REOPENED","ASSIGNED","RESOLVED","VERIFIED","CLOSED"],
       "include_fields": "id, summary, status, target_milestone, resolution, assigned_to, depends_on, blocks"
   }

</bugzilla>

1st Impl. Shipping Blocker: Stage_3 Bugs & Progress (DONE)

<bugzilla>

   {
       "blocks":["889230"],
       "whiteboard":["dom-ce-m3"],
       "status":["NEW","REOPENED","ASSIGNED","RESOLVED","VERIFIED","CLOSED"],
       "include_fields": "id, summary, status, target_milestone, resolution, assigned_to, depends_on, blocks"
   }

</bugzilla>