mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-23 09:16:38 +00:00
Inject element polyfills where used using Babel (#20689)
This commit is contained in:
parent
7748315fc3
commit
97206ee8fe
@ -18,6 +18,39 @@ const PolyfillSupport = {
|
|||||||
safari: 17.4,
|
safari: 17.4,
|
||||||
samsung: 15.0,
|
samsung: 15.0,
|
||||||
},
|
},
|
||||||
|
"element-append": {
|
||||||
|
android: 54,
|
||||||
|
chrome: 54,
|
||||||
|
edge: 17,
|
||||||
|
firefox: 49,
|
||||||
|
ios: 10.0,
|
||||||
|
opera: 41,
|
||||||
|
opera_mobile: 41,
|
||||||
|
safari: 10.0,
|
||||||
|
samsung: 6.0,
|
||||||
|
},
|
||||||
|
"element-getattributenames": {
|
||||||
|
android: 61,
|
||||||
|
chrome: 61,
|
||||||
|
edge: 18,
|
||||||
|
firefox: 45,
|
||||||
|
ios: 10.3,
|
||||||
|
opera: 48,
|
||||||
|
opera_mobile: 45,
|
||||||
|
safari: 10.1,
|
||||||
|
samsung: 8.0,
|
||||||
|
},
|
||||||
|
"element-toggleattribute": {
|
||||||
|
android: 69,
|
||||||
|
chrome: 69,
|
||||||
|
edge: 18,
|
||||||
|
firefox: 63,
|
||||||
|
ios: 12.0,
|
||||||
|
opera: 56,
|
||||||
|
opera_mobile: 48,
|
||||||
|
safari: 12.0,
|
||||||
|
samsung: 10.0,
|
||||||
|
},
|
||||||
fetch: {
|
fetch: {
|
||||||
android: 42,
|
android: 42,
|
||||||
chrome: 42,
|
chrome: 42,
|
||||||
@ -94,6 +127,12 @@ const polyfillMap = {
|
|||||||
key: "element-internals",
|
key: "element-internals",
|
||||||
module: "element-internals-polyfill",
|
module: "element-internals-polyfill",
|
||||||
},
|
},
|
||||||
|
...Object.fromEntries(
|
||||||
|
["append", "getAttributeNames", "toggleAttribute"].map((prop) => {
|
||||||
|
const key = `element-${prop.toLowerCase()}`;
|
||||||
|
return [prop, { key, module: join(POLYFILL_DIR, `${key}.ts`) }];
|
||||||
|
})
|
||||||
|
),
|
||||||
},
|
},
|
||||||
static: {
|
static: {
|
||||||
Intl: {
|
Intl: {
|
||||||
@ -127,7 +166,7 @@ export default defineProvider(
|
|||||||
({ createMetaResolver, debug, shouldInjectPolyfill }) => {
|
({ createMetaResolver, debug, shouldInjectPolyfill }) => {
|
||||||
const resolvePolyfill = createMetaResolver(polyfillMap);
|
const resolvePolyfill = createMetaResolver(polyfillMap);
|
||||||
return {
|
return {
|
||||||
name: "HA Custom",
|
name: "custom-polyfill",
|
||||||
polyfills: PolyfillSupport,
|
polyfills: PolyfillSupport,
|
||||||
usageGlobal(meta, utils) {
|
usageGlobal(meta, utils) {
|
||||||
const polyfill = resolvePolyfill(meta);
|
const polyfill = resolvePolyfill(meta);
|
||||||
|
@ -1,65 +1,2 @@
|
|||||||
// Caution before editing - For latest builds, this module is replaced with emptiness and thus not imported (see build-scripts/bundle.js)
|
// Caution before editing - For latest builds, this module is replaced with emptiness and thus not imported (see build-scripts/bundle.js)
|
||||||
import "lit/polyfill-support";
|
import "lit/polyfill-support";
|
||||||
|
|
||||||
// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/append()/append().md
|
|
||||||
(function (arr) {
|
|
||||||
arr.forEach((item) => {
|
|
||||||
if (Object.prototype.hasOwnProperty.call(item, "append")) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
Object.defineProperty(item, "append", {
|
|
||||||
configurable: true,
|
|
||||||
enumerable: true,
|
|
||||||
writable: true,
|
|
||||||
value: function append(...argArr) {
|
|
||||||
const docFrag = document.createDocumentFragment();
|
|
||||||
|
|
||||||
argArr.forEach((argItem) => {
|
|
||||||
const isNode = argItem instanceof Node;
|
|
||||||
docFrag.appendChild(
|
|
||||||
isNode ? argItem : document.createTextNode(String(argItem))
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
this.appendChild(docFrag);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
|
||||||
})([Element.prototype, Document.prototype, DocumentFragment.prototype]);
|
|
||||||
|
|
||||||
// Source: https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttributeNames
|
|
||||||
if (Element.prototype.getAttributeNames === undefined) {
|
|
||||||
Element.prototype.getAttributeNames = function () {
|
|
||||||
const attributes = this.attributes;
|
|
||||||
const length = attributes.length;
|
|
||||||
const result = new Array(length);
|
|
||||||
for (let i = 0; i < length; i++) {
|
|
||||||
result[i] = attributes[i].name;
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
// Source: https://gist.github.com/rebelchris/365f26f95d7e9f432f64f21886d9b9ef
|
|
||||||
if (!Element.prototype.toggleAttribute) {
|
|
||||||
Element.prototype.toggleAttribute = function (name, force) {
|
|
||||||
if (force !== undefined) {
|
|
||||||
force = !!force;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.hasAttribute(name)) {
|
|
||||||
if (force) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.removeAttribute(name);
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
if (force === false) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setAttribute(name, "");
|
|
||||||
return true;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
25
src/resources/polyfills/element-append.ts
Normal file
25
src/resources/polyfills/element-append.ts
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
// Source: https://github.com/jserz/js_piece/blob/master/DOM/ParentNode/append()/append().md
|
||||||
|
(function (arr) {
|
||||||
|
arr.forEach((item) => {
|
||||||
|
if (Object.prototype.hasOwnProperty.call(item, "append")) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
Object.defineProperty(item, "append", {
|
||||||
|
configurable: true,
|
||||||
|
enumerable: true,
|
||||||
|
writable: true,
|
||||||
|
value: function append(...argArr) {
|
||||||
|
const docFrag = document.createDocumentFragment();
|
||||||
|
|
||||||
|
argArr.forEach((argItem) => {
|
||||||
|
const isNode = argItem instanceof Node;
|
||||||
|
docFrag.appendChild(
|
||||||
|
isNode ? argItem : document.createTextNode(String(argItem))
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
this.appendChild(docFrag);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})([Element.prototype, Document.prototype, DocumentFragment.prototype]);
|
12
src/resources/polyfills/element-getattributenames.ts
Normal file
12
src/resources/polyfills/element-getattributenames.ts
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
// Source: https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttributeNames
|
||||||
|
if (Element.prototype.getAttributeNames === undefined) {
|
||||||
|
Element.prototype.getAttributeNames = function () {
|
||||||
|
const attributes = this.attributes;
|
||||||
|
const length = attributes.length;
|
||||||
|
const result = new Array(length);
|
||||||
|
for (let i = 0; i < length; i++) {
|
||||||
|
result[i] = attributes[i].name;
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
};
|
||||||
|
}
|
23
src/resources/polyfills/element-toggleattribute.ts
Normal file
23
src/resources/polyfills/element-toggleattribute.ts
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
// Source: https://gist.github.com/rebelchris/365f26f95d7e9f432f64f21886d9b9ef
|
||||||
|
if (!Element.prototype.toggleAttribute) {
|
||||||
|
Element.prototype.toggleAttribute = function (name, force) {
|
||||||
|
if (force !== undefined) {
|
||||||
|
force = !!force;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.hasAttribute(name)) {
|
||||||
|
if (force) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.removeAttribute(name);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (force === false) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setAttribute(name, "");
|
||||||
|
return true;
|
||||||
|
};
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user