Remove DOM prototype patching of createTextChild(ren)
Bug: chromium:1011811
Change-Id: I44a66c10efd317dcb7d5a4f58ab4be0fded4b215
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2466182
Reviewed-by: Alex Rudenko <[email protected]>
Reviewed-by: Tim van der Lippe <[email protected]>
Commit-Queue: Sigurd Schneider <[email protected]>
diff --git a/front_end/elements/DOMLinkifier.js b/front_end/elements/DOMLinkifier.js
index 6eac286..385f340 100644
--- a/front_end/elements/DOMLinkifier.js
+++ b/front_end/elements/DOMLinkifier.js
@@ -28,7 +28,7 @@
const idElement = parentElement.createChild('span', 'node-label-id');
const part = '#' + idAttribute;
title += part;
- idElement.createTextChild(part);
+ UI.UIUtils.createTextChild(idElement, part);
// Mark the name as extra, since the ID is more important.
nameElement.classList.add('extra');
@@ -45,7 +45,7 @@
if (className && !foundClasses.has(className)) {
const part = '.' + className;
title += part;
- classesElement.createTextChild(part);
+ UI.UIUtils.createTextChild(classesElement, part);
foundClasses.add(className);
}
}
@@ -55,7 +55,7 @@
if (isPseudo) {
const pseudoElement = parentElement.createChild('span', 'extra node-label-pseudo');
const pseudoText = '::' + originalNode.pseudoType();
- pseudoElement.createTextChild(pseudoText);
+ UI.UIUtils.createTextChild(pseudoElement, pseudoText);
title += pseudoText;
}
parentElement.title = tooltipContent || title;
diff --git a/front_end/elements/ElementStatePaneWidget.js b/front_end/elements/ElementStatePaneWidget.js
index fecfac9..6d7e99b 100644
--- a/front_end/elements/ElementStatePaneWidget.js
+++ b/front_end/elements/ElementStatePaneWidget.js
@@ -19,7 +19,7 @@
super(true);
this.registerRequiredCSS('elements/elementStatePaneWidget.css');
this.contentElement.className = 'styles-element-state-pane';
- this.contentElement.createChild('div').createTextChild(Common.UIString.UIString('Force element state'));
+ UI.UIUtils.createTextChild(this.contentElement.createChild('div'), Common.UIString.UIString('Force element state'));
const table = document.createElement('table');
table.classList.add('source-code');
UI.ARIAUtils.markAsPresentation(table);
diff --git a/front_end/elements/ElementsTreeElement.js b/front_end/elements/ElementsTreeElement.js
index 16ea390..ced53b0 100644
--- a/front_end/elements/ElementsTreeElement.js
+++ b/front_end/elements/ElementsTreeElement.js
@@ -516,9 +516,9 @@
}
const nodeName = matchResult[1];
tag.textContent = '';
- tag.createTextChild('<' + nodeName);
+ UI.UIUtils.createTextChild(tag, '<' + nodeName);
tag.appendChild(node);
- tag.createTextChild('>');
+ UI.UIUtils.createTextChild(tag, '>');
}
}
@@ -1548,7 +1548,7 @@
attrNameElement.textContent = name;
if (hasText) {
- attrSpanElement.createTextChild('=\u200B"');
+ UI.UIUtils.createTextChild(attrSpanElement, '=\u200B"');
}
const attrValueElement = attrSpanElement.createChild('span', 'webkit-html-attribute-value');
@@ -1600,7 +1600,7 @@
}
if (hasText) {
- attrSpanElement.createTextChild('"');
+ UI.UIUtils.createTextChild(attrSpanElement, '"');
}
/**
@@ -1620,7 +1620,7 @@
let i = 0;
while (value.length) {
if (i++ > 0) {
- fragment.createTextChild(' ');
+ UI.UIUtils.createTextChild(fragment, ' ');
}
value = value.trim();
// The url and descriptor may end with a separating comma.
@@ -1645,13 +1645,13 @@
// Up to one trailing comma should be removed from `url`.
if (url.endsWith(',')) {
fragment.appendChild(linkifyValue.call(this, url.substring(0, url.length - 1)));
- fragment.createTextChild(',');
+ UI.UIUtils.createTextChild(fragment, ',');
} else {
fragment.appendChild(linkifyValue.call(this, url));
}
}
if (descriptor) {
- fragment.createTextChild(descriptor);
+ UI.UIUtils.createTextChild(fragment, descriptor);
}
value = value.substring(url.length + descriptor.length);
}
@@ -1668,7 +1668,7 @@
_buildPseudoElementDOM(parentElement, pseudoElementName) {
const pseudoElement = parentElement.createChild('span', 'webkit-html-pseudo-element');
pseudoElement.textContent = '::' + pseudoElementName;
- parentElement.createTextChild('\u200B');
+ UI.UIUtils.createTextChild(parentElement, '\u200B');
}
/**
@@ -1685,7 +1685,7 @@
classes.push('close');
}
const tagElement = parentElement.createChild('span', classes.join(' '));
- tagElement.createTextChild('<');
+ UI.UIUtils.createTextChild(tagElement, '<');
const tagNameElement =
tagElement.createChild('span', isClosingTag ? 'webkit-html-close-tag-name' : 'webkit-html-tag-name');
tagNameElement.textContent = (isClosingTag ? '/' : '') + tagName;
@@ -1696,7 +1696,7 @@
const attributes = node.attributes();
for (let i = 0; i < attributes.length; ++i) {
const attr = attributes[i];
- tagElement.createTextChild(' ');
+ UI.UIUtils.createTextChild(tagElement, ' ');
this._buildAttributeDOM(tagElement, attr.name, attr.value, updateRecord, false, node);
}
}
@@ -1709,8 +1709,8 @@
}
}
- tagElement.createTextChild('>');
- parentElement.createTextChild('\u200B');
+ UI.UIUtils.createTextChild(tagElement, '>');
+ UI.UIUtils.createTextChild(parentElement, '\u200B');
}
/**
@@ -1775,7 +1775,7 @@
if (!this.expanded) {
const textNodeElement = titleDOM.createChild('span', 'webkit-html-text-node bogus');
textNodeElement.textContent = '…';
- titleDOM.createTextChild('\u200B');
+ UI.UIUtils.createTextChild(titleDOM, '\u200B');
this._buildTagDOM(titleDOM, tagName, true, false, updateRecord);
}
break;
@@ -1786,7 +1786,7 @@
const result = this._convertWhitespaceToEntities(node.firstChild.nodeValue());
textNodeElement.textContent = result.text;
UI.UIUtils.highlightRangesWithStyleClass(textNodeElement, result.entityRanges, 'webkit-html-entity-value');
- titleDOM.createTextChild('\u200B');
+ UI.UIUtils.createTextChild(titleDOM, '\u200B');
this._buildTagDOM(titleDOM, tagName, true, false, updateRecord);
if (updateRecord && updateRecord.hasChangedChildren()) {
UI.UIUtils.runCSSAnimationOnce(textNodeElement, 'dom-update-highlight');
@@ -1819,12 +1819,12 @@
const cssSyntaxHighlighter = new UI.SyntaxHighlighter.SyntaxHighlighter('text/css', true);
cssSyntaxHighlighter.syntaxHighlightNode(newNode).then(updateSearchHighlight);
} else {
- titleDOM.createTextChild('"');
+ UI.UIUtils.createTextChild(titleDOM, '"');
const textNodeElement = titleDOM.createChild('span', 'webkit-html-text-node');
const result = this._convertWhitespaceToEntities(node.nodeValue());
textNodeElement.textContent = result.text;
UI.UIUtils.highlightRangesWithStyleClass(textNodeElement, result.entityRanges, 'webkit-html-entity-value');
- titleDOM.createTextChild('"');
+ UI.UIUtils.createTextChild(titleDOM, '"');
if (updateRecord && updateRecord.isCharDataModified()) {
UI.UIUtils.runCSSAnimationOnce(textNodeElement, 'dom-update-highlight');
}
@@ -1833,33 +1833,33 @@
case Node.COMMENT_NODE: {
const commentElement = titleDOM.createChild('span', 'webkit-html-comment');
- commentElement.createTextChild('<!--' + node.nodeValue() + '-->');
+ UI.UIUtils.createTextChild(commentElement, '<!--' + node.nodeValue() + '-->');
break;
}
case Node.DOCUMENT_TYPE_NODE: {
const docTypeElement = titleDOM.createChild('span', 'webkit-html-doctype');
- docTypeElement.createTextChild('<!DOCTYPE ' + node.nodeName());
+ UI.UIUtils.createTextChild(docTypeElement, '<!DOCTYPE ' + node.nodeName());
if (node.publicId) {
- docTypeElement.createTextChild(' PUBLIC "' + node.publicId + '"');
+ UI.UIUtils.createTextChild(docTypeElement, ' PUBLIC "' + node.publicId + '"');
if (node.systemId) {
- docTypeElement.createTextChild(' "' + node.systemId + '"');
+ UI.UIUtils.createTextChild(docTypeElement, ' "' + node.systemId + '"');
}
} else if (node.systemId) {
- docTypeElement.createTextChild(' SYSTEM "' + node.systemId + '"');
+ UI.UIUtils.createTextChild(docTypeElement, ' SYSTEM "' + node.systemId + '"');
}
if (node.internalSubset) {
- docTypeElement.createTextChild(' [' + node.internalSubset + ']');
+ UI.UIUtils.createTextChild(docTypeElement, ' [' + node.internalSubset + ']');
}
- docTypeElement.createTextChild('>');
+ UI.UIUtils.createTextChild(docTypeElement, '>');
break;
}
case Node.CDATA_SECTION_NODE: {
const cdataElement = titleDOM.createChild('span', 'webkit-html-text-node');
- cdataElement.createTextChild('<![CDATA[' + node.nodeValue() + ']]>');
+ UI.UIUtils.createTextChild(cdataElement, '<![CDATA[' + node.nodeValue() + ']]>');
break;
}
@@ -1871,7 +1871,7 @@
default: {
const nameWithSpaceCollapsed = Platform.StringUtilities.collapseWhitespace(node.nodeNameInCorrectCase());
- titleDOM.createTextChild(nameWithSpaceCollapsed);
+ UI.UIUtils.createTextChild(titleDOM, nameWithSpaceCollapsed);
}
}
diff --git a/front_end/elements/ElementsTreeOutline.js b/front_end/elements/ElementsTreeOutline.js
index 2eeacaa..adf7144 100644
--- a/front_end/elements/ElementsTreeOutline.js
+++ b/front_end/elements/ElementsTreeOutline.js
@@ -1732,7 +1732,7 @@
title.textContent = '\u21AA ' + text;
const link = linkifyDeferredNodeReference(nodeShortcut.deferredNode);
- this.listItemElement.createTextChild(' ');
+ UI.UIUtils.createTextChild(this.listItemElement, ' ');
link.classList.add('elements-tree-shortcut-link');
link.textContent = Common.UIString.UIString('reveal');
this.listItemElement.appendChild(link);
diff --git a/front_end/elements/MetricsSidebarPane.js b/front_end/elements/MetricsSidebarPane.js
index beeed47..900d1ac 100644
--- a/front_end/elements/MetricsSidebarPane.js
+++ b/front_end/elements/MetricsSidebarPane.js
@@ -312,7 +312,7 @@
'dblclick', this.startEditing.bind(this, heightElement, 'height', 'height', style), false);
boxElement.appendChild(widthElement);
- boxElement.createTextChild(' × ');
+ UI.UIUtils.createTextChild(boxElement, ' × ');
boxElement.appendChild(heightElement);
} else {
const suffix = (name === 'border' ? '-width' : '');
diff --git a/front_end/elements/StylePropertyTreeElement.js b/front_end/elements/StylePropertyTreeElement.js
index 800eb6f..257ca20 100644
--- a/front_end/elements/StylePropertyTreeElement.js
+++ b/front_end/elements/StylePropertyTreeElement.js
@@ -162,7 +162,7 @@
*/
_processVar(text) {
const swatch = InlineEditor.CSSVarSwatch.createCSSVarSwatch();
- swatch.createTextChild(text);
+ UI.UIUtils.createTextChild(swatch, text);
const {computedValue, fromFallback} = this._matchedStyles.computeSingleVariableValue(this._style, text);
swatch.data = {text, computedValue, fromFallback, onLinkClick: this._handleVarDefinitionClick.bind(this)};
@@ -481,8 +481,9 @@
}
const indent = Common.Settings.Settings.instance().moduleSetting('textEditorIndent').get();
- this.listItemElement.createChild('span', 'styles-clipboard-only')
- .createTextChild(indent + (this.property.disabled ? '/* ' : ''));
+ UI.UIUtils.createTextChild(
+ this.listItemElement.createChild('span', 'styles-clipboard-only'),
+ indent + (this.property.disabled ? '/* ' : ''));
this.listItemElement.appendChild(this.nameElement);
const lineBreakValue = this.valueElement.firstElementChild && this.valueElement.firstElementChild.tagName === 'BR';
const separator = lineBreakValue ? ':' : ': ';
@@ -491,9 +492,9 @@
this.listItemElement.appendChild(this._expandElement);
}
this.listItemElement.appendChild(this.valueElement);
- this.listItemElement.createTextChild(';');
+ UI.UIUtils.createTextChild(this.listItemElement, ';');
if (this.property.disabled) {
- this.listItemElement.createChild('span', 'styles-clipboard-only').createTextChild(' */');
+ UI.UIUtils.createTextChild(this.listItemElement.createChild('span', 'styles-clipboard-only'), ' */');
}
if (!this.property.parsedOk) {
diff --git a/front_end/elements/StylesSidebarPane.js b/front_end/elements/StylesSidebarPane.js
index c91bfd5..7d779f5 100644
--- a/front_end/elements/StylesSidebarPane.js
+++ b/front_end/elements/StylesSidebarPane.js
@@ -987,7 +987,7 @@
static async _createInheritedNodeBlock(node) {
const separatorElement = createElement('div');
separatorElement.className = 'sidebar-separator';
- separatorElement.createTextChild(ls`Inherited from${' '}`);
+ UI.UIUtils.createTextChild(separatorElement, ls`Inherited from${' '}`);
const link = await Common.Linkifier.Linkifier.linkify(node, {preventKeyboardFocus: true});
separatorElement.appendChild(link);
return new SectionBlock(separatorElement);
@@ -1716,7 +1716,7 @@
const fragment = createDocumentFragment();
for (let i = 0; i < selectors.length; ++i) {
if (i) {
- fragment.createTextChild(', ');
+ UI.UIUtils.createTextChild(fragment, ', ');
}
fragment.appendChild(this._createSelectorElement(selectors[i], matchingSelectors[i], i));
}
@@ -2798,7 +2798,7 @@
url = url.substring(1, url.length - 1);
}
const container = createDocumentFragment();
- container.createTextChild('url(');
+ UI.UIUtils.createTextChild(container, 'url(');
let hrefUrl = null;
if (this._rule && this._rule.resourceURL()) {
hrefUrl = Common.ParsedURL.ParsedURL.completeURL(this._rule.resourceURL(), url);
@@ -2817,7 +2817,7 @@
}),
hrefUrl || url);
container.appendChild(link);
- container.createTextChild(')');
+ UI.UIUtils.createTextChild(container, ')');
return container;
}
}
