fix: compare selector when validating highlight (#18530)

This commit is contained in:
Pavel Feldman 2022-11-03 09:55:45 -07:00 committed by GitHub
parent 17c8554255
commit eac5cc98df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -26,7 +26,8 @@ type HighlightEntry = {
tooltipElement?: HTMLElement,
box?: DOMRect,
tooltipTop?: number,
tooltipLeft?: number
tooltipLeft?: number,
tooltipText?: string,
};
export class Highlight {
@ -160,7 +161,7 @@ export class Highlight {
// Code below should trigger one layout and leave with the
// destroyed layout.
if (this._highlightIsUpToDate(elements))
if (this._highlightIsUpToDate(elements, options.tooltipText))
return;
// 1. Destroy the layout
@ -180,7 +181,7 @@ export class Highlight {
tooltipElement.style.left = '0';
tooltipElement.style.display = 'flex';
}
this._highlightEntries.push({ targetElement: elements[i], tooltipElement, highlightElement });
this._highlightEntries.push({ targetElement: elements[i], tooltipElement, highlightElement, tooltipText: options.tooltipText });
}
// 2. Trigger layout while positioning tooltips and computing bounding boxes.
@ -232,10 +233,12 @@ export class Highlight {
console.error('Highlight box for test: ' + JSON.stringify({ x: box.x, y: box.y, width: box.width, height: box.height })); // eslint-disable-line no-console
}
}
private _highlightIsUpToDate(elements: Element[]): boolean {
private _highlightIsUpToDate(elements: Element[], tooltipText: string | undefined): boolean {
if (elements.length !== this._highlightEntries.length)
return false;
for (let i = 0; i < this._highlightEntries.length; ++i) {
if (tooltipText !== this._highlightEntries[i].tooltipText)
return false;
if (elements[i] !== this._highlightEntries[i].targetElement)
return false;
const oldBox = this._highlightEntries[i].box;