@mcp-b/chrome-devtools-mcp 2.1.0 → 2.2.0

package/build/vendor/chrome-devtools-frontend/front_end/models/trace/handlers/FramesHandler.js

@@ -1,485 +0,0 @@
-// Copyright 2023 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Platform from '../../../core/platform/platform.js';
-import * as Helpers from '../helpers/helpers.js';
-import * as Types from '../types/types.js';
-import { data as auctionWorkletsData } from './AuctionWorkletsHandler.js';
-import { data as layerTreeHandlerData } from './LayerTreeHandler.js';
-import { data as metaHandlerData } from './MetaHandler.js';
-import { data as rendererHandlerData } from './RendererHandler.js';
-import * as Threads from './Threads.js';
-/**
- * IMPORTANT: this handler is slightly different to the rest. This is because
- * it is an adaptation of the TimelineFrameModel that has been used in DevTools
- * for many years. Rather than re-implement all the logic from scratch, instead
- * this handler gathers up the events and instantitates the class in the
- * finalize() method. Once the class has parsed all events, it is used to then
- * return the array of frames.
- *
- * In time we expect to migrate this code to a more "typical" handler.
- */
-let model = null;
-let relevantFrameEvents = [];
-function isFrameEvent(event) {
-    return (Types.Events.isSetLayerId(event) || Types.Events.isBeginFrame(event) || Types.Events.isDroppedFrame(event) ||
-        Types.Events.isRequestMainThreadFrame(event) || Types.Events.isBeginMainThreadFrame(event) ||
-        Types.Events.isNeedsBeginFrameChanged(event) ||
-        // Note that "Commit" is the replacement for "CompositeLayers" so in a trace
-        // we wouldn't expect to see a combination of these. All "new" trace
-        // recordings use "Commit", but we can easily support "CompositeLayers" too
-        // to not break older traces being imported.
-        Types.Events.isCommit(event) || Types.Events.isCompositeLayers(event) ||
-        Types.Events.isActivateLayerTree(event) || Types.Events.isDrawFrame(event));
-}
-function entryIsTopLevel(entry) {
-    const devtoolsTimelineCategory = 'disabled-by-default-devtools.timeline';
-    return entry.name === "RunTask" /* Types.Events.Name.RUN_TASK */ && entry.cat.includes(devtoolsTimelineCategory);
-}
-const MAIN_FRAME_MARKERS = new Set([
-    "ScheduleStyleRecalculation" /* Types.Events.Name.SCHEDULE_STYLE_RECALCULATION */,
-    "InvalidateLayout" /* Types.Events.Name.INVALIDATE_LAYOUT */,
-    "BeginMainThreadFrame" /* Types.Events.Name.BEGIN_MAIN_THREAD_FRAME */,
-    "ScrollLayer" /* Types.Events.Name.SCROLL_LAYER */,
-]);
-export function reset() {
-    model = null;
-    relevantFrameEvents = [];
-}
-export function handleEvent(event) {
-    // This might seem like a wide set of events to filter for, but these are all
-    // the types of events that we care about in the TimelineFrameModel class at
-    // the bottom of this file. Previously we would take a copy of an array of
-    // all trace events, but on a few test traces, this set of filtered events
-    // accounts for about 10% of the total events, so it's a big performance win
-    // to deal with a much smaller subset of the data.
-    if (isFrameEvent(event) || Types.Events.isLayerTreeHostImplSnapshot(event) || entryIsTopLevel(event) ||
-        MAIN_FRAME_MARKERS.has(event.name) || Types.Events.isPaint(event)) {
-        relevantFrameEvents.push(event);
-    }
-}
-export async function finalize() {
-    // We have to sort the events by timestamp, because the model code expects to
-    // process events in order.
-    Helpers.Trace.sortTraceEventsInPlace(relevantFrameEvents);
-    const modelForTrace = new TimelineFrameModel(relevantFrameEvents, rendererHandlerData(), auctionWorkletsData(), metaHandlerData(), layerTreeHandlerData());
-    model = modelForTrace;
-}
-export function data() {
-    return {
-        frames: model?.frames() ?? [],
-        framesById: model?.framesById() ?? {},
-    };
-}
-export function deps() {
-    return ['Meta', 'Renderer', 'AuctionWorklets', 'LayerTree'];
-}
-export class TimelineFrameModel {
-    #frames = [];
-    #frameById = {};
-    #beginFrameQueue = new TimelineFrameBeginFrameQueue();
-    #lastFrame = null;
-    #mainFrameCommitted = false;
-    #mainFrameRequested = false;
-    #lastLayerTree = null;
-    #framePendingActivation = null;
-    #framePendingCommit = null;
-    #lastBeginFrame = null;
-    #lastNeedsBeginFrame = null;
-    #lastTaskBeginTime = null;
-    #layerTreeId = null;
-    #activeProcessId = null;
-    #activeThreadId = null;
-    #layerTreeData;
-    constructor(allEvents, rendererData, auctionWorkletsData, metaData, layerTreeData) {
-        // We only care about getting threads from the Renderer, not Samples,
-        // because Frames don't exist in a CPU Profile (which won't have Renderer
-        // threads.)
-        const mainThreads = Threads.threadsInRenderer(rendererData, auctionWorkletsData).filter(thread => {
-            return thread.type === "MAIN_THREAD" /* Threads.ThreadType.MAIN_THREAD */ && thread.processIsOnMainFrame;
-        });
-        const threadData = mainThreads.map(thread => {
-            return {
-                tid: thread.tid,
-                pid: thread.pid,
-                startTime: thread.entries[0].ts,
-            };
-        });
-        this.#layerTreeData = layerTreeData;
-        this.#addTraceEvents(allEvents, threadData, metaData.mainFrameId);
-    }
-    framesById() {
-        return this.#frameById;
-    }
-    frames() {
-        return this.#frames;
-    }
-    #handleBeginFrame(startTime, seqId) {
-        if (!this.#lastFrame) {
-            this.#startFrame(startTime, seqId);
-        }
-        this.#lastBeginFrame = startTime;
-        this.#beginFrameQueue.addFrameIfNotExists(seqId, startTime, false, false);
-    }
-    #handleDroppedFrame(startTime, seqId, isPartial) {
-        if (!this.#lastFrame) {
-            this.#startFrame(startTime, seqId);
-        }
-        // This line handles the case where no BeginFrame event is issued for
-        // the dropped frame. In this situation, add a BeginFrame to the queue
-        // as if it actually occurred.
-        this.#beginFrameQueue.addFrameIfNotExists(seqId, startTime, true, isPartial);
-        this.#beginFrameQueue.setDropped(seqId, true);
-        this.#beginFrameQueue.setPartial(seqId, isPartial);
-    }
-    #handleDrawFrame(startTime, seqId) {
-        if (!this.#lastFrame) {
-            this.#startFrame(startTime, seqId);
-            return;
-        }
-        // - if it wasn't drawn, it didn't happen!
-        // - only show frames that either did not wait for the main thread frame or had one committed.
-        if (this.#mainFrameCommitted || !this.#mainFrameRequested) {
-            if (this.#lastNeedsBeginFrame) {
-                const idleTimeEnd = this.#framePendingActivation ? this.#framePendingActivation.triggerTime :
-                    (this.#lastBeginFrame || this.#lastNeedsBeginFrame);
-                if (idleTimeEnd > this.#lastFrame.startTime) {
-                    this.#lastFrame.idle = true;
-                    this.#lastBeginFrame = null;
-                }
-                this.#lastNeedsBeginFrame = null;
-            }
-            const framesToVisualize = this.#beginFrameQueue.processPendingBeginFramesOnDrawFrame(seqId);
-            // Visualize the current frame and all pending frames before it.
-            for (const frame of framesToVisualize) {
-                const isLastFrameIdle = this.#lastFrame.idle;
-                // If |frame| is the first frame after an idle period, the CPU time
-                // will be logged ("committed") under |frame| if applicable.
-                this.#startFrame(frame.startTime, seqId);
-                if (isLastFrameIdle && this.#framePendingActivation) {
-                    this.#commitPendingFrame();
-                }
-                if (frame.isDropped) {
-                    this.#lastFrame.dropped = true;
-                }
-                if (frame.isPartial) {
-                    this.#lastFrame.isPartial = true;
-                }
-            }
-        }
-        this.#mainFrameCommitted = false;
-    }
-    #handleActivateLayerTree() {
-        if (!this.#lastFrame) {
-            return;
-        }
-        if (this.#framePendingActivation && !this.#lastNeedsBeginFrame) {
-            this.#commitPendingFrame();
-        }
-    }
-    #handleRequestMainThreadFrame() {
-        if (!this.#lastFrame) {
-            return;
-        }
-        this.#mainFrameRequested = true;
-    }
-    #handleCommit() {
-        if (!this.#framePendingCommit) {
-            return;
-        }
-        this.#framePendingActivation = this.#framePendingCommit;
-        this.#framePendingCommit = null;
-        this.#mainFrameRequested = false;
-        this.#mainFrameCommitted = true;
-    }
-    #handleLayerTreeSnapshot(layerTree) {
-        this.#lastLayerTree = layerTree;
-    }
-    #handleNeedFrameChanged(startTime, needsBeginFrame) {
-        if (needsBeginFrame) {
-            this.#lastNeedsBeginFrame = startTime;
-        }
-    }
-    #startFrame(startTime, seqId) {
-        if (this.#lastFrame) {
-            this.#flushFrame(this.#lastFrame, startTime);
-        }
-        this.#lastFrame =
-            new TimelineFrame(seqId, startTime, Types.Timing.Micro(startTime - metaHandlerData().traceBounds.min));
-    }
-    #flushFrame(frame, endTime) {
-        frame.setLayerTree(this.#lastLayerTree);
-        frame.setEndTime(endTime);
-        if (this.#lastLayerTree) {
-            this.#lastLayerTree.paints = frame.paints;
-        }
-        const lastFrame = this.#frames[this.#frames.length - 1];
-        if (this.#frames.length && lastFrame &&
-            (frame.startTime !== lastFrame.endTime || frame.startTime > frame.endTime)) {
-            console.assert(false, `Inconsistent frame time for frame ${this.#frames.length} (${frame.startTime} - ${frame.endTime})`);
-        }
-        const newFramesLength = this.#frames.push(frame);
-        frame.setIndex(newFramesLength - 1);
-        if (typeof frame.mainFrameId === 'number') {
-            this.#frameById[frame.mainFrameId] = frame;
-        }
-    }
-    #commitPendingFrame() {
-        if (!this.#framePendingActivation || !this.#lastFrame) {
-            return;
-        }
-        this.#lastFrame.paints = this.#framePendingActivation.paints;
-        this.#lastFrame.mainFrameId = this.#framePendingActivation.mainFrameId;
-        this.#framePendingActivation = null;
-    }
-    #addTraceEvents(events, threadData, mainFrameId) {
-        let j = 0;
-        this.#activeThreadId = threadData.length && threadData[0].tid || null;
-        this.#activeProcessId = threadData.length && threadData[0].pid || null;
-        for (let i = 0; i < events.length; ++i) {
-            while (j + 1 < threadData.length && threadData[j + 1].startTime <= events[i].ts) {
-                this.#activeThreadId = threadData[++j].tid;
-                this.#activeProcessId = threadData[j].pid;
-            }
-            this.#addTraceEvent(events[i], mainFrameId);
-        }
-        this.#activeThreadId = null;
-        this.#activeProcessId = null;
-    }
-    #addTraceEvent(event, mainFrameId) {
-        if (Types.Events.isSetLayerId(event) && event.args.data.frame === mainFrameId) {
-            this.#layerTreeId = event.args.data.layerTreeId;
-        }
-        else if (Types.Events.isLayerTreeHostImplSnapshot(event) && Number(event.id) === this.#layerTreeId) {
-            this.#handleLayerTreeSnapshot({
-                entry: event,
-                paints: [],
-            });
-        }
-        else {
-            if (isFrameEvent(event)) {
-                this.#processCompositorEvents(event);
-            }
-            // Make sure we only use events from the main thread: we check the PID as
-            // well in case two processes have a thread with the same TID.
-            if (event.tid === this.#activeThreadId && event.pid === this.#activeProcessId) {
-                this.#addMainThreadTraceEvent(event);
-            }
-        }
-    }
-    #processCompositorEvents(entry) {
-        if (entry.args['layerTreeId'] !== this.#layerTreeId) {
-            return;
-        }
-        if (Types.Events.isBeginFrame(entry)) {
-            this.#handleBeginFrame(entry.ts, entry.args['frameSeqId']);
-        }
-        else if (Types.Events.isDrawFrame(entry)) {
-            this.#handleDrawFrame(entry.ts, entry.args['frameSeqId']);
-        }
-        else if (Types.Events.isActivateLayerTree(entry)) {
-            this.#handleActivateLayerTree();
-        }
-        else if (Types.Events.isRequestMainThreadFrame(entry)) {
-            this.#handleRequestMainThreadFrame();
-        }
-        else if (Types.Events.isNeedsBeginFrameChanged(entry)) {
-            // needsBeginFrame property will either be 0 or 1, which represents
-            // true/false in this case, hence the Boolean() wrapper.
-            this.#handleNeedFrameChanged(entry.ts, entry.args['data'] && Boolean(entry.args['data']['needsBeginFrame']));
-        }
-        else if (Types.Events.isDroppedFrame(entry)) {
-            this.#handleDroppedFrame(entry.ts, entry.args['frameSeqId'], Boolean(entry.args['hasPartialUpdate']));
-        }
-    }
-    #addMainThreadTraceEvent(entry) {
-        if (entryIsTopLevel(entry)) {
-            this.#lastTaskBeginTime = entry.ts;
-        }
-        if (!this.#framePendingCommit && MAIN_FRAME_MARKERS.has(entry.name)) {
-            this.#framePendingCommit = new PendingFrame(this.#lastTaskBeginTime || entry.ts);
-        }
-        if (!this.#framePendingCommit) {
-            return;
-        }
-        if (Types.Events.isBeginMainThreadFrame(entry) && entry.args.data.frameId) {
-            this.#framePendingCommit.mainFrameId = entry.args.data.frameId;
-        }
-        if (Types.Events.isPaint(entry)) {
-            const snapshot = this.#layerTreeData.paintsToSnapshots.get(entry);
-            if (snapshot) {
-                this.#framePendingCommit.paints.push(new LayerPaintEvent(entry, snapshot));
-            }
-        }
-        // Commit will be replacing CompositeLayers but CompositeLayers is kept
-        // around for backwards compatibility.
-        if ((Types.Events.isCompositeLayers(entry) || Types.Events.isCommit(entry)) &&
-            entry.args['layerTreeId'] === this.#layerTreeId) {
-            this.#handleCommit();
-        }
-    }
-}
-/**
- * Legacy class that represents TimelineFrames that was ported from the old SDK.
- * This class is purposefully not exported as it breaks the abstraction that
- * every event shown on the timeline is a trace event. Instead, we use the Type
- * LegacyTimelineFrame to represent frames in the codebase. These do implement
- * the right interface to be treated just like they were a trace event.
- */
-class TimelineFrame {
-    // These fields exist to satisfy the base Event type which all
-    // "trace events" must implement. They aren't used, but doing this means we
-    // can pass `TimelineFrame` instances into places that expect
-    // Types.Events.Event.
-    cat = 'devtools.legacy_frame';
-    name = 'frame';
-    ph = "X" /* Types.Events.Phase.COMPLETE */;
-    ts;
-    pid = Types.Events.ProcessID(-1);
-    tid = Types.Events.ThreadID(-1);
-    index = -1;
-    startTime;
-    startTimeOffset;
-    endTime;
-    duration;
-    idle;
-    dropped;
-    isPartial;
-    layerTree;
-    paints;
-    mainFrameId;
-    seqId;
-    constructor(seqId, startTime, startTimeOffset) {
-        this.seqId = seqId;
-        this.startTime = startTime;
-        this.ts = startTime;
-        this.startTimeOffset = startTimeOffset;
-        this.endTime = this.startTime;
-        this.duration = Types.Timing.Micro(0);
-        this.idle = false;
-        this.dropped = false;
-        this.isPartial = false;
-        this.layerTree = null;
-        this.paints = [];
-        this.mainFrameId = undefined;
-    }
-    setIndex(i) {
-        this.index = i;
-    }
-    setEndTime(endTime) {
-        this.endTime = endTime;
-        this.duration = Types.Timing.Micro(this.endTime - this.startTime);
-    }
-    setLayerTree(layerTree) {
-        this.layerTree = layerTree;
-    }
-    /**
-     * Fake the `dur` field to meet the expected value given that we pretend
-     * these TimelineFrame classes are trace events across the codebase.
-     */
-    get dur() {
-        return this.duration;
-    }
-}
-export class LayerPaintEvent {
-    #event;
-    #snapshot;
-    constructor(event, snapshot) {
-        this.#event = event;
-        this.#snapshot = snapshot;
-    }
-    layerId() {
-        return this.#event.args.data.layerId;
-    }
-    event() {
-        return this.#event;
-    }
-    picture() {
-        const rect = this.#snapshot.args.snapshot.params?.layer_rect;
-        const pictureData = this.#snapshot.args.snapshot.skp64;
-        return rect && pictureData ? { rect, serializedPicture: pictureData } : null;
-    }
-}
-export class PendingFrame {
-    paints;
-    mainFrameId;
-    triggerTime;
-    constructor(triggerTime) {
-        this.paints = [];
-        this.mainFrameId = undefined;
-        this.triggerTime = triggerTime;
-    }
-}
-/** The parameters of an impl-side BeginFrame. **/
-class BeginFrameInfo {
-    seqId;
-    startTime;
-    isDropped;
-    isPartial;
-    constructor(seqId, startTime, isDropped, isPartial) {
-        this.seqId = seqId;
-        this.startTime = startTime;
-        this.isDropped = isDropped;
-        this.isPartial = isPartial;
-    }
-}
-/**
- * A queue of BeginFrames pending visualization.
- * BeginFrames are added into this queue as they occur; later when their
- * corresponding DrawFrames occur (or lack thereof), the BeginFrames are removed
- * from the queue and their timestamps are used for visualization.
- **/
-export class TimelineFrameBeginFrameQueue {
-    queueFrames = [];
-    // Maps frameSeqId to BeginFrameInfo.
-    mapFrames = {};
-    // Add a BeginFrame to the queue, if it does not already exit.
-    addFrameIfNotExists(seqId, startTime, isDropped, isPartial) {
-        if (!(seqId in this.mapFrames)) {
-            this.mapFrames[seqId] = new BeginFrameInfo(seqId, startTime, isDropped, isPartial);
-            this.queueFrames.push(seqId);
-        }
-    }
-    // Set a BeginFrame in queue as dropped.
-    setDropped(seqId, isDropped) {
-        if (seqId in this.mapFrames) {
-            this.mapFrames[seqId].isDropped = isDropped;
-        }
-    }
-    setPartial(seqId, isPartial) {
-        if (seqId in this.mapFrames) {
-            this.mapFrames[seqId].isPartial = isPartial;
-        }
-    }
-    processPendingBeginFramesOnDrawFrame(seqId) {
-        const framesToVisualize = [];
-        // Do not visualize this frame in the rare case where the current DrawFrame
-        // does not have a corresponding BeginFrame.
-        if (seqId in this.mapFrames) {
-            // Pop all BeginFrames before the current frame, and add only the dropped
-            // ones in |frames_to_visualize|.
-            // Non-dropped frames popped here are BeginFrames that are never
-            // drawn (but not considered dropped either for some reason).
-            // Those frames do not require an proactive visualization effort and will
-            // be naturally presented as continuationss of other frames.
-            while (this.queueFrames[0] !== seqId) {
-                const currentSeqId = this.queueFrames[0];
-                if (this.mapFrames[currentSeqId].isDropped) {
-                    framesToVisualize.push(this.mapFrames[currentSeqId]);
-                }
-                delete this.mapFrames[currentSeqId];
-                this.queueFrames.shift();
-            }
-            // Pop the BeginFrame associated with the current DrawFrame.
-            framesToVisualize.push(this.mapFrames[seqId]);
-            delete this.mapFrames[seqId];
-            this.queueFrames.shift();
-        }
-        return framesToVisualize;
-    }
-}
-export function framesWithinWindow(frames, startTime, endTime) {
-    const firstFrame = Platform.ArrayUtilities.lowerBound(frames, startTime || 0, (time, frame) => time - frame.endTime);
-    const lastFrame = Platform.ArrayUtilities.lowerBound(frames, endTime || Infinity, (time, frame) => time - frame.startTime);
-    return frames.slice(firstFrame, lastFrame);
-}

