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/accessibility/AccessibilityNodeView.js b/front_end/accessibility/AccessibilityNodeView.js
index 8f07591..26e7c2c 100644
--- a/front_end/accessibility/AccessibilityNodeView.js
+++ b/front_end/accessibility/AccessibilityNodeView.js
@@ -477,10 +477,10 @@
if (this._source.attributeValue) {
this.appendValueElement(this._source.attributeValue);
- this.listItemElement.createTextChild('\xA0');
+ UI.UIUtils.createTextChild(this.listItemElement, '\xA0');
} else if (this._source.nativeSourceValue) {
this.appendValueElement(this._source.nativeSourceValue);
- this.listItemElement.createTextChild('\xA0');
+ UI.UIUtils.createTextChild(this.listItemElement, '\xA0');
if (this._source.value) {
this.appendValueElement(this._source.value);
}
@@ -569,7 +569,7 @@
} else if (this._idref) {
element.classList.add('invalid');
const valueElement = AXNodePropertyTreeElement.createExclamationMark(ls`No node with this ID.`);
- valueElement.createTextChild(this._idref);
+ UI.UIUtils.createTextChild(valueElement, this._idref);
element.appendChild(valueElement);
}
diff --git a/front_end/animation/AnimationTimeline.js b/front_end/animation/AnimationTimeline.js
index 7765c4d..45b2914 100644
--- a/front_end/animation/AnimationTimeline.js
+++ b/front_end/animation/AnimationTimeline.js
@@ -838,7 +838,7 @@
*/
nodeResolved(node) {
if (!node) {
- this._description.createTextChild('<node>');
+ UI.UIUtils.createTextChild(this._description, '<node>');
return;
}
this._node = node;
diff --git a/front_end/color_picker/ContrastDetails.js b/front_end/color_picker/ContrastDetails.js
index a4051eb..e820f09 100644
--- a/front_end/color_picker/ContrastDetails.js
+++ b/front_end/color_picker/ContrastDetails.js
@@ -58,7 +58,7 @@
const contrastValueRow = this._element.createChild('div');
contrastValueRow.addEventListener('click', this._topRowClicked.bind(this));
const contrastValueRowContents = contrastValueRow.createChild('div', 'container');
- contrastValueRowContents.createTextChild(Common.UIString.UIString('Contrast ratio'));
+ UI.UIUtils.createTextChild(contrastValueRowContents, Common.UIString.UIString('Contrast ratio'));
this._contrastValueBubble = contrastValueRowContents.createChild('span', 'contrast-details-value');
this._contrastValue = this._contrastValueBubble.createChild('span');
diff --git a/front_end/components/Linkifier.js b/front_end/components/Linkifier.js
index 28b1da3..88f6d14 100644
--- a/front_end/components/Linkifier.js
+++ b/front_end/components/Linkifier.js
@@ -695,9 +695,9 @@
const hashSplit = TextUtils.TextUtils.Utils.splitStringByRegexes(string, [/[a-f0-9]{20,}/g]);
for (const match of hashSplit) {
if (match.regexIndex === -1) {
- link.createTextChild(match.value);
+ UI.UIUtils.createTextChild(link, match.value);
} else {
- link.createTextChild(match.value.substring(0, 7));
+ UI.UIUtils.createTextChild(link, match.value.substring(0, 7));
Linkifier._appendHiddenText(link, match.value.substring(7));
}
}
@@ -708,7 +708,7 @@
* @param {string} string
*/
static _appendHiddenText(link, string) {
- const ellipsisNode = link.createChild('span', 'devtools-link-ellipsis').createTextChild('…');
+ const ellipsisNode = UI.UIUtils.createTextChild(link.createChild('span', 'devtools-link-ellipsis'), '…');
textByAnchor.set(ellipsisNode, string);
}
diff --git a/front_end/console/ConsoleContextSelector.js b/front_end/console/ConsoleContextSelector.js
index 5011c7e..ddf7764 100644
--- a/front_end/console/ConsoleContextSelector.js
+++ b/front_end/console/ConsoleContextSelector.js
@@ -241,9 +241,9 @@
const element = document.createElement('div');
const shadowRoot = UI.Utils.createShadowRootWithCoreStyles(element, 'console/consoleContextSelector.css');
const title = shadowRoot.createChild('div', 'title');
- title.createTextChild(this.titleFor(item).trimEndWithMaxLength(100));
+ UI.UIUtils.createTextChild(title, this.titleFor(item).trimEndWithMaxLength(100));
const subTitle = shadowRoot.createChild('div', 'subtitle');
- subTitle.createTextChild(this._subtitleFor(item));
+ UI.UIUtils.createTextChild(subTitle, this._subtitleFor(item));
element.style.paddingLeft = (8 + this._depthFor(item) * 15) + 'px';
return element;
}
diff --git a/front_end/console/ConsolePinPane.js b/front_end/console/ConsolePinPane.js
index a7915b5..fb0cf71 100644
--- a/front_end/console/ConsolePinPane.js
+++ b/front_end/console/ConsolePinPane.js
@@ -338,7 +338,7 @@
} else if (previewText) {
this._pinPreview.appendChild(preview);
} else if (!isEditing) {
- this._pinPreview.createTextChild(ls`not available`);
+ UI.UIUtils.createTextChild(this._pinPreview, ls`not available`);
}
this._pinPreview.title = previewText;
}
diff --git a/front_end/console/ConsoleViewMessage.js b/front_end/console/ConsoleViewMessage.js
index 914f848..b131e58 100644
--- a/front_end/console/ConsoleViewMessage.js
+++ b/front_end/console/ConsoleViewMessage.js
@@ -314,20 +314,20 @@
}
const messageElement = /** @type {!HTMLElement} */ (document.createElement('span'));
if (this._message.level === SDK.ConsoleModel.MessageLevel.Error) {
- messageElement.createTextChild(request.requestMethod + ' ');
+ UI.UIUtils.createTextChild(messageElement, request.requestMethod + ' ');
const linkElement = Components.Linkifier.Linkifier.linkifyRevealable(request, request.url(), request.url());
// Focus is handled by the viewport.
linkElement.tabIndex = -1;
this._selectableChildren.push({element: linkElement, forceSelect: () => linkElement.focus()});
messageElement.appendChild(linkElement);
if (request.failed) {
- messageElement.createTextChildren(' ', request.localizedFailDescription || '');
+ UI.UIUtils.createTextChildren(messageElement, ' ', request.localizedFailDescription || '');
}
if (request.statusCode !== 0) {
- messageElement.createTextChildren(' ', String(request.statusCode));
+ UI.UIUtils.createTextChildren(messageElement, ' ', String(request.statusCode));
}
if (request.statusText) {
- messageElement.createTextChildren(' (', request.statusText, ')');
+ UI.UIUtils.createTextChildren(messageElement, ' (', request.statusText, ')');
}
} else {
const messageText = this._message.messageText;
@@ -372,7 +372,7 @@
const anchorWrapperElement = /** @type {!HTMLElement} */ (document.createElement('span'));
anchorWrapperElement.classList.add('console-message-anchor');
anchorWrapperElement.appendChild(anchorElement);
- anchorWrapperElement.createTextChild(' ');
+ UI.UIUtils.createTextChild(anchorWrapperElement, ' ');
return anchorWrapperElement;
}
return null;
@@ -525,7 +525,7 @@
/** @type {string} **/ (parameters[0].description), parameters.slice(1), formattedResult);
parameters = result.unusedSubstitutions;
if (parameters.length) {
- formattedResult.createTextChild(' ');
+ UI.UIUtils.createTextChild(formattedResult, ' ');
}
}
@@ -538,7 +538,7 @@
formattedResult.appendChild(this._formatParameter(parameters[i], false, true));
}
if (i < parameters.length - 1) {
- formattedResult.createTextChild(' ');
+ UI.UIUtils.createTextChild(formattedResult, ' ');
}
}
return formattedResult;
@@ -618,7 +618,7 @@
document.createElement('span'), description, Console.ConsoleViewMessage._LongStringVisibleLength);
result.appendChild(propertyValue.element);
} else {
- result.createTextChild(description);
+ UI.UIUtils.createTextChild(result, description);
}
if (obj.objectId) {
result.addEventListener('contextmenu', this._contextMenuEventFired.bind(this, obj), false);
@@ -642,7 +642,7 @@
ObjectUI.ObjectPropertiesSection.ObjectPropertiesSection.formatObjectAsFunction(obj, functionElement, false);
titleElement.classList.add('object-value-function');
} else {
- titleElement.createTextChild(obj.description || '');
+ UI.UIUtils.createTextChild(titleElement, obj.description || '');
}
if (!obj.hasChildren || obj.customPreview()) {
diff --git a/front_end/dom_extension/DOMExtension.js b/front_end/dom_extension/DOMExtension.js
index b639d7a..5522229 100644
--- a/front_end/dom_extension/DOMExtension.js
+++ b/front_end/dom_extension/DOMExtension.js
@@ -428,29 +428,6 @@
DocumentFragment.prototype.createChild = Element.prototype.createChild;
/**
- * @param {string} text
- * @return {!Text}
- */
-Element.prototype.createTextChild = function(text) {
- const element = this.ownerDocument.createTextNode(text);
- this.appendChild(element);
- return element;
-};
-
-DocumentFragment.prototype.createTextChild = Element.prototype.createTextChild;
-
-/**
- * @param {...string} var_args
- */
-Element.prototype.createTextChildren = function(var_args) {
- for (let i = 0, n = arguments.length; i < n; ++i) {
- this.createTextChild(arguments[i]);
- }
-};
-
-DocumentFragment.prototype.createTextChildren = Element.prototype.createTextChildren;
-
-/**
* @return {number}
*/
Element.prototype.totalOffsetLeft = function() {
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;
}
}
diff --git a/front_end/emulation/DevicesSettingsTab.js b/front_end/emulation/DevicesSettingsTab.js
index e8e3ce6..9b45616 100644
--- a/front_end/emulation/DevicesSettingsTab.js
+++ b/front_end/emulation/DevicesSettingsTab.js
@@ -23,7 +23,7 @@
this.registerRequiredCSS('emulation/devicesSettingsTab.css');
const header = this.element.createChild('header');
- header.createChild('h1').createTextChild(ls`Emulated Devices`);
+ UI.UIUtils.createTextChild(header.createChild('h1'), ls`Emulated Devices`);
this.containerElement = this.element.createChild('div', 'settings-container-wrapper')
.createChild('div', 'settings-tab settings-content settings-container');
diff --git a/front_end/layer_viewer/LayerDetailsView.js b/front_end/layer_viewer/LayerDetailsView.js
index 2216e60..725f7a2 100644
--- a/front_end/layer_viewer/LayerDetailsView.js
+++ b/front_end/layer_viewer/LayerDetailsView.js
@@ -160,7 +160,7 @@
*/
_createScrollRectElement(scrollRect, index) {
if (index) {
- this._scrollRectsCell.createTextChild(', ');
+ UI.UIUtils.createTextChild(this._scrollRectsCell, ', ');
}
const element = this._scrollRectsCell.createChild('span', 'scroll-rect');
if (this._selection && /** @type {!ScrollRectSelection} */ (this._selection).scrollRectIndex === index) {
@@ -196,7 +196,7 @@
return;
}
- this._stickyPositionConstraintCell.createTextChild(', ');
+ UI.UIUtils.createTextChild(this._stickyPositionConstraintCell, ', ');
const child = this._stickyPositionConstraintCell.createChild('span');
child.textContent = this._formatStickyAncestorLayer(title, layer);
}
@@ -215,7 +215,7 @@
stickyBoxRectElement.textContent = Common.UIString.UIString(
'Sticky Box %d × %d (at %d, %d)', stickyBoxRect.width, stickyBoxRect.height, stickyBoxRect.x, stickyBoxRect.y);
- this._stickyPositionConstraintCell.createTextChild(', ');
+ UI.UIUtils.createTextChild(this._stickyPositionConstraintCell, ', ');
const containingBlockRect = constraint.containingBlockRect();
const containingBlockRectElement = this._stickyPositionConstraintCell.createChild('span');
diff --git a/front_end/layer_viewer/LayerTreeOutline.js b/front_end/layer_viewer/LayerTreeOutline.js
index 1ebbb86..4359d6b 100644
--- a/front_end/layer_viewer/LayerTreeOutline.js
+++ b/front_end/layer_viewer/LayerTreeOutline.js
@@ -264,7 +264,7 @@
_update() {
const node = this._layer.nodeForSelfOrAncestor();
const title = createDocumentFragment();
- title.createTextChild(node ? node.simpleSelector() : '#' + this._layer.id());
+ UI.UIUtils.createTextChild(title, node ? node.simpleSelector() : '#' + this._layer.id());
const details = title.createChild('span', 'dimmed');
details.textContent = Common.UIString.UIString(' (%d × %d)', this._layer.width(), this._layer.height());
this.title = title;
diff --git a/front_end/layer_viewer/Layers3DView.js b/front_end/layer_viewer/Layers3DView.js
index cc3b262..8af9e65 100644
--- a/front_end/layer_viewer/Layers3DView.js
+++ b/front_end/layer_viewer/Layers3DView.js
@@ -53,7 +53,8 @@
this.contentElement.classList.add('layers-3d-view');
this._failBanner = new UI.Widget.VBox();
this._failBanner.element.classList.add('full-widget-dimmed-banner');
- this._failBanner.element.createTextChild(Common.UIString.UIString('Layer information is not yet available.'));
+ UI.UIUtils.createTextChild(
+ this._failBanner.element, Common.UIString.UIString('Layer information is not yet available.'));
this._layerViewHost = layerViewHost;
this._layerViewHost.registerView(this);
diff --git a/front_end/layer_viewer/PaintProfilerView.js b/front_end/layer_viewer/PaintProfilerView.js
index f7b1f46..761b4bf 100644
--- a/front_end/layer_viewer/PaintProfilerView.js
+++ b/front_end/layer_viewer/PaintProfilerView.js
@@ -550,7 +550,7 @@
_update() {
const title = createDocumentFragment();
- title.createTextChild(this._logItem.method + '(' + this._paramsToString(this._logItem.params) + ')');
+ UI.UIUtils.createTextChild(title, this._logItem.method + '(' + this._paramsToString(this._logItem.params) + ')');
this.title = title;
}
}
diff --git a/front_end/legacy/legacy-defs.d.ts b/front_end/legacy/legacy-defs.d.ts
index 866292e..bffabc3 100644
--- a/front_end/legacy/legacy-defs.d.ts
+++ b/front_end/legacy/legacy-defs.d.ts
@@ -124,7 +124,6 @@
interface Element {
boxInWindow(targetWindow?: Window): AnchorBox;
createChild(tagName: string, className?: string, content?: string): Element;
- createTextChild(text: string): Text;
hasFocus(): boolean;
positionAt(x: (number|undefined), y: (number|undefined), relativeTo?: Element): void;
removeChildren(): void;
@@ -135,7 +134,6 @@
interface DocumentFragment {
createChild(tagName: string, className?: string, content?: string): Element;
- createTextChild(text: string): Text;
}
interface Event {
diff --git a/front_end/lighthouse/LighthouseStatusView.js b/front_end/lighthouse/LighthouseStatusView.js
index 205da1b..120754a 100644
--- a/front_end/lighthouse/LighthouseStatusView.js
+++ b/front_end/lighthouse/LighthouseStatusView.js
@@ -253,11 +253,12 @@
this._progressBar.classList.add('errored');
this._commitTextChange('');
- this._statusText.createChild('p').createTextChild(Common.UIString.UIString('Ah, sorry! We ran into an error.'));
+ UI.UIUtils.createTextChild(
+ this._statusText.createChild('p'), Common.UIString.UIString('Ah, sorry! We ran into an error.'));
if (KnownBugPatterns.some(pattern => pattern.test(err.message))) {
const message = Common.UIString.UIString(
'Try to navigate to the URL in a fresh Chrome profile without any other tabs or extensions open and try again.');
- this._statusText.createChild('p').createTextChild(message);
+ UI.UIUtils.createTextChild(this._statusText.createChild('p'), message);
} else {
this._renderBugReportBody(err, this._inspectedURL);
}
@@ -296,9 +297,10 @@
Stack Trace: ${err.stack}
\`\`\`
`;
- this._statusText.createChild('p').createTextChild(
+ UI.UIUtils.createTextChild(
+ this._statusText.createChild('p'),
ls`If this issue is reproducible, please report it at the Lighthouse GitHub repo.`);
- this._statusText.createChild('code', 'monospace').createTextChild(issueBody.trim());
+ UI.UIUtils.createTextChild(this._statusText.createChild('code', 'monospace'), issueBody.trim());
}
}
diff --git a/front_end/media/EventDisplayTable.js b/front_end/media/EventDisplayTable.js
index 572fc97..8453cea 100644
--- a/front_end/media/EventDisplayTable.js
+++ b/front_end/media/EventDisplayTable.js
@@ -55,7 +55,7 @@
this._expandableElement.show(enclosed);
} else {
cell.classList.add('event-display-table-basic-text-table-entry');
- cell.createTextChild(cellData);
+ UI.UIUtils.createTextChild(cell, cellData);
}
return cell;
}
diff --git a/front_end/media/PlayerMessagesView.js b/front_end/media/PlayerMessagesView.js
index 0b2b285..2ac4b04 100644
--- a/front_end/media/PlayerMessagesView.js
+++ b/front_end/media/PlayerMessagesView.js
@@ -131,7 +131,7 @@
elementForItem.firstChild.remove();
}
if (elementForItem && key & this._bitFieldValue) {
- elementForItem.createChild('div').createTextChild('✓');
+ UI.UIUtils.createTextChild(elementForItem.createChild('div'), '✓');
} else {
this._hiddenLevels.push(item.stringValue);
}
@@ -181,7 +181,7 @@
const checkBox =
/** @type {!HTMLElement} */ (container.createChild('div', 'media-messages-level-dropdown-checkbox'));
const text = container.createChild('span', 'media-messages-level-dropdown-text');
- text.createTextChild(item.title);
+ UI.UIUtils.createTextChild(text, item.title);
this.elementsForItems.set(item, checkBox);
this._itemMap.set(item.value, item);
this._updateCheckMarks();
@@ -323,6 +323,6 @@
addMessage(message) {
const container =
this._bodyPanel.createChild('div', 'media-messages-message-container media-message-' + message.level);
- container.createTextChild(message.message);
+ UI.UIUtils.createTextChild(container, message.message);
}
}
diff --git a/front_end/media/PlayerPropertiesView.js b/front_end/media/PlayerPropertiesView.js
index 78ee610..4dbe9b9 100644
--- a/front_end/media/PlayerPropertiesView.js
+++ b/front_end/media/PlayerPropertiesView.js
@@ -43,7 +43,7 @@
this.contentElement.classList.add('media-property-renderer');
this._title = this.contentElement.createChild('span', 'media-property-renderer-title');
this._contents = this.contentElement.createChild('span', 'media-property-renderer-contents');
- this._title.createTextChild(title);
+ UI.UIUtils.createTextChild(this._title, title);
this._title = title;
this._value = null;
this._pseudo_color_protection_element = null;
diff --git a/front_end/network/EventSourceMessagesView.js b/front_end/network/EventSourceMessagesView.js
index 773c796..77ef7e0 100644
--- a/front_end/network/EventSourceMessagesView.js
+++ b/front_end/network/EventSourceMessagesView.js
@@ -113,7 +113,7 @@
const timeText = ('0' + time.getHours()).substr(-2) + ':' + ('0' + time.getMinutes()).substr(-2) + ':' +
('0' + time.getSeconds()).substr(-2) + '.' + ('00' + time.getMilliseconds()).substr(-3);
const timeNode = document.createElement('div');
- timeNode.createTextChild(timeText);
+ UI.UIUtils.createTextChild(timeNode, timeText);
timeNode.title = time.toLocaleString();
super({id: message.eventId, type: message.eventName, data: message.data, time: timeNode});
this._message = message;
diff --git a/front_end/network/NetworkDataGridNode.js b/front_end/network/NetworkDataGridNode.js
index b015134..46c7e3d 100644
--- a/front_end/network/NetworkDataGridNode.js
+++ b/front_end/network/NetworkDataGridNode.js
@@ -943,7 +943,7 @@
* @param {string} text
*/
_setTextAndTitle(element, text) {
- element.createTextChild(text);
+ UI.UIUtils.createTextChild(element, text);
element.title = text;
}
@@ -954,7 +954,7 @@
* @param {function():void} handler
*/
_setTextAndTitleAndLink(element, cellText, linkText, handler) {
- element.createTextChild(cellText);
+ UI.UIUtils.createTextChild(element, cellText);
element.createChild('span', 'separator-in-cell');
const link = document.createElement('span');
link.classList.add('devtools-link');
@@ -1144,11 +1144,11 @@
if (columnId === 'name') {
const name = this._request.name().trimMiddle(100);
const networkManager = SDK.NetworkManager.NetworkManager.forRequest(this._request);
- cell.createTextChild(networkManager ? networkManager.target().decorateLabel(name) : name);
+ UI.UIUtils.createTextChild(cell, networkManager ? networkManager.target().decorateLabel(name) : name);
this._appendSubtitle(cell, this._request.path());
cell.title = this._request.url();
} else if (text) {
- cell.createTextChild(text);
+ UI.UIUtils.createTextChild(cell, text);
cell.title = text;
}
}
@@ -1163,14 +1163,14 @@
if (this._request.failed && !this._request.canceled && !this._request.wasBlocked()) {
const failText = Common.UIString.UIString('(failed)');
if (this._request.localizedFailDescription) {
- cell.createTextChild(failText);
+ UI.UIUtils.createTextChild(cell, failText);
this._appendSubtitle(cell, this._request.localizedFailDescription, true);
cell.title = failText + ' ' + this._request.localizedFailDescription;
} else {
this._setTextAndTitle(cell, failText);
}
} else if (this._request.statusCode) {
- cell.createTextChild('' + this._request.statusCode);
+ UI.UIUtils.createTextChild(cell, '' + this._request.statusCode);
this._appendSubtitle(cell, this._request.statusText);
cell.title = this._request.statusCode + ' ' + this._request.statusText;
} else if (this._request.parsedURL.isDataURL()) {
@@ -1331,28 +1331,28 @@
const resourceSize = Platform.NumberUtilities.bytesToString(this._request.resourceSize);
if (this._request.cachedInMemory()) {
- cell.createTextChild(ls`(memory cache)`);
+ UI.UIUtils.createTextChild(cell, ls`(memory cache)`);
cell.title = ls`Served from memory cache, resource size: ${resourceSize}`;
cell.classList.add('network-dim-cell');
} else if (this._request.fetchedViaServiceWorker) {
- cell.createTextChild(ls`(ServiceWorker)`);
+ UI.UIUtils.createTextChild(cell, ls`(ServiceWorker)`);
cell.title = ls`Served from ServiceWorker, resource size: ${resourceSize}`;
cell.classList.add('network-dim-cell');
} else if (this._request.redirectSourceSignedExchangeInfoHasNoErrors()) {
- cell.createTextChild(ls`(signed-exchange)`);
+ UI.UIUtils.createTextChild(cell, ls`(signed-exchange)`);
cell.title = ls`Served from Signed HTTP Exchange, resource size: ${resourceSize}`;
cell.classList.add('network-dim-cell');
} else if (this._request.fromPrefetchCache()) {
- cell.createTextChild(ls`(prefetch cache)`);
+ UI.UIUtils.createTextChild(cell, ls`(prefetch cache)`);
cell.title = ls`Served from prefetch cache, resource size: ${resourceSize}`;
cell.classList.add('network-dim-cell');
} else if (this._request.cached()) {
- cell.createTextChild(ls`(disk cache)`);
+ UI.UIUtils.createTextChild(cell, ls`(disk cache)`);
cell.title = ls`Served from disk cache, resource size: ${resourceSize}`;
cell.classList.add('network-dim-cell');
} else {
const transferSize = Platform.NumberUtilities.bytesToString(this._request.transferSize);
- cell.createTextChild(transferSize);
+ UI.UIUtils.createTextChild(cell, transferSize);
cell.title = `${transferSize} transferred over network, resource size: ${resourceSize}`;
}
this._appendSubtitle(cell, resourceSize);
diff --git a/front_end/network/NetworkFrameGrouper.js b/front_end/network/NetworkFrameGrouper.js
index 9a2f166..00de907 100644
--- a/front_end/network/NetworkFrameGrouper.js
+++ b/front_end/network/NetworkFrameGrouper.js
@@ -79,7 +79,7 @@
if (columnIndex === 0) {
const name = this.displayName();
cell.appendChild(UI.Icon.Icon.create('largeicon-navigator-frame', 'network-frame-group-icon'));
- cell.createTextChild(name);
+ UI.UIUtils.createTextChild(cell, name);
cell.title = name;
this.setCellAccessibleName(cell.textContent || '', cell, columnId);
}
diff --git a/front_end/network/NetworkLogViewColumns.js b/front_end/network/NetworkLogViewColumns.js
index 2117e46..baaffec 100644
--- a/front_end/network/NetworkLogViewColumns.js
+++ b/front_end/network/NetworkLogViewColumns.js
@@ -475,9 +475,9 @@
*/
_makeHeaderFragment(title, subtitle) {
const fragment = createDocumentFragment();
- fragment.createTextChild(title);
+ UI.UIUtils.createTextChild(fragment, title);
const subtitleDiv = fragment.createChild('div', 'network-header-subtitle');
- subtitleDiv.createTextChild(subtitle);
+ UI.UIUtils.createTextChild(subtitleDiv, subtitle);
return fragment;
}
diff --git a/front_end/network/RequestCookiesView.js b/front_end/network/RequestCookiesView.js
index 140d1e2..a3a7c37 100644
--- a/front_end/network/RequestCookiesView.js
+++ b/front_end/network/RequestCookiesView.js
@@ -211,7 +211,7 @@
const listItem = this._malformedResponseCookiesList.createChild('span', 'cookie-line source-code');
const icon = UI.Icon.Icon.create('smallicon-error', 'cookie-warning-icon');
listItem.appendChild(icon);
- listItem.createTextChild(malformedCookie.cookieLine);
+ UI.UIUtils.createTextChild(listItem, malformedCookie.cookieLine);
listItem.title =
SDK.NetworkRequest.setCookieBlockedReasonToUiString(Protocol.Network.SetCookieBlockedReason.SyntaxError);
}
diff --git a/front_end/network/RequestHeadersView.js b/front_end/network/RequestHeadersView.js
index c968597..20b49e0 100644
--- a/front_end/network/RequestHeadersView.js
+++ b/front_end/network/RequestHeadersView.js
@@ -333,7 +333,7 @@
paramsTreeElement.listItemElement.removeChildren();
paramsTreeElement.listItemElement.createChild('div', 'selection fill');
- paramsTreeElement.listItemElement.createTextChild(title);
+ UI.UIUtils.createTextChild(paramsTreeElement.listItemElement, title);
const headerCount = document.createElement('span');
headerCount.classList.add('header-count');
@@ -475,7 +475,7 @@
const rootListItemElement = rootListItem.listItemElement;
rootListItemElement.removeChildren();
rootListItemElement.createChild('div', 'selection fill');
- rootListItemElement.createTextChild(this._requestPayloadCategory.title.toString());
+ UI.UIUtils.createTextChild(rootListItemElement, this._requestPayloadCategory.title.toString());
const shouldViewSource = viewSourceForItems.add(rootListItem);
if (shouldViewSource) {
@@ -729,7 +729,7 @@
_refreshHeadersTitle(title, headersTreeElement, headersLength) {
headersTreeElement.listItemElement.removeChildren();
headersTreeElement.listItemElement.createChild('div', 'selection fill');
- headersTreeElement.listItemElement.createTextChild(title);
+ UI.UIUtils.createTextChild(headersTreeElement.listItemElement, title);
const headerCount = Common.UIString.UIString('\xA0(%d)', headersLength);
headersTreeElement.listItemElement.createChild('span', 'header-count').textContent = headerCount;
@@ -810,7 +810,7 @@
ls`Active client experiment variation IDs that trigger server-side behavior.`);
const wrapper = document.createElement('div');
wrapper.classList.add('x-client-data-details');
- wrapper.createTextChild(ls`Decoded:`);
+ UI.UIUtils.createTextChild(wrapper, ls`Decoded:`);
const div = wrapper.createChild('div');
div.classList.add('source-code');
div.textContent = output;
diff --git a/front_end/network/RequestInitiatorView.js b/front_end/network/RequestInitiatorView.js
index c6147dd..002a709 100644
--- a/front_end/network/RequestInitiatorView.js
+++ b/front_end/network/RequestInitiatorView.js
@@ -53,7 +53,7 @@
const icon = UI.Icon.Icon.create('smallicon-triangle-right');
const clickableElement = section.createChild('div', 'request-initiator-view-section-title');
clickableElement.appendChild(icon);
- clickableElement.createTextChild(title);
+ UI.UIUtils.createTextChild(clickableElement, title);
clickableElement.tabIndex = 0;
sectionContent.classList.add('hidden', 'request-initiator-view-section-content');
section.appendChild(sectionContent);
diff --git a/front_end/network/RequestTimingView.js b/front_end/network/RequestTimingView.js
index 218a4d0..190667ae 100644
--- a/front_end/network/RequestTimingView.js
+++ b/front_end/network/RequestTimingView.js
@@ -239,10 +239,10 @@
/** @type {!HTMLTableCellElement} */
const startedCell = /** @type {!HTMLTableCellElement} */ (startTimeHeader.createChild('tr').createChild('td'));
queuedCell.colSpan = startedCell.colSpan = 3;
- queuedCell.createTextChild(
- Common.UIString.UIString('Queued at %s', calculator.formatValue(request.issueTime(), 2)));
- startedCell.createTextChild(
- Common.UIString.UIString('Started at %s', calculator.formatValue(request.startTime, 2)));
+ UI.UIUtils.createTextChild(
+ queuedCell, Common.UIString.UIString('Queued at %s', calculator.formatValue(request.issueTime(), 2)));
+ UI.UIUtils.createTextChild(
+ startedCell, Common.UIString.UIString('Started at %s', calculator.formatValue(request.startTime, 2)));
let right;
for (let i = 0; i < timeRanges.length; ++i) {
@@ -278,7 +278,7 @@
const tr = tableElement.createChild('tr');
const timingBarTitleEement = tr.createChild('td');
- timingBarTitleEement.createTextChild(RequestTimingView._timeRangeTitle(rangeName));
+ UI.UIUtils.createTextChild(timingBarTitleEement, RequestTimingView._timeRangeTitle(rangeName));
const row = tr.createChild('td').createChild('div', 'network-timing-row');
const bar = row.createChild('span', 'network-timing-bar ' + rangeName);
@@ -303,7 +303,7 @@
/** @type {!HTMLTableCellElement} */
const cell = /** @type {!HTMLTableCellElement} */ (tableElement.createChild('tr').createChild('td', 'caution'));
cell.colSpan = 3;
- cell.createTextChild(Common.UIString.UIString('CAUTION: request is not finished yet!'));
+ UI.UIUtils.createTextChild(cell, Common.UIString.UIString('CAUTION: request is not finished yet!'));
}
const footer = tableElement.createChild('tr', 'network-timing-footer');
@@ -313,7 +313,7 @@
note.appendChild(UI.UIUtils.createDocumentationLink(
'network-performance/reference#timing-explanation', Common.UIString.UIString('Explanation')));
footer.createChild('td');
- footer.createChild('td').createTextChild(Number.secondsToString(totalDuration, true));
+ UI.UIUtils.createTextChild(footer.createChild('td'), Number.secondsToString(totalDuration, true));
const serverTimings = request.serverTimings;
@@ -326,9 +326,9 @@
breakElement.createChild('hr', 'break');
const serverHeader = tableElement.createChild('tr', 'network-timing-table-header');
- serverHeader.createChild('td').createTextChild(Common.UIString.UIString('Server Timing'));
+ UI.UIUtils.createTextChild(serverHeader.createChild('td'), Common.UIString.UIString('Server Timing'));
serverHeader.createChild('td');
- serverHeader.createChild('td').createTextChild(Common.UIString.UIString('TIME'));
+ UI.UIUtils.createTextChild(serverHeader.createChild('td'), Common.UIString.UIString('TIME'));
if (!serverTimings) {
const informationRow = tableElement.createChild('tr');
@@ -361,7 +361,7 @@
const tr = tableElement.createChild('tr', isTotal ? 'network-timing-footer' : '');
const metric = tr.createChild('td', 'network-timing-metric');
const description = serverTiming.description || serverTiming.metric;
- metric.createTextChild(description);
+ UI.UIUtils.createTextChild(metric, description);
metric.title = description;
const row = tr.createChild('td').createChild('div', 'network-timing-row');
@@ -389,10 +389,10 @@
function createHeader(title) {
const dataHeader = tableElement.createChild('tr', 'network-timing-table-header');
const headerCell = dataHeader.createChild('td');
- headerCell.createTextChild(title);
+ UI.UIUtils.createTextChild(headerCell, title);
UI.ARIAUtils.markAsHeading(headerCell, 2);
- dataHeader.createChild('td').createTextChild('');
- dataHeader.createChild('td').createTextChild(ls`DURATION`);
+ UI.UIUtils.createTextChild(dataHeader.createChild('td'), '');
+ UI.UIUtils.createTextChild(dataHeader.createChild('td'), ls`DURATION`);
return dataHeader;
}
}
diff --git a/front_end/network/ResourceWebSocketFrameView.js b/front_end/network/ResourceWebSocketFrameView.js
index 7373505..b5fd4de 100644
--- a/front_end/network/ResourceWebSocketFrameView.js
+++ b/front_end/network/ResourceWebSocketFrameView.js
@@ -287,7 +287,7 @@
const timeText = ('0' + time.getHours()).substr(-2) + ':' + ('0' + time.getMinutes()).substr(-2) + ':' +
('0' + time.getSeconds()).substr(-2) + '.' + ('00' + time.getMilliseconds()).substr(-3);
const timeNode = document.createElement('div');
- timeNode.createTextChild(timeText);
+ UI.UIUtils.createTextChild(timeNode, timeText);
timeNode.title = time.toLocaleString();
let dataText = frame.text;
diff --git a/front_end/object_ui/JavaScriptAutocomplete.js b/front_end/object_ui/JavaScriptAutocomplete.js
index 056c3e8..2c1d610 100644
--- a/front_end/object_ui/JavaScriptAutocomplete.js
+++ b/front_end/object_ui/JavaScriptAutocomplete.js
@@ -789,10 +789,10 @@
if (i === argumentIndex || (i < argumentIndex && args[i].startsWith('...'))) {
argumentsElement.appendChild(UI.Fragment.html`<b>${args[i]}</b>`);
} else {
- argumentsElement.createTextChild(args[i]);
+ UI.UIUtils.createTextChild(argumentsElement, args[i]);
}
if (i < args.length - 1) {
- argumentsElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(argumentsElement, ', ');
}
}
tooltip.appendChild(UI.Fragment.html`<div class='source-code'>\u0192(${argumentsElement})</div>`);
diff --git a/front_end/object_ui/ObjectPopoverHelper.js b/front_end/object_ui/ObjectPopoverHelper.js
index 6b4343d..9fa58d3 100644
--- a/front_end/object_ui/ObjectPopoverHelper.js
+++ b/front_end/object_ui/ObjectPopoverHelper.js
@@ -105,7 +105,7 @@
valueElement.style.whiteSpace = 'pre';
if (result.type === 'string') {
- valueElement.createTextChildren(`"${description}"`);
+ UI.UIUtils.createTextChildren(valueElement, `"${description}"`);
} else if (result.type !== 'function') {
valueElement.textContent = description;
}
diff --git a/front_end/object_ui/ObjectPropertiesSection.js b/front_end/object_ui/ObjectPropertiesSection.js
index 2841110..29f6c3c 100644
--- a/front_end/object_ui/ObjectPropertiesSection.js
+++ b/front_end/object_ui/ObjectPropertiesSection.js
@@ -271,9 +271,9 @@
valueElement.createChild('span', 'object-value-function-prefix').textContent = prefix + ' ';
}
if (includePreview) {
- valueElement.createTextChild(body.trim().trimEndWithMaxLength(maxFunctionBodyLength));
+ UI.UIUtils.createTextChild(valueElement, body.trim().trimEndWithMaxLength(maxFunctionBodyLength));
} else {
- valueElement.createTextChild(abbreviation.replace(/\n/g, ' '));
+ UI.UIUtils.createTextChild(valueElement, abbreviation.replace(/\n/g, ' '));
}
}
}
@@ -379,7 +379,7 @@
(self.ObjectUI.ObjectPropertiesSection._maxRenderableStringLength || maxRenderableStringLength)) {
propertyValue = new ExpandableTextPropertyValue(valueElement, text, 50);
} else {
- valueElement.createTextChild(text);
+ UI.UIUtils.createTextChild(valueElement, text);
propertyValue = new ObjectPropertyValue(valueElement);
valueElement.title = description || '';
}
diff --git a/front_end/object_ui/RemoteObjectPreviewFormatter.js b/front_end/object_ui/RemoteObjectPreviewFormatter.js
index b75d491..245d1d3 100644
--- a/front_end/object_ui/RemoteObjectPreviewFormatter.js
+++ b/front_end/object_ui/RemoteObjectPreviewFormatter.js
@@ -6,8 +6,8 @@
// TODO(crbug.com/1011811): Enable TypeScript compiler checks
import * as Common from '../common/common.js';
-
import * as SDK from '../sdk/sdk.js';
+import * as UI from '../ui/ui.js';
/**
* @unrestricted
@@ -74,7 +74,7 @@
}
const propertiesElement = parentElement.createChild('span', 'object-properties-preview');
- propertiesElement.createTextChild(isArrayOrTypedArray ? '[' : '{');
+ UI.UIUtils.createTextChild(propertiesElement, isArrayOrTypedArray ? '[' : '{');
if (preview.entries) {
this._appendEntriesPreview(propertiesElement, preview);
} else if (isArrayOrTypedArray) {
@@ -86,7 +86,7 @@
const ellipsisText = propertiesElement.textContent.length > 1 ? ',\xA0…' : '…';
propertiesElement.createChild('span').textContent = ellipsisText;
}
- propertiesElement.createTextChild(isArrayOrTypedArray ? ']' : '}');
+ UI.UIUtils.createTextChild(propertiesElement, isArrayOrTypedArray ? ']' : '}');
}
/**
@@ -111,7 +111,7 @@
.sort(RemoteObjectPreviewFormatter._objectPropertyComparator);
for (let i = 0; i < properties.length; ++i) {
if (i > 0) {
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
const property = properties[i];
@@ -122,7 +122,7 @@
const nextProperty = i + 1 < properties.length ? properties[i + 1] : null;
if (nextProperty && nextProperty.name === internalName.PromiseResult) {
if (property.value !== 'pending') {
- parentElement.createTextChild(': ');
+ UI.UIUtils.createTextChild(parentElement, ': ');
parentElement.appendChild(this._renderPropertyPreviewOrAccessor([nextProperty]));
}
i++;
@@ -133,7 +133,7 @@
parentElement.appendChild(this._renderPropertyPreviewOrAccessor([property]));
} else {
parentElement.appendChild(this._renderDisplayName(name));
- parentElement.createTextChild(': ');
+ UI.UIUtils.createTextChild(parentElement, ': ');
parentElement.appendChild(this._renderPropertyPreviewOrAccessor([property]));
}
}
@@ -176,18 +176,18 @@
let elementsAdded = false;
for (let i = 0; i < indexProperties.length; ++i) {
if (elementsAdded) {
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
const property = indexProperties[i];
const index = toArrayIndex(property.name);
if (canShowGaps && index - lastNonEmptyArrayIndex > 1) {
appendUndefined(index);
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
if (!canShowGaps && i !== index) {
parentElement.appendChild(this._renderDisplayName(property.name));
- parentElement.createTextChild(': ');
+ UI.UIUtils.createTextChild(parentElement, ': ');
}
parentElement.appendChild(this._renderPropertyPreviewOrAccessor([property]));
lastNonEmptyArrayIndex = index;
@@ -196,19 +196,19 @@
if (canShowGaps && arrayLength - lastNonEmptyArrayIndex > 1) {
if (elementsAdded) {
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
appendUndefined(arrayLength);
}
for (let i = 0; i < otherProperties.length; ++i) {
if (elementsAdded) {
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
const property = otherProperties[i];
parentElement.appendChild(this._renderDisplayName(property.name));
- parentElement.createTextChild(': ');
+ UI.UIUtils.createTextChild(parentElement, ': ');
parentElement.appendChild(this._renderPropertyPreviewOrAccessor([property]));
elementsAdded = true;
}
@@ -232,13 +232,13 @@
_appendEntriesPreview(parentElement, preview) {
for (let i = 0; i < preview.entries.length; ++i) {
if (i > 0) {
- parentElement.createTextChild(', ');
+ UI.UIUtils.createTextChild(parentElement, ', ');
}
const entry = preview.entries[i];
if (entry.key) {
this.appendObjectPreview(parentElement, entry.key, true /* isEntry */);
- parentElement.createTextChild(' => ');
+ UI.UIUtils.createTextChild(parentElement, ' => ');
}
this.appendObjectPreview(parentElement, entry.value, true /* isEntry */);
}
@@ -293,7 +293,7 @@
}
if (type === 'string') {
- span.createTextChildren('"', description.replace(/\n/g, '\u21B5'), '"');
+ UI.UIUtils.createTextChildren(span, '"', description.replace(/\n/g, '\u21B5'), '"');
return span;
}
diff --git a/front_end/persistence/WorkspaceSettingsTab.js b/front_end/persistence/WorkspaceSettingsTab.js
index 684e93d..ffd66d1 100644
--- a/front_end/persistence/WorkspaceSettingsTab.js
+++ b/front_end/persistence/WorkspaceSettingsTab.js
@@ -21,7 +21,7 @@
this.registerRequiredCSS('persistence/workspaceSettingsTab.css');
const header = this.element.createChild('header');
- header.createChild('h1').createTextChild(Common.UIString.UIString('Workspace'));
+ UI.UIUtils.createTextChild(header.createChild('h1'), Common.UIString.UIString('Workspace'));
this.containerElement = this.element.createChild('div', 'settings-container-wrapper')
.createChild('div', 'settings-tab settings-content settings-container');
@@ -37,7 +37,7 @@
this.containerElement.appendChild(folderExcludePatternInput);
const div = this.containerElement.createChild('div', 'settings-info-message');
- div.createTextChild(Common.UIString.UIString('Mappings are inferred automatically.'));
+ UI.UIUtils.createTextChild(div, Common.UIString.UIString('Mappings are inferred automatically.'));
this._fileSystemsListContainer = this.containerElement.createChild('div', '');
diff --git a/front_end/profiler/HeapSnapshotView.js b/front_end/profiler/HeapSnapshotView.js
index e674ec5..db85630 100644
--- a/front_end/profiler/HeapSnapshotView.js
+++ b/front_end/profiler/HeapSnapshotView.js
@@ -1884,8 +1884,10 @@
if (!frames) {
const stackDiv = this.element.createChild('div', 'no-heap-allocation-stack');
- stackDiv.createTextChild(Common.UIString.UIString(
- 'Stack was not recorded for this object because it had been allocated before this profile recording started.'));
+ UI.UIUtils.createTextChild(
+ stackDiv,
+ Common.UIString.UIString(
+ 'Stack was not recorded for this object because it had been allocated before this profile recording started.'));
return;
}
diff --git a/front_end/profiler/ProfileDataGrid.js b/front_end/profiler/ProfileDataGrid.js
index 0138778..3692bba 100644
--- a/front_end/profiler/ProfileDataGrid.js
+++ b/front_end/profiler/ProfileDataGrid.js
@@ -189,7 +189,7 @@
warningIcon.title = Common.UIString.UIString('Not optimized: %s', this._deoptReason);
cell.appendChild(warningIcon);
}
- cell.createTextChild(this.functionName);
+ UI.UIUtils.createTextChild(cell, this.functionName);
if (this.profileNode.scriptId === '0') {
return cell;
}
diff --git a/front_end/quick_open/CommandMenu.js b/front_end/quick_open/CommandMenu.js
index a47b890..08b2018 100644
--- a/front_end/quick_open/CommandMenu.js
+++ b/front_end/quick_open/CommandMenu.js
@@ -300,7 +300,7 @@
const index = String.hashCode(command.category()) % MaterialPaletteColors.length;
tagElement.style.backgroundColor = MaterialPaletteColors[index];
tagElement.textContent = command.category();
- titleElement.createTextChild(command.title());
+ UI.UIUtils.createTextChild(titleElement, command.title());
FilteredListWidget.highlightRanges(titleElement, query, true);
subtitleElement.textContent = command.shortcut();
}
diff --git a/front_end/quick_open/HelpQuickOpen.js b/front_end/quick_open/HelpQuickOpen.js
index 34f2c5d..b6afe76 100644
--- a/front_end/quick_open/HelpQuickOpen.js
+++ b/front_end/quick_open/HelpQuickOpen.js
@@ -3,6 +3,7 @@
// found in the LICENSE file.
import * as Root from '../root/root.js';
+import * as UI from '../ui/ui.js';
import {Provider} from './FilteredListWidget.js';
import {QuickOpenImpl} from './QuickOpen.js';
@@ -62,7 +63,7 @@
const provider = this._providers[itemIndex];
const prefixElement = titleElement.createChild('span', 'monospace');
prefixElement.textContent = (provider.prefix || '…') + ' ';
- titleElement.createTextChild(provider.title);
+ UI.UIUtils.createTextChild(titleElement, provider.title);
}
/**
diff --git a/front_end/quick_open/QuickPick.js b/front_end/quick_open/QuickPick.js
index 3ef7f37..279ef68 100644
--- a/front_end/quick_open/QuickPick.js
+++ b/front_end/quick_open/QuickPick.js
@@ -143,17 +143,17 @@
const item = this._items[itemIndex];
titleElement.removeChildren();
const labelElement = titleElement.createChild('span');
- labelElement.createTextChild(item.label);
+ UI.UIUtils.createTextChild(labelElement, item.label);
FilteredListWidget.highlightRanges(titleElement, query, true);
if (item.description) {
const descriptionElement = titleElement.createChild('span', 'quickpick-description');
- descriptionElement.createTextChild(item.description);
+ UI.UIUtils.createTextChild(descriptionElement, item.description);
if (this._matchOnDescription) {
FilteredListWidget.highlightRanges(descriptionElement, query, true);
}
}
if (item.detail) {
- subtitleElement.createTextChild(item.detail);
+ UI.UIUtils.createTextChild(subtitleElement, item.detail);
if (this._matchOnDetail) {
FilteredListWidget.highlightRanges(subtitleElement, query, true);
}
diff --git a/front_end/resources/DatabaseQueryView.js b/front_end/resources/DatabaseQueryView.js
index 7362ae2..7be6f1a 100644
--- a/front_end/resources/DatabaseQueryView.js
+++ b/front_end/resources/DatabaseQueryView.js
@@ -281,7 +281,7 @@
const resultElement = this._appendQueryResult(query);
resultElement.classList.add('error');
resultElement.appendChild(UI.Icon.Icon.create('smallicon-error', 'prompt-icon'));
- resultElement.createTextChild(errorText);
+ UI.UIUtils.createTextChild(resultElement, errorText);
this._scrollResultIntoView();
}
diff --git a/front_end/resources/IndexedDBViews.js b/front_end/resources/IndexedDBViews.js
index 3ce0f05..de2f5e6 100644
--- a/front_end/resources/IndexedDBViews.js
+++ b/front_end/resources/IndexedDBViews.js
@@ -200,26 +200,26 @@
*/
_keyColumnHeaderFragment(prefix, keyPath) {
const keyColumnHeaderFragment = createDocumentFragment();
- keyColumnHeaderFragment.createTextChild(prefix);
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, prefix);
if (keyPath === null) {
return keyColumnHeaderFragment;
}
- keyColumnHeaderFragment.createTextChild(' (' + Common.UIString.UIString('Key path: '));
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, ' (' + Common.UIString.UIString('Key path: '));
if (Array.isArray(keyPath)) {
- keyColumnHeaderFragment.createTextChild('[');
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, '[');
for (let i = 0; i < keyPath.length; ++i) {
if (i !== 0) {
- keyColumnHeaderFragment.createTextChild(', ');
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, ', ');
}
keyColumnHeaderFragment.appendChild(this._keyPathStringFragment(keyPath[i]));
}
- keyColumnHeaderFragment.createTextChild(']');
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, ']');
} else {
const keyPathString = /** @type {string} */ (keyPath);
keyColumnHeaderFragment.appendChild(this._keyPathStringFragment(keyPathString));
}
- keyColumnHeaderFragment.createTextChild(')');
+ UI.UIUtils.createTextChild(keyColumnHeaderFragment, ')');
return keyColumnHeaderFragment;
}
@@ -229,10 +229,10 @@
*/
_keyPathStringFragment(keyPathString) {
const keyPathStringFragment = createDocumentFragment();
- keyPathStringFragment.createTextChild('"');
+ UI.UIUtils.createTextChild(keyPathStringFragment, '"');
const keyPathSpan = keyPathStringFragment.createChild('span', 'source-code indexed-db-key-path');
keyPathSpan.textContent = keyPathString;
- keyPathStringFragment.createTextChild('"');
+ UI.UIUtils.createTextChild(keyPathStringFragment, '"');
return keyPathStringFragment;
}
diff --git a/front_end/resources/ServiceWorkersView.js b/front_end/resources/ServiceWorkersView.js
index 65cdb9d..73f09cf 100644
--- a/front_end/resources/ServiceWorkersView.js
+++ b/front_end/resources/ServiceWorkersView.js
@@ -585,12 +585,12 @@
_updateClientInfo(element, targetInfo) {
if (targetInfo.type !== 'page' && targetInfo.type === 'iframe') {
const clientString = element.createChild('span', 'service-worker-client-string');
- clientString.createTextChild(ls`Worker: ${targetInfo.url}`);
+ UI.UIUtils.createTextChild(clientString, ls`Worker: ${targetInfo.url}`);
return;
}
element.removeChildren();
const clientString = element.createChild('span', 'service-worker-client-string');
- clientString.createTextChild(targetInfo.url);
+ UI.UIUtils.createTextChild(clientString, targetInfo.url);
this._createLink(
element, ls`focus`, this._activateTarget.bind(this, targetInfo.targetId), 'service-worker-client-focus-link');
}
diff --git a/front_end/screencast/ScreencastView.js b/front_end/screencast/ScreencastView.js
index f2027cb..d563707 100644
--- a/front_end/screencast/ScreencastView.js
+++ b/front_end/screencast/ScreencastView.js
@@ -126,10 +126,10 @@
this._tagNameElement = /** @type {!HTMLElement} */ (this._titleElement.createChild('span', 'screencast-tag-name'));
this._attributeElement =
/** @type {!HTMLElement} */ (this._titleElement.createChild('span', 'screencast-attribute'));
- this._titleElement.createTextChild(' ');
+ UI.UIUtils.createTextChild(this._titleElement, ' ');
const dimension = /** @type {!HTMLElement} */ (this._titleElement.createChild('span', 'screencast-dimension'));
this._nodeWidthElement = /** @type {!HTMLElement} */ (dimension.createChild('span'));
- dimension.createTextChild(' × ');
+ UI.UIUtils.createTextChild(dimension, ' × ');
this._nodeHeightElement = /** @type {!HTMLElement} */ (dimension.createChild('span'));
this._titleElement.style.top = '0';
this._titleElement.style.left = '0';
diff --git a/front_end/settings/SettingsScreen.js b/front_end/settings/SettingsScreen.js
index 4740772..decc5b0 100644
--- a/front_end/settings/SettingsScreen.js
+++ b/front_end/settings/SettingsScreen.js
@@ -209,7 +209,7 @@
this.element.id = id;
}
const header = this.element.createChild('header');
- header.createChild('h1').createTextChild(name);
+ UI.UIUtils.createTextChild(header.createChild('h1'), name);
this.containerElement = this.element.createChild('div', 'settings-container-wrapper')
.createChild('div', 'settings-tab settings-content settings-container');
}
@@ -377,7 +377,7 @@
const subsection = createElement('div');
const warning = subsection.createChild('span', 'settings-experiments-warning-subsection-warning');
warning.textContent = Common.UIString.UIString('WARNING:');
- subsection.createTextChild(' ');
+ UI.UIUtils.createTextChild(subsection, ' ');
const message = subsection.createChild('span', 'settings-experiments-warning-subsection-message');
message.textContent = warningMessage;
return subsection;
diff --git a/front_end/source_frame/FontView.js b/front_end/source_frame/FontView.js
index 84b6ee6..1ea5d5a 100644
--- a/front_end/source_frame/FontView.js
+++ b/front_end/source_frame/FontView.js
@@ -91,7 +91,7 @@
if (i > 0) {
fontPreview.createChild('br');
}
- fontPreview.createTextChild(_fontPreviewLines[i]);
+ UI.UIUtils.createTextChild(fontPreview, _fontPreviewLines[i]);
}
this.fontPreviewElement = fontPreview.cloneNode(true);
UI.ARIAUtils.markAsHidden(this.fontPreviewElement);
diff --git a/front_end/sources/DebuggerPlugin.js b/front_end/sources/DebuggerPlugin.js
index a3e5be5..896baa0 100644
--- a/front_end/sources/DebuggerPlugin.js
+++ b/front_end/sources/DebuggerPlugin.js
@@ -1123,11 +1123,11 @@
continue;
} // Only render name once in the given continuous block.
if (renderedNameCount) {
- widget.createTextChild(', ');
+ UI.UIUtils.createTextChild(widget, ', ');
}
const nameValuePair = widget.createChild('span');
widget.__nameToToken.set(name, nameValuePair);
- nameValuePair.createTextChild(name + ' = ');
+ UI.UIUtils.createTextChild(nameValuePair, name + ' = ');
const value = valuesMap.get(name);
const propertyCount = value.preview ? value.preview.properties.length : 0;
const entryCount = value.preview && value.preview.entries ? value.preview.entries.length : 0;
diff --git a/front_end/timeline/TimelineTreeView.js b/front_end/timeline/TimelineTreeView.js
index b745b5c..7390232 100644
--- a/front_end/timeline/TimelineTreeView.js
+++ b/front_end/timeline/TimelineTreeView.js
@@ -404,7 +404,7 @@
return;
}
const banner = this._detailsView.element.createChild('div', 'full-widget-dimmed-banner');
- banner.createTextChild(Common.UIString.UIString('Select item for details.'));
+ UI.UIUtils.createTextChild(banner, Common.UIString.UIString('Select item for details.'));
}
/**
diff --git a/front_end/timeline/TimelineUIUtils.js b/front_end/timeline/TimelineUIUtils.js
index 2b18cd3..d1117dc 100644
--- a/front_end/timeline/TimelineUIUtils.js
+++ b/front_end/timeline/TimelineUIUtils.js
@@ -700,11 +700,11 @@
case recordType.FunctionCall:
case recordType.JSFrame: {
details = createElement('span');
- details.createTextChild(TimelineUIUtils.frameDisplayName(eventData));
+ UI.UIUtils.createTextChild(details, TimelineUIUtils.frameDisplayName(eventData));
const location = linkifyLocation(
eventData['scriptId'], eventData['url'], eventData['lineNumber'], eventData['columnNumber']);
if (location) {
- details.createTextChild(' @ ');
+ UI.UIUtils.createTextChild(details, ' @ ');
details.appendChild(location);
}
break;
@@ -2175,7 +2175,7 @@
case warnings.V8Deopt: {
span.appendChild(UI.XLink.XLink.create(
'https://github.com/GoogleChrome/devtools-docs/issues/53', Common.UIString.UIString('Not optimized')));
- span.createTextChild(Common.UIString.UIString(': %s', eventData['deoptReason']));
+ UI.UIUtils.createTextChild(span, Common.UIString.UIString(': %s', eventData['deoptReason']));
break;
}
@@ -2291,12 +2291,12 @@
const first = this._invalidations[0];
if (first.cause.stackTrace) {
const stack = content.createChild('div');
- stack.createTextChild(ls`Stack trace:`);
+ UI.UIUtils.createTextChild(stack, ls`Stack trace:`);
this._contentHelper.createChildStackTraceElement(
stack, TimelineUIUtils._stackTraceFromCallFrames(first.cause.stackTrace));
}
- content.createTextChild(this._invalidations.length !== 1 ? ls`Nodes:` : ls`Node:`);
+ UI.UIUtils.createTextChild(content, this._invalidations.length !== 1 ? ls`Nodes:` : ls`Node:`);
const nodeList = content.createChild('div', 'node-list');
let firstNode = true;
for (let i = 0; i < this._invalidations.length; i++) {
@@ -2304,7 +2304,7 @@
const invalidationNode = this._createInvalidationNode(invalidation, true);
if (invalidationNode) {
if (!firstNode) {
- nodeList.createTextChild(ls`, `);
+ UI.UIUtils.createTextChild(nodeList, ls`, `);
}
firstNode = false;
@@ -2312,19 +2312,21 @@
const extraData = invalidation.extraData ? ', ' + invalidation.extraData : '';
if (invalidation.changedId) {
- nodeList.createTextChild(
- Common.UIString.UIString('(changed id to "%s"%s)', invalidation.changedId, extraData));
+ UI.UIUtils.createTextChild(
+ nodeList, Common.UIString.UIString('(changed id to "%s"%s)', invalidation.changedId, extraData));
} else if (invalidation.changedClass) {
- nodeList.createTextChild(
- Common.UIString.UIString('(changed class to "%s"%s)', invalidation.changedClass, extraData));
+ UI.UIUtils.createTextChild(
+ nodeList, Common.UIString.UIString('(changed class to "%s"%s)', invalidation.changedClass, extraData));
} else if (invalidation.changedAttribute) {
- nodeList.createTextChild(
+ UI.UIUtils.createTextChild(
+ nodeList,
Common.UIString.UIString('(changed attribute to "%s"%s)', invalidation.changedAttribute, extraData));
} else if (invalidation.changedPseudo) {
- nodeList.createTextChild(
- Common.UIString.UIString('(changed pesudo to "%s"%s)', invalidation.changedPseudo, extraData));
+ UI.UIUtils.createTextChild(
+ nodeList, Common.UIString.UIString('(changed pesudo to "%s"%s)', invalidation.changedPseudo, extraData));
} else if (invalidation.selectorPart) {
- nodeList.createTextChild(Common.UIString.UIString('(changed "%s"%s)', invalidation.selectorPart, extraData));
+ UI.UIUtils.createTextChild(
+ nodeList, Common.UIString.UIString('(changed "%s"%s)', invalidation.selectorPart, extraData));
}
}
}
@@ -2385,7 +2387,7 @@
}
if (showUnknownNodes) {
const nodeSpan = createElement('span');
- return nodeSpan.createTextChild(Common.UIString.UIString('[ unknown node ]'));
+ return UI.UIUtils.createTextChild(nodeSpan, Common.UIString.UIString('[ unknown node ]'));
}
}
}
@@ -2479,7 +2481,7 @@
*/
_createCell(content, styleName) {
const text = createElement('label');
- text.createTextChild(String(content));
+ UI.UIUtils.createTextChild(text, String(content));
const cell = createElement('td');
cell.className = 'timeline-details';
if (styleName) {
@@ -2513,7 +2515,7 @@
if (content instanceof Node) {
cell.appendChild(content);
} else {
- cell.createTextChild(content || '');
+ UI.UIUtils.createTextChild(cell, content || '');
}
row.appendChild(cell);
this._contentTable.appendChild(row);
@@ -2558,7 +2560,7 @@
if (swatchColor) {
titleElement.createChild('div').style.backgroundColor = swatchColor;
}
- titleElement.createTextChild(title);
+ UI.UIUtils.createTextChild(titleElement, title);
}
this._tableElement = this.element.createChild('div', 'vbox timeline-details-chip-body');
@@ -2602,7 +2604,7 @@
if (content instanceof Node) {
valueElement.appendChild(content);
} else {
- valueElement.createTextChild(content || '');
+ UI.UIUtils.createTextChild(valueElement, content || '');
}
}
@@ -2640,7 +2642,8 @@
return;
}
locationContent.appendChild(link);
- locationContent.createTextChild(Platform.StringUtilities.sprintf(' [%s…%s]', startLine + 1, endLine + 1 || ''));
+ UI.UIUtils.createTextChild(
+ locationContent, Platform.StringUtilities.sprintf(' [%s…%s]', startLine + 1, endLine + 1 || ''));
this.appendElementRow(title, locationContent);
}
diff --git a/front_end/ui/FilterBar.js b/front_end/ui/FilterBar.js
index ca84c53..ea76c36 100644
--- a/front_end/ui/FilterBar.js
+++ b/front_end/ui/FilterBar.js
@@ -38,7 +38,7 @@
import {Suggestions} from './SuggestBox.js'; // eslint-disable-line no-unused-vars
import {Events, TextPrompt} from './TextPrompt.js';
import {ToolbarButton, ToolbarSettingToggle} from './Toolbar.js'; // eslint-disable-line no-unused-vars
-import {CheckboxLabel} from './UIUtils.js';
+import {CheckboxLabel, createTextChild} from './UIUtils.js';
import {HBox} from './Widget.js';
/**
@@ -400,7 +400,7 @@
const typeFilterElement = /** @type {!HTMLElement} */ (this._filtersElement.createChild('span', name));
typeFilterElement.tabIndex = -1;
this._typeFilterElementTypeNames.set(typeFilterElement, name);
- typeFilterElement.createTextChild(label);
+ createTextChild(typeFilterElement, label);
ARIAUtils.markAsOption(typeFilterElement);
if (title) {
typeFilterElement.title = title;
diff --git a/front_end/ui/ShortcutsScreen.js b/front_end/ui/ShortcutsScreen.js
index 16ff60e..999c6b8 100644
--- a/front_end/ui/ShortcutsScreen.js
+++ b/front_end/ui/ShortcutsScreen.js
@@ -34,7 +34,7 @@
import * as ARIAUtils from './ARIAUtils.js';
import {Descriptor, KeyboardShortcut, Keys, Modifiers} from './KeyboardShortcut.js'; // eslint-disable-line no-unused-vars
import {ShortcutRegistry} from './ShortcutRegistry.js';
-import {createDocumentationLink} from './UIUtils.js';
+import {createDocumentationLink, createTextChild} from './UIUtils.js';
import {Widget} from './Widget.js';
/** @type {!ShortcutsScreen} */
@@ -288,7 +288,7 @@
const widget = new Widget();
widget.element.className = 'settings-tab-container'; // Override
- widget.element.createChild('header').createChild('h1').createTextChild(ls`Shortcuts`);
+ createTextChild(widget.element.createChild('header').createChild('h1'), ls`Shortcuts`);
const scrollPane = widget.element.createChild('div', 'settings-container-wrapper');
const container = scrollPane.createChild('div');
container.className = 'settings-content settings-container';
diff --git a/front_end/ui/SoftContextMenu.js b/front_end/ui/SoftContextMenu.js
index f10cb24..7458ed9 100644
--- a/front_end/ui/SoftContextMenu.js
+++ b/front_end/ui/SoftContextMenu.js
@@ -37,7 +37,7 @@
import * as ARIAUtils from './ARIAUtils.js';
import {AnchorBehavior, GlassPane, MarginBehavior, PointerEventsBehavior, SizeBehavior,} from './GlassPane.js'; // eslint-disable-line no-unused-vars
import {Icon} from './Icon.js';
-import {ElementFocusRestorer} from './UIUtils.js';
+import {createTextChild, ElementFocusRestorer} from './UIUtils.js';
/**
* @unrestricted
@@ -162,7 +162,7 @@
if (!item.enabled) {
menuItemElement.classList.add('soft-context-menu-disabled');
}
- menuItemElement.createTextChild(item.label);
+ createTextChild(menuItemElement, item.label);
menuItemElement.createChild('span', 'soft-context-menu-shortcut').textContent = item.shortcut;
menuItemElement.addEventListener('mousedown', this._menuItemMouseDown.bind(this), false);
@@ -206,7 +206,7 @@
menuItemElement.appendChild(checkMarkElement);
checkMarkElement.style.opacity = '0';
- menuItemElement.createTextChild(item.label);
+ createTextChild(menuItemElement, item.label);
ARIAUtils.setExpanded(menuItemElement, false);
if (Host.Platform.isMac() && !ThemeSupport.ThemeSupport.instance().hasTheme()) {
diff --git a/front_end/ui/SyntaxHighlighter.js b/front_end/ui/SyntaxHighlighter.js
index d99e953..6a03903 100644
--- a/front_end/ui/SyntaxHighlighter.js
+++ b/front_end/ui/SyntaxHighlighter.js
@@ -31,6 +31,8 @@
import * as Root from '../root/root.js'; // eslint-disable-line no-unused-vars
import * as TextUtils from '../text_utils/text_utils.js';
+import {createTextChild} from './UIUtils.js';
+
export class SyntaxHighlighter {
/**
* @param {string} mimeType
@@ -52,7 +54,7 @@
if (this._stripExtraWhitespace && className !== 'whitespace') {
content = content.replace(/^[\n\r]*/, '').replace(/\s*$/, '');
}
- span.createTextChild(content);
+ createTextChild(span, content);
return span;
}
@@ -87,10 +89,10 @@
tokenize(line, processToken.bind(this));
if (plainTextStart < line.length) {
const plainText = line.substring(plainTextStart, line.length);
- node.createTextChild(plainText);
+ createTextChild(node, plainText);
}
if (i < lines.length - 1) {
- node.createTextChild('\n');
+ createTextChild(node, '\n');
}
}
}
@@ -109,7 +111,7 @@
if (column > plainTextStart) {
const plainText = line.substring(plainTextStart, column);
- node.createTextChild(plainText);
+ createTextChild(node, plainText);
}
node.appendChild(this.createSpan(token, tokenType));
plainTextStart = newColumn;
diff --git a/front_end/ui/UIUtils.js b/front_end/ui/UIUtils.js
index dc3ae44..0973c8d 100644
--- a/front_end/ui/UIUtils.js
+++ b/front_end/ui/UIUtils.js
@@ -1216,6 +1216,27 @@
}
/**
+ * @param {!Element|!DocumentFragment} element
+ * @param {string} text
+ * @return {!Text}
+ */
+export const createTextChild = (element, text) => {
+ const textNode = element.ownerDocument.createTextNode(text);
+ element.appendChild(textNode);
+ return textNode;
+};
+
+/**
+ * @param {!Element|!DocumentFragment} element
+ * @param {...string} childrenText
+ */
+export const createTextChildren = (element, ...childrenText) => {
+ for (const child of childrenText) {
+ createTextChild(element, child);
+ }
+};
+
+/**
* @param {string} text
* @param {function(!Event):*=} clickHandler
* @param {string=} className
@@ -1286,7 +1307,7 @@
const element = createElement('span', 'dt-radio');
element.radioElement.name = name;
element.radioElement.checked = !!checked;
- element.labelElement.createTextChild(title);
+ createTextChild(element.labelElement, title);
return element;
}
diff --git a/front_end/ui/ViewManager.js b/front_end/ui/ViewManager.js
index 996207a..84d11e8 100644
--- a/front_end/ui/ViewManager.js
+++ b/front_end/ui/ViewManager.js
@@ -14,6 +14,7 @@
import {Icon} from './Icon.js';
import {Events as TabbedPaneEvents, TabbedPane} from './TabbedPane.js';
import {Toolbar, ToolbarItem, ToolbarMenuButton} from './Toolbar.js'; // eslint-disable-line no-unused-vars
+import {createTextChild} from './UIUtils.js';
import {ProvidedView, TabbedViewLocation, View, ViewLocation, ViewLocationResolver, widgetSymbol,} from './View.js'; // eslint-disable-line no-unused-vars
import {VBox, Widget} from './Widget.js'; // eslint-disable-line no-unused-vars
@@ -321,7 +322,7 @@
this._titleExpandIcon = Icon.create('smallicon-triangle-right', 'title-expand-icon');
this._titleElement.appendChild(this._titleExpandIcon);
const titleText = view.title();
- this._titleElement.createTextChild(titleText);
+ createTextChild(this._titleElement, titleText);
ARIAUtils.setAccessibleName(this._titleElement, titleText);
ARIAUtils.setExpanded(this._titleElement, false);
this._titleElement.tabIndex = 0;
diff --git a/front_end/web_audio/AudioContextSelector.js b/front_end/web_audio/AudioContextSelector.js
index 92e4d2c..3632010 100644
--- a/front_end/web_audio/AudioContextSelector.js
+++ b/front_end/web_audio/AudioContextSelector.js
@@ -90,7 +90,7 @@
const element = document.createElement('div');
const shadowRoot = UI.Utils.createShadowRootWithCoreStyles(element, 'web_audio/audioContextSelector.css');
const title = shadowRoot.createChild('div', 'title');
- title.createTextChild(this.titleFor(item).trimEndWithMaxLength(100));
+ UI.UIUtils.createTextChild(title, this.titleFor(item).trimEndWithMaxLength(100));
return element;
}
