Servo Custom Element Proposal
- Name: Connor Brewster
- Github: cbrewster
- IRC (mozilla): cbrewster
There are two kinds of custom elements:
- Autonomous custom elements
- Extends HTMLElement
- Does not build on top of functionality from other HTML elements
- Customized built-in elements
- Extends the functionality of existing HTML elements
- Custom Element Registry
- .define(..) Defines custom elements
- .get(..) Returns the constructor for defined custom elements
- .whenDefined(..) Returns a promise that will be fulfilled when a custom element with the specified name is defined
- Custom Element Creation
- The HTML parser and JS document should be able to create custom elements (both autonomous and customized built-in elements).
- Custom Element Reactions
- Specified callbacks should be called when reactions are triggered (attribute mutation, connected/disconnected, document adoption, and upgrades)
- CEReactions WebIDL extended attribute
- When an operation/attribute is decorated with this extended attribute, codegen should generate code to watch for any reactions that should be triggered on custom elements after the operation has completed.
- The implementation should be tested by the existing WPT tests located in tests/wpt/web-platform-tests/custom-elements. All tests in that directory should be passing after this project except any tests that use other non-implemented features in servo (outside of the custom element specification).
WHATWG Specification: https://html.spec.whatwg.org/multipage/#custom-elements
I have split the project into a few smaller pieces. I will implement custom elements incrementally. I plan on placing the implementation behind a custom element preference flag at least until custom elements are fully implemented and all the relevant tests are passing.
Custom Element Registry
The custom element registry is in charge of managing the available custom elements in a window. Each window has its own registry. The registry does the following things:
- Allows new custom element definitions to be registered
- Retrieve the constructor for any custom element
- Retrieve a promise for a custom element name that will be fulfilled when a custom element of that name has been registered
Validation of new custom element definitions using jsapi functions.
Custom Element Creation
Once the registry is in place, the element creation process can check the registry to see if a custom element definition exists for the given element name. If no custom element is defined, but the name is a valid custom element name, a HTMLElement is created rather than a HTMLUnknownElement.
Creating the custom element from the constructor in the registry using jsapi functions.
Custom Element Reactions
Custom element reactions are a collection of callbacks that are called when certain events happen from running author code. These events include:
- When the element is connected
- When the element is disconnected
- When the element is adopted into a new document
- When any of the elements attributes are mutated
Possible Complications: Upgrades seem to be the most complex reaction to deal with, so I have moved it to its own section.
Custom Element Upgrades
If an element was created with a valid custom element name when no custom element with that name was defined it should create a HTMLElement. If a custom element is later defined with that name, the already existing elements should upgraded.
CEReactions WebIDL extended attribute
This is a new WebIDL extended attribute that marks any operation that could trigger any custom element reactions. This requires adding the attribute to the WebIDL parser and checking to see if any reactions should be triggered after the operation is completed.
I have not worked with the WebIDL parser before, so I will have to spend some time familiarizing myself with the code. This will also require going through each interface in the specification and adding [CEReactions] where needed.
Schedule of Deliverables
May 4 - May 27 (3 Weeks): Study specification in more detail and begin initial implementations.
May 28 - June 3 (1 Week): Implement the custom element registry
June 4 - June 17 (2 Weeks): Make element creation aware of the custom element registry
June 18 - July 11 (3.5 Weeks): Implement custom element reactions
July 12 - July 15 (0.5 Weeks): Implement WebIDL CEReactions extended attribute
July 16 - August 12 (2 Weeks + Vacation): Implement custom element upgrades
August 13 - August 29 (> 2 Weeks): Handle any unforeseen complications or issues and tidy up any loose ends.
Open Source Development Experience
I have been involved in open source development for almost a year as an active contributor of the Servo project. I mainly work on the constellation and browser history related issues. Outside of Servo I have landed some commits on rustfmt. Open source development has allowed me to work on larger larger projects, learn how a workflow works on large projects such as Rust and Servo, and sharpen my skills as a software developer. I plan to keep giving back and to stay involved in the open source community going forward.
I have experience working as a student IT at my previous high school for 2 years and have done various contracting jobs in areas ranging from iOS apps to websites. This last year I was contracted to develop iOS and android apps for an on-campus startup at my university.
I am a Computer Engineering major and Computer Science minor undergrad at Oklahoma Christian University. I am finishing my freshman year; however, I am currently a senior in standing. The majority if my programming knowledge is self-taught through working on my own personal projects.
I have been contributing to Servo for almost a year with experience working with the script and constellation components. I believe I am capable of undertaking this task from my prior experience and would love to spend more time working on Servo over the summer.
Mozilla creates an open and welcoming community. I agree with Mozilla’s values in the web space and would like to continue to help the effort to maintain an open web.
Mozilla supports projects like Rust and Servo which I believe will be playing important roles in the future. I would like to continue helping in the effort to push these new technologies forward.