package/build/vendor/chrome-devtools-frontend/front_end/models/trace/handlers/GPUHandler.js

@@ -1,35 +0,0 @@
-// Copyright 2022 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Helpers from '../helpers/helpers.js';
-import * as Types from '../types/types.js';
-import { data as metaHandlerData } from './MetaHandler.js';
-// Each thread contains events. Events indicate the thread and process IDs, which are
-// used to store the event in the correct process thread entry below.
-let eventsInProcessThread = new Map();
-let mainGPUThreadTasks = [];
-export function reset() {
-    eventsInProcessThread = new Map();
-    mainGPUThreadTasks = [];
-}
-export function handleEvent(event) {
-    if (!Types.Events.isGPUTask(event)) {
-        return;
-    }
-    Helpers.Trace.addEventToProcessThread(event, eventsInProcessThread);
-}
-export async function finalize() {
-    const { gpuProcessId, gpuThreadId } = metaHandlerData();
-    const gpuThreadsForProcess = eventsInProcessThread.get(gpuProcessId);
-    if (gpuThreadsForProcess && gpuThreadId) {
-        mainGPUThreadTasks = gpuThreadsForProcess.get(gpuThreadId) || [];
-    }
-}
-export function data() {
-    return {
-        mainGPUThreadTasks,
-    };
-}
-export function deps() {
-    return ['Meta'];
-}

