Skip to content

Commit b4b0dee

Browse files
feat: removing most polyfilled features due to Firefox support, adding only CustomStateSet to Firefox
1 parent 23b3333 commit b4b0dee

File tree

3 files changed

+23
-16
lines changed

3 files changed

+23
-16
lines changed

Diff for: README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Element Internals Polyfill
22

3-
This package is a polyfill for the [`ElementInternals` standard](https://html.spec.whatwg.org/multipage/custom-elements.html#the-elementinternals-interface). The specification is supported by current releases of Google's Chrome.
3+
This package is a polyfill for the [`ElementInternals` standard](https://html.spec.whatwg.org/multipage/custom-elements.html#the-elementinternals-interface). The specification is supported by current releases of Chromium and Firefox.
44

55
## Use case
66

Diff for: src/CustomStateSet.ts

+3
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ import { ICustomElement } from "./types";
44
const customStateMap = new WeakMap<CustomStateSet, ICustomElement>();
55

66
export class CustomStateSet extends Set<string> {
7+
static get isPolyfilled() {
8+
return true;
9+
}
710
constructor(ref: ICustomElement) {
811
super();
912
if (!ref || !ref.tagName || ref.tagName.indexOf('-') === -1) {

Diff for: src/element-internals.ts

+19-15
Original file line numberDiff line numberDiff line change
@@ -260,10 +260,6 @@ declare global {
260260
}
261261
}
262262

263-
if (!window.CustomStateSet) {
264-
window.CustomStateSet = CustomStateSet;
265-
}
266-
267263
export function isElementInternalsSupported(): boolean {
268264
if (!window.ElementInternals) {
269265
return false;
@@ -281,17 +277,16 @@ export function isElementInternalsSupported(): boolean {
281277
customElements.define(randomName, ElementInternalsFeatureDetection);
282278
const featureDetectionElement = new ElementInternalsFeatureDetection();
283279
return [
284-
"shadowRoot",
285-
"form",
286-
"states",
287-
"willValidate",
288-
"validity",
289-
"validationMessage",
290-
"labels",
291-
"setFormValue",
292-
"setValidity",
293-
"checkValidity",
294-
"reportValidity"
280+
'shadowRoot',
281+
'form',
282+
'willValidate',
283+
'validity',
284+
'validationMessage',
285+
'labels',
286+
'setFormValue',
287+
'setValidity',
288+
'checkValidity',
289+
'reportValidity'
295290
].every(prop => prop in featureDetectionElement.internals);
296291
}
297292

@@ -345,3 +340,12 @@ if (!isElementInternalsSupported()) {
345340
const reportValidity = HTMLFormElement.prototype.reportValidity;
346341
HTMLFormElement.prototype.reportValidity = reportValidityOverride;
347342
}
343+
if (!window.CustomStateSet) {
344+
window.CustomStateSet = CustomStateSet;
345+
const attachInternals = HTMLElement.prototype.attachInternals;
346+
HTMLElement.prototype.attachInternals = function(...args) {
347+
const internals = attachInternals.call(this, args);
348+
internals.states = new CustomStateSet(this);
349+
return internals;
350+
}
351+
}

0 commit comments

Comments
 (0)