Migrate dictionary object to Map Drive-by: Improve types Depends on chromium CL: https://crrev.com/c/3110457 Bug: chromium:1172300 Change-Id: Ifaa93dcf6fce52a0c83ead5e195f6a16dde86956 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3113766 Commit-Queue: Sigurd Schneider <sigurds@chromium.org> Reviewed-by: Mathias Bynens <mathias@chromium.org>
diff --git a/front_end/core/sdk/DOMDebuggerModel.ts b/front_end/core/sdk/DOMDebuggerModel.ts index e464b29..b70320e 100644 --- a/front_end/core/sdk/DOMDebuggerModel.ts +++ b/front_end/core/sdk/DOMDebuggerModel.ts
@@ -382,7 +382,7 @@ type: Protocol.DOMDebugger.DOMBreakpointType, enabled: boolean, }, - nodeId: number|null): void { + nodeId: Protocol.DOM.NodeId|null): void { const node = nodeId ? this.domModel.nodeForId(nodeId) : null; if (!node) { return;
diff --git a/front_end/core/sdk/DOMModel.ts b/front_end/core/sdk/DOMModel.ts index 0dfe246..cda79ab 100644 --- a/front_end/core/sdk/DOMModel.ts +++ b/front_end/core/sdk/DOMModel.ts
@@ -127,7 +127,7 @@ this.id = payload.nodeId; this.backendNodeIdInternal = payload.backendNodeId; - this.domModelInternal.getIdToDOMNode()[this.id] = this; + this.domModelInternal.registerNode(this); this.nodeTypeInternal = payload.nodeType; this.nodeNameInternal = payload.nodeName; this.localNameInternal = payload.localName; @@ -626,12 +626,12 @@ return attributesChanged; } - insertChild(prev: DOMNode, payload: Protocol.DOM.Node): DOMNode { + insertChild(prev: DOMNode|undefined, payload: Protocol.DOM.Node): DOMNode { if (!this.childrenInternal) { throw new Error('DOMNode._children is expected to not be null.'); } const node = DOMNode.create(this.domModelInternal, this.ownerDocument, this.isInShadowTreeInternal, payload); - this.childrenInternal.splice(this.childrenInternal.indexOf(prev) + 1, 0, node); + this.childrenInternal.splice(prev ? this.childrenInternal.indexOf(prev) + 1 : 0, 0, node); this.renumber(); return node; } @@ -1033,9 +1033,7 @@ export class DOMModel extends SDKModel<EventTypes> { agent: ProtocolProxyApi.DOMApi; - idToDOMNode: { - [x: number]: DOMNode, - }; + idToDOMNode: Map<Protocol.DOM.NodeId, DOMNode> = new Map(); private document: DOMDocument|null; private readonly attributeLoadNodeIds: Set<Protocol.DOM.NodeId>; readonly runtimeModelInternal: RuntimeModel; @@ -1049,7 +1047,6 @@ this.agent = target.domAgent(); - this.idToDOMNode = {}; this.document = null; this.attributeLoadNodeIds = new Set(); target.registerDOMDispatcher(new DOMDispatcher(this)); @@ -1174,7 +1171,7 @@ return nodeId ? this.nodeForId(nodeId) : null; } - pushNodeByPathToFrontend(path: string): Promise<number|null> { + pushNodeByPathToFrontend(path: string): Promise<Protocol.DOM.NodeId|null> { return this.requestDocument() .then(() => this.agent.invoke_pushNodeByPathToFrontend({path})) .then(({nodeId}) => nodeId); @@ -1197,8 +1194,8 @@ return map; } - attributeModified(nodeId: number, name: string, value: string): void { - const node = this.idToDOMNode[nodeId]; + attributeModified(nodeId: Protocol.DOM.NodeId, name: string, value: string): void { + const node = this.idToDOMNode.get(nodeId); if (!node) { return; } @@ -1208,8 +1205,8 @@ this.scheduleMutationEvent(node); } - attributeRemoved(nodeId: number, name: string): void { - const node = this.idToDOMNode[nodeId]; + attributeRemoved(nodeId: Protocol.DOM.NodeId, name: string): void { + const node = this.idToDOMNode.get(nodeId); if (!node) { return; } @@ -1233,7 +1230,7 @@ // We are calling loadNodeAttributes asynchronously, it is ok if node is not found. return; } - const node = this.idToDOMNode[nodeId]; + const node = this.idToDOMNode.get(nodeId); if (!node) { return; } @@ -1246,15 +1243,19 @@ this.attributeLoadNodeIds.clear(); } - characterDataModified(nodeId: number, newValue: string): void { - const node = this.idToDOMNode[nodeId]; + characterDataModified(nodeId: Protocol.DOM.NodeId, newValue: string): void { + const node = this.idToDOMNode.get(nodeId); + if (!node) { + console.error('nodeId could not be resolved to a node'); + return; + } node.setNodeValueInternal(newValue); this.dispatchEventToListeners(Events.CharacterDataModified, node); this.scheduleMutationEvent(node); } - nodeForId(nodeId: number|null): DOMNode|null { - return nodeId ? this.idToDOMNode[nodeId] || null : null; + nodeForId(nodeId: Protocol.DOM.NodeId|null): DOMNode|null { + return nodeId ? this.idToDOMNode.get(nodeId) || null : null; } documentUpdated(): void { @@ -1268,7 +1269,7 @@ } private setDocument(payload: Protocol.DOM.Node|null): void { - this.idToDOMNode = {}; + this.idToDOMNode = new Map(); if (payload && 'nodeId' in payload) { this.document = new DOMDocument(this, payload); } else { @@ -1289,60 +1290,72 @@ } } - setChildNodes(parentId: number, payloads: Protocol.DOM.Node[]): void { + setChildNodes(parentId: Protocol.DOM.NodeId, payloads: Protocol.DOM.Node[]): void { if (!parentId && payloads.length) { this.setDetachedRoot(payloads[0]); return; } - const parent = this.idToDOMNode[parentId]; - parent.setChildrenPayload(payloads); + const parent = this.idToDOMNode.get(parentId); + parent?.setChildrenPayload(payloads); } - childNodeCountUpdated(nodeId: number, newValue: number): void { - const node = this.idToDOMNode[nodeId]; + childNodeCountUpdated(nodeId: Protocol.DOM.NodeId, newValue: number): void { + const node = this.idToDOMNode.get(nodeId); + if (!node) { + console.error('nodeId could not be resolved to a node'); + return; + } node.setChildNodeCount(newValue); this.dispatchEventToListeners(Events.ChildNodeCountUpdated, node); this.scheduleMutationEvent(node); } - childNodeInserted(parentId: number, prevId: number, payload: Protocol.DOM.Node): void { - const parent = this.idToDOMNode[parentId]; - const prev = this.idToDOMNode[prevId]; + childNodeInserted(parentId: Protocol.DOM.NodeId, prevId: Protocol.DOM.NodeId, payload: Protocol.DOM.Node): void { + const parent = this.idToDOMNode.get(parentId); + const prev = this.idToDOMNode.get(prevId); + if (!parent) { + console.error('parentId could not be resolved to a node'); + return; + } const node = parent.insertChild(prev, payload); - this.idToDOMNode[node.id] = node; + this.idToDOMNode.set(node.id, node); this.dispatchEventToListeners(Events.NodeInserted, node); this.scheduleMutationEvent(node); } - childNodeRemoved(parentId: number, nodeId: number): void { - const parent = this.idToDOMNode[parentId]; - const node = this.idToDOMNode[nodeId]; + childNodeRemoved(parentId: Protocol.DOM.NodeId, nodeId: Protocol.DOM.NodeId): void { + const parent = this.idToDOMNode.get(parentId); + const node = this.idToDOMNode.get(nodeId); + if (!parent || !node) { + console.error('parentId or nodeId could not be resolved to a node'); + return; + } parent.removeChild(node); this.unbind(node); this.dispatchEventToListeners(Events.NodeRemoved, {node: node, parent: parent}); this.scheduleMutationEvent(node); } - shadowRootPushed(hostId: number, root: Protocol.DOM.Node): void { - const host = this.idToDOMNode[hostId]; + shadowRootPushed(hostId: Protocol.DOM.NodeId, root: Protocol.DOM.Node): void { + const host = this.idToDOMNode.get(hostId); if (!host) { return; } const node = DOMNode.create(this, host.ownerDocument, true, root); node.parentNode = host; - this.idToDOMNode[node.id] = node; + this.idToDOMNode.set(node.id, node); host.shadowRootsInternal.unshift(node); this.dispatchEventToListeners(Events.NodeInserted, node); this.scheduleMutationEvent(node); } - shadowRootPopped(hostId: number, rootId: number): void { - const host = this.idToDOMNode[hostId]; + shadowRootPopped(hostId: Protocol.DOM.NodeId, rootId: Protocol.DOM.NodeId): void { + const host = this.idToDOMNode.get(hostId); if (!host) { return; } - const root = this.idToDOMNode[rootId]; + const root = this.idToDOMNode.get(rootId); if (!root) { return; } @@ -1352,14 +1365,14 @@ this.scheduleMutationEvent(root); } - pseudoElementAdded(parentId: number, pseudoElement: Protocol.DOM.Node): void { - const parent = this.idToDOMNode[parentId]; + pseudoElementAdded(parentId: Protocol.DOM.NodeId, pseudoElement: Protocol.DOM.Node): void { + const parent = this.idToDOMNode.get(parentId); if (!parent) { return; } const node = DOMNode.create(this, parent.ownerDocument, false, pseudoElement); node.parentNode = parent; - this.idToDOMNode[node.id] = node; + this.idToDOMNode.set(node.id, node); const pseudoType = node.pseudoType(); if (!pseudoType) { throw new Error('DOMModel._pseudoElementAdded expects pseudoType to be defined.'); @@ -1373,12 +1386,12 @@ this.scheduleMutationEvent(node); } - pseudoElementRemoved(parentId: number, pseudoElementId: number): void { - const parent = this.idToDOMNode[parentId]; + pseudoElementRemoved(parentId: Protocol.DOM.NodeId, pseudoElementId: Protocol.DOM.NodeId): void { + const parent = this.idToDOMNode.get(parentId); if (!parent) { return; } - const pseudoElement = this.idToDOMNode[pseudoElementId]; + const pseudoElement = this.idToDOMNode.get(pseudoElementId); if (!pseudoElement) { return; } @@ -1388,8 +1401,8 @@ this.scheduleMutationEvent(pseudoElement); } - distributedNodesUpdated(insertionPointId: number, distributedNodes: Protocol.DOM.BackendNode[]): void { - const insertionPoint = this.idToDOMNode[insertionPointId]; + distributedNodesUpdated(insertionPointId: Protocol.DOM.NodeId, distributedNodes: Protocol.DOM.BackendNode[]): void { + const insertionPoint = this.idToDOMNode.get(insertionPointId); if (!insertionPoint) { return; } @@ -1399,7 +1412,7 @@ } private unbind(node: DOMNode): void { - delete this.idToDOMNode[node.id]; + this.idToDOMNode.delete(node.id); const children = node.children(); for (let i = 0; children && i < children.length; ++i) { this.unbind(children[i]); @@ -1422,7 +1435,7 @@ name: string, value: string, }[], - pierce: boolean = false): Promise<number[]> { + pierce: boolean = false): Promise<Protocol.DOM.NodeId[]> { await this.requestDocument(); if (!this.document) { throw new Error('DOMModel.getNodesByStyle expects to have a document.'); @@ -1464,11 +1477,11 @@ return this.agent.invoke_collectClassNamesFromSubtree({nodeId}).then(({classNames}) => classNames || []); } - querySelector(nodeId: Protocol.DOM.NodeId, selector: string): Promise<number|null> { + querySelector(nodeId: Protocol.DOM.NodeId, selector: string): Promise<Protocol.DOM.NodeId|null> { return this.agent.invoke_querySelector({nodeId, selector}).then(({nodeId}) => nodeId); } - querySelectorAll(nodeId: Protocol.DOM.NodeId, selector: string): Promise<number[]|null> { + querySelectorAll(nodeId: Protocol.DOM.NodeId, selector: string): Promise<Protocol.DOM.NodeId[]|null> { return this.agent.invoke_querySelectorAll({nodeId, selector}).then(({nodeIds}) => nodeIds); } @@ -1517,8 +1530,8 @@ return this.agent; } - getIdToDOMNode(): {[x: number]: DOMNode} { - return this.idToDOMNode; + registerNode(node: DOMNode): void { + this.idToDOMNode.set(node.id, node); } }
diff --git a/front_end/core/sdk/LayerTreeBase.ts b/front_end/core/sdk/LayerTreeBase.ts index 277fcfc..3a9fd8c 100644 --- a/front_end/core/sdk/LayerTreeBase.ts +++ b/front_end/core/sdk/LayerTreeBase.ts
@@ -174,7 +174,7 @@ return this.viewportSizeInternal; } - private nodeForId(id: number): DOMNode|null { + private nodeForId(id: Protocol.DOM.NodeId): DOMNode|null { return this.domModel ? this.domModel.nodeForId(id) : null; } }
diff --git a/front_end/core/sdk/OverlayModel.ts b/front_end/core/sdk/OverlayModel.ts index 0c9556c..c9f84b5 100644 --- a/front_end/core/sdk/OverlayModel.ts +++ b/front_end/core/sdk/OverlayModel.ts
@@ -317,7 +317,7 @@ this.delayedHideHighlight(2000); } - highlightGridInPersistentOverlay(nodeId: number): void { + highlightGridInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -325,14 +325,14 @@ this.dispatchEventToListeners(Events.PersistentGridOverlayStateChanged, {nodeId, enabled: true}); } - isHighlightedGridInPersistentOverlay(nodeId: number): boolean { + isHighlightedGridInPersistentOverlay(nodeId: Protocol.DOM.NodeId): boolean { if (!this.persistentHighlighter) { return false; } return this.persistentHighlighter.isGridHighlighted(nodeId); } - hideGridInPersistentOverlay(nodeId: number): void { + hideGridInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -340,7 +340,7 @@ this.dispatchEventToListeners(Events.PersistentGridOverlayStateChanged, {nodeId, enabled: false}); } - highlightScrollSnapInPersistentOverlay(nodeId: number): void { + highlightScrollSnapInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -348,14 +348,14 @@ this.dispatchEventToListeners(Events.PersistentScrollSnapOverlayStateChanged, {nodeId, enabled: true}); } - isHighlightedScrollSnapInPersistentOverlay(nodeId: number): boolean { + isHighlightedScrollSnapInPersistentOverlay(nodeId: Protocol.DOM.NodeId): boolean { if (!this.persistentHighlighter) { return false; } return this.persistentHighlighter.isScrollSnapHighlighted(nodeId); } - hideScrollSnapInPersistentOverlay(nodeId: number): void { + hideScrollSnapInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -363,7 +363,7 @@ this.dispatchEventToListeners(Events.PersistentScrollSnapOverlayStateChanged, {nodeId, enabled: false}); } - highlightFlexContainerInPersistentOverlay(nodeId: number): void { + highlightFlexContainerInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -371,14 +371,14 @@ this.dispatchEventToListeners(Events.PersistentFlexContainerOverlayStateChanged, {nodeId, enabled: true}); } - isHighlightedFlexContainerInPersistentOverlay(nodeId: number): boolean { + isHighlightedFlexContainerInPersistentOverlay(nodeId: Protocol.DOM.NodeId): boolean { if (!this.persistentHighlighter) { return false; } return this.persistentHighlighter.isFlexHighlighted(nodeId); } - hideFlexContainerInPersistentOverlay(nodeId: number): void { + hideFlexContainerInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -386,7 +386,7 @@ this.dispatchEventToListeners(Events.PersistentFlexContainerOverlayStateChanged, {nodeId, enabled: false}); } - highlightContainerQueryInPersistentOverlay(nodeId: number): void { + highlightContainerQueryInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -394,14 +394,14 @@ this.dispatchEventToListeners(Events.PersistentContainerQueryOverlayStateChanged, {nodeId, enabled: true}); } - isHighlightedContainerQueryInPersistentOverlay(nodeId: number): boolean { + isHighlightedContainerQueryInPersistentOverlay(nodeId: Protocol.DOM.NodeId): boolean { if (!this.persistentHighlighter) { return false; } return this.persistentHighlighter.isContainerQueryHighlighted(nodeId); } - hideContainerQueryInPersistentOverlay(nodeId: number): void { + hideContainerQueryInPersistentOverlay(nodeId: Protocol.DOM.NodeId): void { if (!this.persistentHighlighter) { return; } @@ -417,14 +417,14 @@ this.sourceOrderHighlighter.highlightSourceOrderInOverlay(node, sourceOrderConfig); } - colorOfGridInPersistentOverlay(nodeId: number): string|null { + colorOfGridInPersistentOverlay(nodeId: Protocol.DOM.NodeId): string|null { if (!this.persistentHighlighter) { return null; } return this.persistentHighlighter.colorOfGrid(nodeId).asString(Common.Color.Format.HEX); } - setColorOfGridInPersistentOverlay(nodeId: number, colorStr: string): void { + setColorOfGridInPersistentOverlay(nodeId: Protocol.DOM.NodeId, colorStr: string): void { if (!this.persistentHighlighter) { return; } @@ -436,14 +436,14 @@ this.persistentHighlighter.resetOverlay(); } - colorOfFlexInPersistentOverlay(nodeId: number): string|null { + colorOfFlexInPersistentOverlay(nodeId: Protocol.DOM.NodeId): string|null { if (!this.persistentHighlighter) { return null; } return this.persistentHighlighter.colorOfFlex(nodeId).asString(Common.Color.Format.HEX); } - setColorOfFlexInPersistentOverlay(nodeId: number, colorStr: string): void { + setColorOfFlexInPersistentOverlay(nodeId: Protocol.DOM.NodeId, colorStr: string): void { if (!this.persistentHighlighter) { return; }
diff --git a/front_end/core/sdk/OverlayPersistentHighlighter.ts b/front_end/core/sdk/OverlayPersistentHighlighter.ts index 77477d7..a715005 100644 --- a/front_end/core/sdk/OverlayPersistentHighlighter.ts +++ b/front_end/core/sdk/OverlayPersistentHighlighter.ts
@@ -9,11 +9,12 @@ export class OverlayPersistentHighlighter { private readonly model: OverlayModel; - private readonly gridHighlights: Map<number, Protocol.Overlay.GridHighlightConfig>; - private readonly scrollSnapHighlights: Map<number, Protocol.Overlay.ScrollSnapContainerHighlightConfig>; - private readonly flexHighlights: Map<number, Protocol.Overlay.FlexContainerHighlightConfig>; - private readonly containerQueryHighlights: Map<number, Protocol.Overlay.ContainerQueryContainerHighlightConfig>; - private readonly colors: Map<number, Common.Color.Color>; + private readonly gridHighlights: Map<Protocol.DOM.NodeId, Protocol.Overlay.GridHighlightConfig>; + private readonly scrollSnapHighlights: Map<Protocol.DOM.NodeId, Protocol.Overlay.ScrollSnapContainerHighlightConfig>; + private readonly flexHighlights: Map<Protocol.DOM.NodeId, Protocol.Overlay.FlexContainerHighlightConfig>; + private readonly containerQueryHighlights: + Map<Protocol.DOM.NodeId, Protocol.Overlay.ContainerQueryContainerHighlightConfig>; + private readonly colors: Map<Protocol.DOM.NodeId, Common.Color.Color>; private gridColorGenerator: OverlayColorGenerator; private flexColorGenerator: OverlayColorGenerator; private flexEnabled: boolean; @@ -60,7 +61,7 @@ this.resetOverlay(); } - private buildGridHighlightConfig(nodeId: number): Protocol.Overlay.GridHighlightConfig { + private buildGridHighlightConfig(nodeId: Protocol.DOM.NodeId): Protocol.Overlay.GridHighlightConfig { const mainColor = this.colorOfGrid(nodeId); const background = mainColor.setAlpha(0.1); const gapBackground = mainColor.setAlpha(0.3); @@ -92,7 +93,8 @@ }; } - private buildFlexContainerHighlightConfig(nodeId: number): Protocol.Overlay.FlexContainerHighlightConfig { + private buildFlexContainerHighlightConfig(nodeId: Protocol.DOM.NodeId): + Protocol.Overlay.FlexContainerHighlightConfig { const mainColor = this.colorOfFlex(nodeId); return { containerBorder: {color: mainColor.toProtocolRGBA(), pattern: Protocol.Overlay.LineStylePattern.Dashed}, @@ -116,16 +118,16 @@ }; } - highlightGridInOverlay(nodeId: number): void { + highlightGridInOverlay(nodeId: Protocol.DOM.NodeId): void { this.gridHighlights.set(nodeId, this.buildGridHighlightConfig(nodeId)); this.updateHighlightsInOverlay(); } - isGridHighlighted(nodeId: number): boolean { + isGridHighlighted(nodeId: Protocol.DOM.NodeId): boolean { return this.gridHighlights.has(nodeId); } - colorOfGrid(nodeId: number): Common.Color.Color { + colorOfGrid(nodeId: Protocol.DOM.NodeId): Common.Color.Color { let color = this.colors.get(nodeId); if (!color) { color = this.gridColorGenerator.next(); @@ -135,43 +137,43 @@ return color; } - setColorOfGrid(nodeId: number, color: Common.Color.Color): void { + setColorOfGrid(nodeId: Protocol.DOM.NodeId, color: Common.Color.Color): void { this.colors.set(nodeId, color); } - hideGridInOverlay(nodeId: number): void { + hideGridInOverlay(nodeId: Protocol.DOM.NodeId): void { if (this.gridHighlights.has(nodeId)) { this.gridHighlights.delete(nodeId); this.updateHighlightsInOverlay(); } } - highlightScrollSnapInOverlay(nodeId: number): void { + highlightScrollSnapInOverlay(nodeId: Protocol.DOM.NodeId): void { this.scrollSnapHighlights.set(nodeId, this.buildScrollSnapContainerHighlightConfig(nodeId)); this.updateHighlightsInOverlay(); } - isScrollSnapHighlighted(nodeId: number): boolean { + isScrollSnapHighlighted(nodeId: Protocol.DOM.NodeId): boolean { return this.scrollSnapHighlights.has(nodeId); } - hideScrollSnapInOverlay(nodeId: number): void { + hideScrollSnapInOverlay(nodeId: Protocol.DOM.NodeId): void { if (this.scrollSnapHighlights.has(nodeId)) { this.scrollSnapHighlights.delete(nodeId); this.updateHighlightsInOverlay(); } } - highlightFlexInOverlay(nodeId: number): void { + highlightFlexInOverlay(nodeId: Protocol.DOM.NodeId): void { this.flexHighlights.set(nodeId, this.buildFlexContainerHighlightConfig(nodeId)); this.updateHighlightsInOverlay(); } - isFlexHighlighted(nodeId: number): boolean { + isFlexHighlighted(nodeId: Protocol.DOM.NodeId): boolean { return this.flexHighlights.has(nodeId); } - colorOfFlex(nodeId: number): Common.Color.Color { + colorOfFlex(nodeId: Protocol.DOM.NodeId): Common.Color.Color { let color = this.colors.get(nodeId); if (!color) { color = this.flexColorGenerator.next(); @@ -181,30 +183,30 @@ return color; } - setColorOfFlex(nodeId: number, color: Common.Color.Color): void { + setColorOfFlex(nodeId: Protocol.DOM.NodeId, color: Common.Color.Color): void { this.colors.set(nodeId, color); } - hideFlexInOverlay(nodeId: number): void { + hideFlexInOverlay(nodeId: Protocol.DOM.NodeId): void { if (this.flexHighlights.has(nodeId)) { this.flexHighlights.delete(nodeId); this.updateHighlightsInOverlay(); } } - highlightContainerQueryInOverlay(nodeId: number): void { + highlightContainerQueryInOverlay(nodeId: Protocol.DOM.NodeId): void { this.containerQueryHighlights.set(nodeId, this.buildContainerQueryContainerHighlightConfig()); this.updateHighlightsInOverlay(); } - hideContainerQueryInOverlay(nodeId: number): void { + hideContainerQueryInOverlay(nodeId: Protocol.DOM.NodeId): void { if (this.containerQueryHighlights.has(nodeId)) { this.containerQueryHighlights.delete(nodeId); this.updateHighlightsInOverlay(); } } - isContainerQueryHighlighted(nodeId: number): boolean { + isContainerQueryHighlighted(nodeId: Protocol.DOM.NodeId): boolean { return this.containerQueryHighlights.has(nodeId); } @@ -239,7 +241,7 @@ } } - private updateHighlightsForDeletedNodes(highlights: Map<number, unknown>): boolean { + private updateHighlightsForDeletedNodes(highlights: Map<Protocol.DOM.NodeId, unknown>): boolean { let needsUpdate = false; for (const nodeId of highlights.keys()) { if (this.model.getDOMModel().nodeForId(nodeId) === null) { @@ -320,7 +322,7 @@ * @interface */ export interface DOMModel { - nodeForId(nodeId: number): void; + nodeForId(nodeId: Protocol.DOM.NodeId): void; } /** * @interface
diff --git a/front_end/legacy_test_runner/elements_test_runner/ElementsTestRunner.js b/front_end/legacy_test_runner/elements_test_runner/ElementsTestRunner.js index c3087a3..afdf846 100644 --- a/front_end/legacy_test_runner/elements_test_runner/ElementsTestRunner.js +++ b/front_end/legacy_test_runner/elements_test_runner/ElementsTestRunner.js
@@ -1304,7 +1304,7 @@ ElementsTestRunner.getDocumentElements = function() { const map = TestRunner.domModel.idToDOMNode; - const documents = Object.values(map).filter(n => n instanceof SDK.DOMDocument); + const documents = Array.from(map.values()).filter(n => n instanceof SDK.DOMDocument); return documents; }; @@ -1314,5 +1314,5 @@ }; ElementsTestRunner.mappedNodes = function() { - return Object.entries(TestRunner.domModel.idToDOMNode); + return TestRunner.domModel.idToDOMNode.entries(); };
diff --git a/test/unittests/front_end/core/sdk/OverlayPersistentHighlighter_test.ts b/test/unittests/front_end/core/sdk/OverlayPersistentHighlighter_test.ts index 1309cea..cbd7fa2 100644 --- a/test/unittests/front_end/core/sdk/OverlayPersistentHighlighter_test.ts +++ b/test/unittests/front_end/core/sdk/OverlayPersistentHighlighter_test.ts
@@ -6,6 +6,7 @@ import * as Common from '../../../../../front_end/core/common/common.js'; import type * as SDKModule from '../../../../../front_end/core/sdk/sdk.js'; +import type * as Protocol from '../../../../../front_end/generated/protocol.js'; import {describeWithEnvironment} from '../../helpers/EnvironmentHelpers.js'; describeWithEnvironment('OverlayColorGenerator', () => { @@ -37,9 +38,10 @@ setShowViewportSizeOnResize() {}, }; + const nodeId = 1 as Protocol.DOM.NodeId; + it('is able to highlight flexbox elements', () => { const highlighter = new SDK.OverlayPersistentHighlighter.OverlayPersistentHighlighter(mockModel); - const nodeId = 1; highlighter.highlightFlexInOverlay(nodeId); assert(highlighter.isFlexHighlighted(nodeId)); assert(!highlighter.isGridHighlighted(nodeId)); @@ -50,7 +52,6 @@ it('is able to highlight grid elements', () => { const highlighter = new SDK.OverlayPersistentHighlighter.OverlayPersistentHighlighter(mockModel); - const nodeId = 1; highlighter.highlightGridInOverlay(nodeId); assert(highlighter.isGridHighlighted(nodeId)); assert(!highlighter.isFlexHighlighted(nodeId)); @@ -61,7 +62,6 @@ it('is able to highlight scroll snap elements', () => { const highlighter = new SDK.OverlayPersistentHighlighter.OverlayPersistentHighlighter(mockModel); - const nodeId = 1; highlighter.highlightScrollSnapInOverlay(nodeId); assert(highlighter.isScrollSnapHighlighted(nodeId)); assert(!highlighter.isFlexHighlighted(nodeId)); @@ -72,7 +72,6 @@ it('is able to highlight container query elements', () => { const highlighter = new SDK.OverlayPersistentHighlighter.OverlayPersistentHighlighter(mockModel); - const nodeId = 1; highlighter.highlightContainerQueryInOverlay(nodeId); assert(highlighter.isContainerQueryHighlighted(nodeId)); assert(!highlighter.isFlexHighlighted(nodeId));