package/build/vendor/chrome-devtools-frontend/front_end/models/trace/handlers/ImagePaintingHandler.js

@@ -1,147 +0,0 @@
-// Copyright 2024 The Chromium Authors
-// Use of this source code is governed by a BSD-style license that can be
-// found in the LICENSE file.
-import * as Platform from '../../../core/platform/platform.js';
-import * as Types from '../types/types.js';
-import { data as metaHandlerData } from './MetaHandler.js';
-/**
- * This handler is responsible for the relationships between:
- * DecodeImage/ResizeImage, PaintImage and DrawLazyPixelRef events.
- *
- * When we get a DecodeImage event, we want to associate it to a PaintImage
- * event, primarily so we can determine the NodeID of the image that was
- * decoded.
- * We can do this in two ways:
- *
- * 1. If there is a PaintImage event on the same thread, use that
- *    (if there are multiple, use the latest one).
- *
- * 2. If not, we can find the DecodeLazyPixelRef event on the same thread, and
- *    use the PaintImage event associated with it via the `LazyPixelRef` key.
- */
-// Track paintImageEvents across threads.
-let paintImageEvents = new Map();
-let decodeLazyPixelRefEvents = new Map();
-// A DrawLazyPixelRef event will contain a numerical reference in
-// args.LazyPixelRef. As we parse each DrawLazyPixelRef, we can assign it to a
-// paint event. Later we want to look up paint events by this reference, so we
-// store them in this map.
-let paintImageByLazyPixelRef = new Map();
-// When we find events that we want to tie to a particular PaintImage event, we add them to this map.
-// These are currently only DecodeImage and ResizeImage events, but the type is
-// deliberately generic as in the future we might want to add more events that
-// have a relationship to a individual PaintImage event.
-let eventToPaintImage = new Map();
-let urlToPaintImage = new Map();
-let paintEventToCorrectedDisplaySize = new Map();
-let didCorrectForHostDpr = false;
-export function reset() {
-    paintImageEvents = new Map();
-    decodeLazyPixelRefEvents = new Map();
-    paintImageByLazyPixelRef = new Map();
-    eventToPaintImage = new Map();
-    urlToPaintImage = new Map();
-    paintEventToCorrectedDisplaySize = new Map();
-    didCorrectForHostDpr = false;
-}
-export function handleEvent(event) {
-    if (Types.Events.isPaintImage(event)) {
-        const forProcess = paintImageEvents.get(event.pid) || new Map();
-        const forThread = forProcess.get(event.tid) || [];
-        forThread.push(event);
-        forProcess.set(event.tid, forThread);
-        paintImageEvents.set(event.pid, forProcess);
-        if (event.args.data.url) {
-            const paintsForUrl = Platform.MapUtilities.getWithDefault(urlToPaintImage, event.args.data.url, () => []);
-            paintsForUrl.push(event);
-        }
-        return;
-    }
-    if (Types.Events.isDecodeLazyPixelRef(event) && typeof event.args?.LazyPixelRef !== 'undefined') {
-        // Store these because we use them to tie DecodeImage to a PaintEvent.
-        const forProcess = decodeLazyPixelRefEvents.get(event.pid) || new Map();
-        const forThread = forProcess.get(event.tid) || [];
-        forThread.push(event);
-        forProcess.set(event.tid, forThread);
-        decodeLazyPixelRefEvents.set(event.pid, forProcess);
-    }
-    // If we see a DrawLazyPixelRef event, we need to find the last PaintImage
-    // event on the thread and associate it to the LazyPixelRef that is supplied
-    // in the DrawLazyPixelRef event.
-    // This means that later on if we see a DecodeLazyPixelRef event with the
-    // same LazyPixelRef key, we can find its associated PaintImage event by
-    // looking it up.
-    if (Types.Events.isDrawLazyPixelRef(event) && typeof event.args?.LazyPixelRef !== 'undefined') {
-        const lastPaintEvent = paintImageEvents.get(event.pid)?.get(event.tid)?.at(-1);
-        if (!lastPaintEvent) {
-            return;
-        }
-        paintImageByLazyPixelRef.set(event.args.LazyPixelRef, lastPaintEvent);
-        return;
-    }
-    if (Types.Events.isDecodeImage(event)) {
-        // When we see a DecodeImage, we want to associate it to a PaintImage
-        // event. We try two approaches:
-        //
-        // 1. If the thread of the DecodeImage event has a previous PaintImage
-        // event, that is the associated event.
-        //
-        // 2. If that is false, we then look on the thread for a DecodeLazyPixelRef
-        // event. If we find that, we then look for its associated PaintImage
-        // event, which we associate via DrawLazyPixelRef events (the code block
-        // above this one)
-        //
-        // 1. Find a PaintImage event on the same thread. If we find it, that's our association done.
-        const lastPaintImageEventOnThread = paintImageEvents.get(event.pid)?.get(event.tid)?.at(-1);
-        if (lastPaintImageEventOnThread) {
-            eventToPaintImage.set(event, lastPaintImageEventOnThread);
-            return;
-        }
-        // 2. Find the last DecodeLazyPixelRef event and, if we find it, find its associated PaintImage event.
-        const lastDecodeLazyPixelRef = decodeLazyPixelRefEvents.get(event.pid)?.get(event.tid)?.at(-1);
-        if (typeof lastDecodeLazyPixelRef?.args?.LazyPixelRef === 'undefined') {
-            return;
-        }
-        const paintEvent = paintImageByLazyPixelRef.get(lastDecodeLazyPixelRef.args.LazyPixelRef);
-        if (!paintEvent) {
-            return;
-        }
-        eventToPaintImage.set(event, paintEvent);
-    }
-}
-export async function finalize(options) {
-    // Painting in Chrome never uses the emulated DPR, but instead used the host's DPR.
-    // We need to correct for that for our responsive image checks in the ImageDelivery
-    // insight.
-    // See: crbug.com/427552461 crbug.com/416580500#comment5
-    if (!options.metadata?.hostDPR) {
-        return;
-    }
-    // Note: this isn't necessarily emulated (for desktop+no DPR emulation, it's equal
-    // to host DPR).
-    const { devicePixelRatio: emulatedDpr } = metaHandlerData();
-    if (!emulatedDpr) {
-        return;
-    }
-    for (const byThread of paintImageEvents.values()) {
-        for (const paintEvents of byThread.values()) {
-            for (const paintEvent of paintEvents) {
-                const cssPixelsWidth = paintEvent.args.data.width / options.metadata.hostDPR;
-                const cssPixelsHeight = paintEvent.args.data.height / options.metadata.hostDPR;
-                const width = cssPixelsWidth * emulatedDpr;
-                const height = cssPixelsHeight * emulatedDpr;
-                paintEventToCorrectedDisplaySize.set(paintEvent, { width, height });
-            }
-        }
-    }
-    didCorrectForHostDpr = true;
-}
-export function data() {
-    return {
-        paintImageByDrawLazyPixelRef: paintImageByLazyPixelRef,
-        paintImageForEvent: eventToPaintImage,
-        paintImageEventForUrl: urlToPaintImage,
-        paintEventToCorrectedDisplaySize,
-        didCorrectForHostDpr,
-    };
-}