Replace title property setter with Tooltip install invocation
ui/Tooltip.js overrides the HTMLElement prototype to override the
title property. Rather than using this property, we shoul be
calling Tooltip.install directly. This makes sure that new
components are not relying on the behavior of the legacy
prototype patching.
These usages have been manually audited using the following regexes:
Search: ([\S]+)\.title = ([^;]+);
Replace: UI.Tooltip.Tooltip.install($1, $2);
Note that there are classes in DevTools that also have a title
property. Most notably `TreeElement`. We should not be replacing
these, as they do not inherit from HTMLElement. Luckily, we are
running TypeScript to make sure we don't call `Tooltip.install`
with a non-HTMLElement.
A follow-up CL will clean up the getters.
[email protected]
Bug: 1150762
No-presubmit: True
Change-Id: I5928e75c70293531849e0576f4fb2a2a8b3e02d2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2555060
Commit-Queue: Tim van der Lippe <[email protected]>
Auto-Submit: Tim van der Lippe <[email protected]>
Reviewed-by: Jack Franklin <[email protected]>
diff --git a/front_end/console/ConsoleViewMessage.js b/front_end/console/ConsoleViewMessage.js
index 7ee1dba..7bbce35 100644
--- a/front_end/console/ConsoleViewMessage.js
+++ b/front_end/console/ConsoleViewMessage.js
@@ -615,9 +615,10 @@
const note = titleElement.createChild('span', 'object-state-note info-note');
if (this._message.type === SDK.ConsoleModel.MessageType.QueryObjectResult) {
- note.title = ls`This value will not be collected until console is cleared.`;
+ UI.Tooltip.Tooltip.install(note, ls`This value will not be collected until console is cleared.`);
} else {
- note.title = ls`This value was evaluated upon first expanding. It may have changed since then.`;
+ UI.Tooltip.Tooltip.install(
+ note, ls`This value was evaluated upon first expanding. It may have changed since then.`);
}
const section = new ObjectUI.ObjectPropertiesSection.ObjectPropertiesSection(obj, titleElement, this._linkifier);
@@ -652,7 +653,7 @@
result.appendChild(functionElement);
if (targetFunction !== func) {
const note = result.createChild('span', 'object-info-state-note');
- note.title = Common.UIString.UIString('Function was resolved from bound function.');
+ UI.Tooltip.Tooltip.install(note, Common.UIString.UIString('Function was resolved from bound function.'));
}
result.addEventListener('contextmenu', this._contextMenuEventFired.bind(this, targetFunction), false);
promise.then(() => this._formattedParameterAsFunctionForTest());
@@ -783,7 +784,7 @@
if (wasThrown) {
const element = rootElement.createChild('span');
element.textContent = Common.UIString.UIString('<exception>');
- element.title = /** @type {string} */ (object.description);
+ UI.Tooltip.Tooltip.install(element, /** @type {string} */ (object.description));
} else if (isArrayEntry) {
rootElement.appendChild(this._formatAsArrayEntry(object));
} else {
@@ -1049,7 +1050,7 @@
this._timestampElement.classList.add('console-timestamp');
}
this._timestampElement.textContent = UI.UIUtils.formatTimestamp(this._message.timestamp, false) + ' ';
- this._timestampElement.title = UI.UIUtils.formatTimestamp(this._message.timestamp, true);
+ UI.Tooltip.Tooltip.install(this._timestampElement, UI.UIUtils.formatTimestamp(this._message.timestamp, true));
this._contentElement.insertBefore(this._timestampElement, this._contentElement.firstChild);
} else if (this._timestampElement) {
this._timestampElement.remove();
