Polyfill Element.innerHTML

Lib-jitsi-meet uses jQuery's .append method to manipulate Jingle. The
method in question invokes the getter and setter of Element.innerHTML.
Unfortunately, xmldom which we use in React Native to polyfill DOM does
not polyfill Element.innerHTML. So polyfill it ourselves.
This commit is contained in:
Lyubomir Marinov 2017-02-15 11:04:10 -06:00
parent 0e2a07f8d7
commit 39483a30b6
1 changed files with 43 additions and 5 deletions

View File

@ -143,13 +143,51 @@ function _visitNode(node, callback) {
const elementPrototype const elementPrototype
= Object.getPrototypeOf(document.documentElement); = Object.getPrototypeOf(document.documentElement);
if (elementPrototype if (elementPrototype) {
&& typeof elementPrototype.querySelector === 'undefined') { if (typeof elementPrototype.querySelector === 'undefined') {
elementPrototype.querySelector = function(selectors) { elementPrototype.querySelector = function(selectors) {
return _querySelector(this, selectors); return _querySelector(this, selectors);
}; };
} }
// Element.innerHTML
//
// Required by:
// - jQuery's .append method
if (!elementPrototype.hasOwnProperty('innerHTML')) {
Object.defineProperty(elementPrototype, 'innerHTML', {
get() {
return this.childNodes.toString();
},
set(innerHTML) {
// MDN says: removes all of element's children, parses
// the content string and assigns the resulting nodes as
// children of the element.
// Remove all of element's children.
this.textContent = '';
// Parse the content string.
const d
= new DOMParser().parseFromString(
`<div>${innerHTML}</div>`,
'text/xml');
// Assign the resulting nodes as children of the
// element.
const documentElement = d.documentElement;
let child;
// eslint-disable-next-line no-cond-assign
while (child = documentElement.firstChild) {
this.appendChild(child);
}
}
});
}
}
// FIXME There is a weird infinite loop related to console.log and // FIXME There is a weird infinite loop related to console.log and
// Document and/or Element at the time of this writing. Work around it // Document and/or Element at the time of this writing. Work around it
// by patching Node and/or overriding console.log. // by patching Node and/or overriding console.log.