@react-native/debugger-frontend/dist/third-party/front_end/panels/timeline/timeline.js

Debugger frontend for React Native based on Chrome DevTools

import*as e from"../../core/i18n/i18n.js";import*as t from"../../models/trace/trace.js";import*as i from"../../ui/legacy/components/perf_ui/perf_ui.js";import*as n from"../../ui/legacy/theme_support/theme_support.js";import*as r from"../../core/platform/platform.js";import*as a from"../../services/trace_bounds/trace_bounds.js";import*as s from"./utils/utils.js";export{s as Utils};import*as o from"../../core/sdk/sdk.js";import*as l from"../../core/common/common.js";import*as d from"../../core/root/root.js";import*as c from"./components/components.js";import*as h from"./extensions/extensions.js";import*as p from"../../ui/components/helpers/helpers.js";import*as m from"../../ui/legacy/legacy.js";import*as u from"../../models/bindings/bindings.js";import*as g from"../../models/crux-manager/crux-manager.js";import*as v from"../../ui/visual_logging/visual_logging.js";import*as T from"./components/insights/insights.js";import*as y from"./overlays/components/components.js";import*as f from"./overlays/overlays.js";import*as S from"../../ui/legacy/components/utils/utils.js";import*as w from"../../ui/legacy/components/data_grid/data_grid.js";import*as b from"../../ui/components/code_highlighter/code_highlighter.js";import*as E from"../../ui/components/buttons/buttons.js";import*as C from"../../core/host/host.js";import*as k from"../../models/workspace/workspace.js";import*as I from"../../ui/components/adorners/adorners.js";import*as M from"../../ui/components/dialogs/dialogs.js";import*as x from"../../ui/components/legacy_wrapper/legacy_wrapper.js";import*as P from"../mobile_throttling/mobile_throttling.js";import*as R from"../../ui/components/menus/menus.js";import*as F from"../../models/emulation/emulation.js";import*as L from"../../models/extensions/extensions.js";import*as A from"../../models/live-metrics/live-metrics.js";import*as N from"../../ui/components/icon_button/icon_button.js";import*as D from"../layer_viewer/layer_viewer.js";import"../../ui/components/linkifier/linkifier.js";import{render as B,html as H}from"../../ui/lit/lit.js";const U={sSelfS:"{PH1} (self {PH2})"},O=e.i18n.registerUIStrings("panels/timeline/AppenderUtils.ts",U),_=e.i18n.getLocalizedString.bind(void 0,O);function W(e){const t={padding:4,height:17,collapsible:!0,color:n.ThemeSupport.instance().getComputedValue("--sys-color-on-surface"),backgroundColor:n.ThemeSupport.instance().getComputedValue("--sys-color-cdt-base-container"),nestingLevel:0,shareHeaderLine:!0};return Object.assign(t,e)}function V(e,t,i,n,r,a,s){const o={startLevel:t,name:i,style:n,selectable:r,expanded:a,showStackContextMenu:s};return null!==e&&(o.jslogContext=e),o}function G(i,n){if(!i)return"";const r=t.Helpers.Timing.microToMilli(i);if(void 0===n)return e.TimeUtilities.millisToString(r,!0);const a=t.Helpers.Timing.microToMilli(n),s=t.Types.Timing.Milli(1e-6);return Math.abs(r-a)>s&&a>s?_(U.sSelfS,{PH1:e.TimeUtilities.millisToString(r,!0),PH2:e.TimeUtilities.millisToString(a,!0)}):e.TimeUtilities.millisToString(r,!0)}function z(e,t){let i=0;const n=e.ts,r=e.ts+(e.dur||0);for(;i<t.length&&n<t[i];)++i;return t[i]=r,i}function j(e,t,i){const n=e.entryDecorations[t]||[];n.push(i),e.entryDecorations[t]=n}var $=Object.freeze({__proto__:null,addDecorationToEvent:j,buildGroupStyle:W,buildTrackHeader:V,getDurationString:G,getEventLevel:z});const K={animations:"Animations"},q=e.i18n.registerUIStrings("panels/timeline/AnimationsTrackAppender.ts",K),Y=e.i18n.getLocalizedString.bind(void 0,q);class J{appenderName="Animations";#e;#t;#i=this.#n.bind(this);constructor(e,t){this.#e=e,this.#t=t}appendTrackAtLevel(e,t){const i=this.#t.Animations.animations;return 0===i.length?e:(this.#r(e,t),this.#e.appendEventsAtLevel(i,e,this,this.#i))}#r(e,t){const i=W({useFirstLineForOverview:!1}),n=V("animations",e,Y(K.animations),i,!0,t);this.#e.registerTrackForGroup(n,this)}#n(e,i){if(e&&t.Types.Events.isSyntheticAnimation(e)){t.Insights.Models.CLSCulprits.getNonCompositedFailure(e).length&&j(this.#e.getFlameChartTimelineData(),i,{type:"WARNING_TRIANGLE"})}}colorForEvent(){return n.ThemeSupport.instance().getComputedValue("--app-color-rendering")}}var X=Object.freeze({__proto__:null,AnimationsTrackAppender:J});const Z={srEnterLabelEditMode:"Editing the annotation label text",srLabelTextUpdated:"Label updated to {PH1}",srTimeRangeBoundsUpdated:"Time range updated, starting at {PH1} and ending at {PH2}",timeRange:"time range",entryLabel:"entry label",entriesLink:"connected entries",srAnnotationRemoved:"The {PH1} annotation has been removed",srAnnotationAdded:"The {PH1} annotation has been added",srEntriesLinked:"The connected entries annotation now links from {PH1} to {PH2}"},Q=e.i18n.registerUIStrings("panels/timeline/AnnotationHelpers.ts",Z),ee=e.i18n.getLocalizedString.bind(void 0,Q);function te(e){const t=[];switch(e.type){case"ENTRY_LABEL":t.push(e.entry);break;case"TIME_RANGE":break;case"ENTRIES_LINK":t.push(e.entryFrom),e.entryTo&&t.push(e.entryTo);break;default:r.assertNever(e,"Unsupported annotation type")}return t}function ie(e){let i=null;const n=t.Types.Timing.Milli(1);switch(e.type){case"ENTRY_LABEL":{const r=e.entry.dur??t.Helpers.Timing.milliToMicro(n);i=t.Helpers.Timing.traceWindowFromMicroSeconds(e.entry.ts,t.Types.Timing.Micro(e.entry.ts+r));break}case"TIME_RANGE":i=e.bounds;break;case"ENTRIES_LINK":{if(!e.entryTo)break;const r=e.entryFrom.dur??n,a=e.entryTo.dur??n,s=e.entryFrom.ts+r,o=e.entryTo.ts+a,l=Math.max(s,o);i=t.Helpers.Timing.traceWindowFromMicroSeconds(e.entryFrom.ts,t.Types.Timing.Micro(l));break}default:r.assertNever(e,"Unsupported annotation type")}return i}function ne(e){return"TIME_RANGE"===e.type}function re(e){return"ENTRIES_LINK"===e.type}function ae(e){return"ENTRY_LABEL"===e.type}function se(e){return ne(e)?ee(Z.timeRange):re(e)?ee(Z.entriesLink):ae(e)&&e.label.length>0?ee(Z.entryLabel):null}function oe(i){const{overlay:n,action:o}=i;switch(o){case"Remove":{const e=se(n);if(e)return ee(Z.srAnnotationRemoved,{PH1:e});break}case"Add":{const e=se(n);if(e)return ee(Z.srAnnotationAdded,{PH1:e});break}case"UpdateLabel":{const e=function(e){return ne(e)||ae(e)?e.label:null}(n);if(e)return ee(Z.srLabelTextUpdated,{PH1:e});break}case"UpdateTimeRange":{if("TIME_RANGE"!==n.type)return"";const i=a.TraceBounds.BoundsManager.instance().state()?.micro.entireTraceBounds;if(!i)return"";const{min:r,max:s}=n.bounds,o=e.TimeUtilities.formatMicroSecondsAsMillisFixed(t.Types.Timing.Micro(r-i.min)),l=e.TimeUtilities.formatMicroSecondsAsMillisFixed(t.Types.Timing.Micro(s-i.min));return ee(Z.srTimeRangeBoundsUpdated,{PH1:o,PH2:l})}case"UpdateLinkToEntry":if(re(n)&&n.entryFrom&&n.entryTo){const e=s.EntryName.nameForEntry(n.entryFrom),t=s.EntryName.nameForEntry(n.entryTo);return ee(Z.srEntriesLinked,{PH1:e,PH2:t})}break;case"EnterLabelEditState":return ee(Z.srEnterLabelEditMode);default:r.assertNever(o,"Unsupported action for AnnotationModifiedEvent")}return null}var le=Object.freeze({__proto__:null,ariaAnnouncementForModifiedEvent:oe,ariaDescriptionForOverlay:se,getAnnotationEntries:te,getAnnotationWindow:ie,isEntriesLink:re,isEntryLabel:ae,isTimeRangeLabel:ne});class de extends Event{duration;static eventName="traceload";constructor(e){super(de.eventName,{bubbles:!0,composed:!0}),this.duration=e}}var ce=Object.freeze({__proto__:null,TraceLoadEvent:de});let he;class pe{static instance(e={forceNew:null}){const{forceNew:t}=e;return he&&!t||(he=new pe),he}linkify(e,t){const i=document.createElement("span"),n=e,{x:r,y:a,width:s,height:l}=n;return i.textContent=`Location: [${r},${a}], Size: [${s}x${l}]`,i.addEventListener("mouseover",(()=>o.OverlayModel.OverlayModel.highlightRect(n))),i.addEventListener("mouseleave",(()=>o.OverlayModel.OverlayModel.clearHighlight())),i}}var me=Object.freeze({__proto__:null,CLSRect:class{x;y;width;height;color;outlineColor;constructor([e,t,i,n]){this.x=e,this.y=t,this.width=i,this.height=n,this.color={r:238,g:111,b:99,a:.4},this.outlineColor={r:238,g:111,b:99,a:.7}}},Linkifier:pe});const ue={customTrackDescription:"This is a custom track added by a third party.",customTrackName:"{PH1} — Custom track"},ge=e.i18n.registerUIStrings("panels/timeline/ExtensionTrackAppender.ts",ue),ve=e.i18n.getLocalizedString.bind(void 0,ge);class Te{appenderName="Extension";#a;#e;constructor(e,t){this.#a=t,this.#e=e}appendTrackAtLevel(e,t){return 0===Object.values(this.#a.entriesByTrack).reduce(((e,t)=>t.length+e),0)?e:(this.#s(e,t),this.#o(e))}#s(e,t){const i=W({shareHeaderLine:!1,collapsible:!0}),n=V("extension",e,ve(ue.customTrackName,{PH1:this.#a.name}),i,!0,t);n.description=ve(ue.customTrackDescription),this.#e.registerTrackForGroup(n,this)}#l(e,t){const i=V("extension",e,t,W({shareHeaderLine:!1,padding:2,nestingLevel:1,collapsible:!0}),!0);this.#e.registerTrackForGroup(i,this)}#o(e){let t=e;for(const[e,i]of Object.entries(this.#a.entriesByTrack))this.#a.isTrackGroup&&this.#l(t,e),t=this.#e.appendEventsAtLevel(i,t,this);return t}colorForEvent(e){const i=n.ThemeSupport.instance().getComputedValue("--app-color-rendering");return t.Types.Extensions.isSyntheticExtensionEntry(e)?h.ExtensionUI.extensionEntryColor(e):i}titleForEvent(e){return e.name}setPopoverInfo(e,i){i.title=t.Types.Extensions.isSyntheticExtensionEntry(e)&&e.args.tooltipText?e.args.tooltipText:this.titleForEvent(e),i.formattedTime=G(e.dur)}}var ye=Object.freeze({__proto__:null,ExtensionTrackAppender:Te});const fe={gpu:"GPU"},Se=e.i18n.registerUIStrings("panels/timeline/GPUTrackAppender.ts",fe),we=e.i18n.getLocalizedString.bind(void 0,Se);class be{appenderName="GPU";#e;#t;constructor(e,t){this.#e=e,this.#t=t}appendTrackAtLevel(e,t){const i=this.#t.GPU.mainGPUThreadTasks;return 0===i.length?e:(this.#r(e,t),this.#e.appendEventsAtLevel(i,e,this))}#r(e,t){const i=W({collapsible:!1}),n=V("gpu",e,we(fe.gpu),i,!0,t);this.#e.registerTrackForGroup(n,this)}colorForEvent(e){if(!t.Types.Events.isGPUTask(e))throw new Error(`Unexpected GPU Task: The event's type is '${e.name}'`);return n.ThemeSupport.instance().getComputedValue("--app-color-painting")}}var Ee=Object.freeze({__proto__:null,GPUTrackAppender:be});const Ce={interactions:"Interactions"},ke=e.i18n.registerUIStrings("panels/timeline/InteractionsTrackAppender.ts",Ce),Ie=e.i18n.getLocalizedString.bind(void 0,ke);class Me{appenderName="Interactions";#d;#e;#t;constructor(e,t,i){this.#e=e,this.#d=i,this.#t=t}appendTrackAtLevel(e,t){return 0===this.#t.UserInteractions.interactionEvents.length?e:(this.#r(e,t),this.#c(e))}#r(e,t){const i=W({collapsible:this.#t.UserInteractions.interactionEvents.length>0,useDecoratorsForOverview:!0}),n=V("interactions",e,Ie(Ce.interactions),i,!0,t);this.#e.registerTrackForGroup(n,this)}#c(e){const{interactionEventsWithNoNesting:t,interactionsOverThreshold:i}=this.#t.UserInteractions;return this.#e.appendEventsAtLevel(t,e,this,((e,t)=>{i.has(e)&&void 0!==t&&this.#h(e,t)}))}#h(e,i){const n=this.#e.getFlameChartTimelineData().entryDecorations[i]||[];n.push({type:"CANDY",startAtTime:t.Handlers.ModelHandlers.UserInteractions.LONG_INTERACTION_THRESHOLD,endAtTime:e.processingEnd},{type:"WARNING_TRIANGLE",customEndTime:e.processingEnd}),this.#e.getFlameChartTimelineData().entryDecorations[i]=n}colorForEvent(e){let i=s.EntryName.nameForEntry(e,this.#t);return t.Types.Events.isSyntheticInteraction(e)&&(i+=e.interactionId),this.#d.colorForID(i)}setPopoverInfo(e,i){if(t.Types.Events.isSyntheticInteraction(e)){const t=new c.InteractionBreakdown.InteractionBreakdown;t.entry=e,i.additionalElements.push(t)}}}var xe=Object.freeze({__proto__:null,InteractionsTrackAppender:Me});const Pe={layoutShifts:"Layout shifts",layoutShiftCluster:"Layout shift cluster",layoutShift:"Layout shift"},Re=e.i18n.registerUIStrings("panels/timeline/LayoutShiftsTrackAppender.ts",Pe),Fe=e.i18n.getLocalizedString.bind(void 0,Re),Le=t.Types.Timing.Micro(5e3);class Ae{appenderName="LayoutShifts";#e;#t;constructor(e,t){this.#e=e,this.#t=t}appendTrackAtLevel(e,t){return 0===this.#t.LayoutShifts.clusters.length?e:(this.#r(e,t),this.#p(e))}#r(e,t){const i=W({collapsible:!1}),n=V("layout-shifts",e,Fe(Pe.layoutShifts),i,!0,t);this.#e.registerTrackForGroup(n,this)}#p(e){const t=this.#t.LayoutShifts.clusters;this.#e.appendEventsAtLevel(t,e,this);const i=this.#t.LayoutShifts.clusters.flatMap((e=>e.events));return this.preloadScreenshots(i),this.#e.appendEventsAtLevel(i,e,this)}colorForEvent(e){const i=n.ThemeSupport.instance().getComputedValue("--app-color-rendering");if(t.Types.Events.isSyntheticLayoutShiftCluster(e)){const e=l.Color.parse(i);if(e){return e.setAlpha(.5).asString("rgba")}}return i}setPopoverInfo(e,i){const n=t.Types.Events.isSyntheticLayoutShift(e)?e.args.data?.weighted_score_delta??0:t.Types.Events.isSyntheticLayoutShiftCluster(e)?e.clusterCumulativeScore:-1;if(i.formattedTime=n.toFixed(4),i.title=t.Types.Events.isSyntheticLayoutShift(e)?Fe(Pe.layoutShift):t.Types.Events.isSyntheticLayoutShiftCluster(e)?Fe(Pe.layoutShiftCluster):e.name,t.Types.Events.isSyntheticLayoutShift(e)){const t=new m.Geometry.Size(510,400),n=Ae.createShiftViz(e,this.#t,t);n&&i.additionalElements.push(n)}}getDrawOverride(e){if(t.Types.Events.isSyntheticLayoutShift(e)){const t=e.args.data?.weighted_score_delta||0,i=1-Math.min(t/.1,1);return(t,n,r,a,s,o,l)=>{const d=i*(s/3),c=s,h=c/2;return t.save(),t.beginPath(),t.moveTo(n,r+d),t.lineTo(n+h-d,r+h),t.lineTo(n,r+s-d),t.lineTo(n-h+d,r+h),t.closePath(),t.fillStyle=l(this.colorForEvent(e)),t.fill(),t.restore(),{x:n-h,width:c}}}if(t.Types.Events.isSyntheticLayoutShiftCluster(e))return(t,i,n,r,a,s,o)=>{const l=.2*a,d=n+(a-l)/2+.5;return t.fillStyle=o(this.colorForEvent(e)),t.fillRect(i,d,r-.5,l-1),{x:i,width:r,z:-1}}}preloadScreenshots(e){const t=new Set;for(const i of e){const e=i.parsedData.screenshots;e.before&&t.add(e.before),e.after&&t.add(e.after)}const i=Array.from(t);return s.ImageCache.preload(i)}titleForEvent(e){return""}static createShiftViz(e,t,i){const n=e.parsedData.screenshots,{viewportRect:r,devicePixelRatio:a}=t.Meta,o=document.createElement("div");o.classList.add("layout-shift-viz");const l=n.before&&s.ImageCache.getOrQueue(n.before),d=n.after&&s.ImageCache.getOrQueue(n.after);if(!l||!d||!r||void 0===a)return;const c=e=>new DOMRect(e[0]/a,e[1]/a,e[2]/a,e[3]/a),h=Math.min(l.naturalWidth/r.width,l.naturalHeight/r.height,1),m=Math.min(i.width/l.naturalWidth,i.height/l.naturalHeight,1);for(const e of[o,d,l])e.style.width=l.naturalWidth*m+"px",e.style.height=l.naturalHeight*m+"px";const u=e.args.data?.impacted_nodes?.map((e=>c(e.old_rect)))??[],g=e.args.data?.impacted_nodes?.map((e=>c(e.new_rect)))??[];return p.ScheduledRender.scheduleRender(o,(()=>function(){if(!l||!d)return;[l,d].flatMap((e=>e.getAnimations())).forEach((e=>e.cancel()));const e="ease-out",t={duration:3e3,iterations:1/0,fill:"forwards",easing:e};d.animate({opacity:[0,0,1,1,1],easing:e},t);const i=t=>({left:t.x*m*h+"px",top:t.y*m*h+"px",width:t.width*m*h+"px",height:t.height*m*h+"px",opacity:.7,outlineWidth:"1px",easing:e});u.forEach(((e,n)=>{const r=g[n],a=document.createElement("div");a.classList.add("layout-shift-viz-rect"),o.appendChild(a);let s=i(e),l=i(r);l.opacity=.4,[e.width,e.height,e.x,e.y].every((e=>0===e))&&(s={...l},s.opacity="0"),[r.width,r.height,r.x,r.y].every((e=>0===e))&&(l={...s},l.opacity="0"),a.animate([s,s,{...l,outlineWidth:"4px"},l,l],t)}))}())),o.append(l,d),o}}var Ne=Object.freeze({__proto__:null,LAYOUT_SHIFT_SYNTHETIC_DURATION:Le,LayoutShiftsTrackAppender:Ae});class De{#t;#m=[];#u=[];#g=new Map;constructor(e){this.#t=e}#v(e){return this.#t.Samples.entryToNode.get(e)??this.#t.Renderer.entryToNode.get(e)}findPossibleActions(e){const t=this.#v(e);if(!t)return{MERGE_FUNCTION:!1,COLLAPSE_FUNCTION:!1,COLLAPSE_REPEATING_DESCENDANTS:!1,RESET_CHILDREN:!1,UNDO_ALL_ACTIONS:!1};const i=t.parent,n=this.#T(t).filter((e=>!this.#m.includes(e))),r=this.#y(t).filter((e=>!this.#m.includes(e))),a=this.#T(t).filter((e=>this.#m.includes(e)));return{MERGE_FUNCTION:null!==i,COLLAPSE_FUNCTION:n.length>0,COLLAPSE_REPEATING_DESCENDANTS:r.length>0,RESET_CHILDREN:a.length>0,UNDO_ALL_ACTIONS:this.#m.length>0}}findHiddenDescendantsAmount(e){const t=this.#v(e);if(!t)return 0;return this.#T(t).filter((e=>this.invisibleEntries().includes(e))).length}invisibleEntries(){return this.#m}setHiddenAndExpandableEntries(e,t){this.#m.push(...e),this.#u.push(...t)}entryIsInvisible(e){return this.#m.includes(e)}expandableEntries(){return this.#u}applyFilterAction(e){const t=new Set;switch(e.type){case"MERGE_FUNCTION":{t.add(e.entry);const i=this.#v(e.entry)||null,n=i&&this.#f(i);n&&this.#S(n.entry);break}case"COLLAPSE_FUNCTION":{const i=this.#v(e.entry);if(!i)break;this.#T(i).forEach((e=>t.add(e))),this.#S(e.entry);break}case"COLLAPSE_REPEATING_DESCENDANTS":{const i=this.#v(e.entry);if(!i)break;this.#y(i).forEach((e=>t.add(e))),t.size>0&&this.#S(e.entry);break}case"UNDO_ALL_ACTIONS":this.#m=[],this.#u=[];break;case"RESET_CHILDREN":this.#w(e.entry);break;default:r.assertNever(e.type,`Unknown EntriesFilter action: ${e.type}`)}return this.#m.push(...t),this.#m}#S(e){this.#u.push(e);const t=this.#v(e);if(!t)return;const i=this.#T(t);i.length>0&&(this.#u=this.#u.filter((e=>!i.includes(e))))}firstVisibleParentEntryForEntry(e){const t=this.#v(e);if(!t)return null;const i=this.#f(t);return i?i.entry:null}#f(e){let t=e.parent;for(;t&&this.#m.includes(t.entry)||t&&!Br(t.entry);)t=t.parent;return t}#T(e){const t=this.#g.get(e);if(t)return t;const i=[],n=[...e.children];for(;n.length>0;){const e=n.shift();if(e){i.push(e.entry);const t=this.#g.get(e);t?i.push(...t):n.push(...e.children)}}return this.#g.set(e,i),i}#y(e){const i=[...e.children],n=[],r=t.Types.Events.isProfileCall(e.entry);for(;i.length>0;){const a=i.shift();if(a){const s=t.Types.Events.isProfileCall(a.entry);if(r&&s){const i=e.entry,r=a.entry;t.Helpers.SamplesIntegrator.SamplesIntegrator.framesAreEqual(i.callFrame,r.callFrame)&&n.push(a.entry)}else r||s||e.entry.name===a.entry.name&&n.push(a.entry);i.push(...a.children)}}return n}revealEntry(e){const t=this.#v(e);if(!t)return;let i=t;for(;i.parent&&!this.#u.includes(i.entry);)i=i.parent;this.#w(i.entry)}#w(e){const t=this.#v(e);if(!t)return;const i=this.#T(t);this.#m=this.#m.filter((e=>!i.includes(e))),this.#u=this.#u.filter((t=>!i.includes(t)&&t!==e))}isEntryExpandable(e){return this.#u.includes(e)}}var Be=Object.freeze({__proto__:null,EntriesFilter:De});class He{#b=new Map;keyForEvent(e){if(t.Types.Events.isProfileCall(e))return`p-${e.pid}-${e.tid}-${t.Types.Events.SampleIndex(e.sampleIndex)}-${e.nodeId}`;if(t.Types.Events.isLegacyTimelineFrame(e))return`l-${e.index}`;const i=t.Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getRawTraceEvents(),n=t.Types.Events.isSyntheticBased(e)?`s-${i.indexOf(e.rawSourceEvent)}`:`r-${i.indexOf(e)}`;return n.length<3?null:n}eventForKey(e,i){const n=t.Types.File.traceEventKeyToValues(e);if(He.isProfileCallKey(n))return this.#E(n,i);if(He.isLegacyTimelineFrameKey(n)){const e=i.Frames.frames.at(n.rawIndex);if(!e)throw new Error(`Could not find frame with index ${n.rawIndex}`);return e}if(He.isSyntheticEventKey(n)){const e=t.Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getSyntheticTraces().at(n.rawIndex);if(!e)throw new Error(`Attempted to get a synthetic event from an unknown raw event index: ${n.rawIndex}`);return e}if(He.isRawEventKey(n)){return t.Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getRawTraceEvents()[n.rawIndex]}throw new Error(`Unknown trace event serializable key values: ${n.join("-")}`)}static isProfileCallKey(e){return"p"===e.type}static isLegacyTimelineFrameKey(e){return"l"===e.type}static isRawEventKey(e){return"r"===e.type}static isSyntheticEventKey(e){return"s"===e.type}#E(e,t){const i=this.#b.get(e);if(i)return i;const n=t.Renderer.processes.get(e.processID)?.threads.get(e.threadID)?.profileCalls;if(!n)throw new Error(`Unknown profile call serializable key: ${e}`);const r=n?.find((t=>t.sampleIndex===e.sampleIndex&&t.nodeId===e.protocol));if(!r)throw new Error(`Unknown profile call serializable key: ${JSON.stringify(e)}`);return this.#b.set(e,r),r}}var Ue=Object.freeze({__proto__:null,EventsSerializer:He});const Oe=[];let _e;class We extends Event{overlay;action;static eventName="annotationmodifiedevent";constructor(e,t){super(We.eventName),this.overlay=e,this.action=t}}class Ve extends EventTarget{#C;#k;#I=null;#t;#M;#x;#P;static activeManager(){return _e}static reset(){Oe.length=0,_e=null}static initAndActivateModificationsManager(e,t){if(Oe[t]){if(_e===Oe[t])return _e;_e=Oe[t],Ve.activeManager()?.applyModificationsIfPresent()}const i=e.parsedTrace(t);if(!i)throw new Error("ModificationsManager was initialized without a corresponding trace data");const n=i.Meta.traceBounds,r=e.rawTraceEvents(t);if(!r)throw new Error("ModificationsManager was initialized without a corresponding raw trace events array");const a=e.syntheticTraceEventsManager(t);if(!a)throw new Error("ModificationsManager was initialized without a corresponding SyntheticEventsManager");const s=e.metadata(t),o=new Ve({parsedTrace:i,traceBounds:n,rawTraceEvents:r,modifications:s?.modifications,syntheticEvents:a.getSyntheticTraces()});return Oe[t]=o,_e=o,Ve.activeManager()?.applyModificationsIfPresent(),this.activeManager()}constructor({parsedTrace:e,traceBounds:t,modifications:i}){super(),this.#C=new De(e),this.#k=new c.Breadcrumbs.Breadcrumbs(t),this.#I=i||null,this.#t=e,this.#M=new He,this.#P=l.Settings.Settings.instance().moduleSetting("annotations-hidden"),this.#x=new Map}getEntriesFilter(){return this.#C}getTimelineBreadcrumbs(){return this.#k}deleteEmptyRangeAnnotations(){for(const e of this.#x.keys())"TIME_RANGE"===e.type&&0===e.label.length&&this.removeAnnotation(e)}createAnnotation(e,t=!1){if("ENTRY_LABEL"===e.type){const t=this.#R(e.entry);if(t)return void this.dispatchEvent(new We(t,"EnterLabelEditState"))}t||"TIME_RANGE"!==e.type&&this.#P.set(!1);const i=this.#F(e);this.#x.set(e,i),this.dispatchEvent(new We(i,"Add"))}annotationsForEntry(e){const t=[];for(const[i]of this.#x.entries())"ENTRY_LABEL"===i.type&&i.entry===e?t.push(i):"ENTRIES_LINK"!==i.type||i.entryFrom!==e&&i.entryTo!==e||t.push(i);return t}deleteEntryAnnotations(e){this.annotationsForEntry(e).forEach((e=>{this.removeAnnotation(e)}))}linkAnnotationBetweenEntriesExists(e,t){for(const i of this.#x.keys())if("ENTRIES_LINK"===i.type&&(i.entryFrom===e&&i.entryTo===t||i.entryFrom===t&&i.entryTo===e))return!0;return!1}#R(e){for(const[t,i]of this.#x.entries())if("ENTRY_LABEL"===t.type&&t.entry===e)return i;return null}#F(e){switch(e.type){case"ENTRY_LABEL":return{type:"ENTRY_LABEL",entry:e.entry,label:e.label};case"TIME_RANGE":return{type:"TIME_RANGE",label:e.label,showDuration:!0,bounds:e.bounds};case"ENTRIES_LINK":return{type:"ENTRIES_LINK",state:e.state,entryFrom:e.entryFrom,entryTo:e.entryTo};default:r.assertNever(e,"Overlay for provided annotation cannot be created")}}removeAnnotation(e){const t=this.#x.get(e);t?(this.#x.delete(e),this.dispatchEvent(new We(t,"Remove"))):console.warn("Overlay for deleted Annotation does not exist",e)}removeAnnotationOverlay(e){const t=this.getAnnotationByOverlay(e);t?this.removeAnnotation(t):console.warn("Annotation for deleted Overlay does not exist",e)}updateAnnotation(e){const i=this.#x.get(e);i&&ne(i)&&t.Types.File.isTimeRangeAnnotation(e)?(i.label=e.label,i.bounds=e.bounds,this.dispatchEvent(new We(i,"UpdateTimeRange"))):i&&re(i)&&t.Types.File.isEntriesLinkAnnotation(e)?(i.state=e.state,i.entryFrom=e.entryFrom,i.entryTo=e.entryTo,this.dispatchEvent(new We(i,"UpdateLinkToEntry"))):console.error("Annotation could not be updated")}updateAnnotationOverlay(e){const t=this.getAnnotationByOverlay(e);t?(("ENTRY_LABEL"===e.type&&"ENTRY_LABEL"===t.type||"TIME_RANGE"===e.type&&"TIME_RANGE"===t.type)&&(this.#P.set(!1),t.label=e.label,this.dispatchEvent(new We(e,"UpdateLabel"))),"ENTRIES_LINK"===e.type&&"ENTRIES_LINK"===t.type&&(this.#P.set(!1),t.state=e.state)):console.warn("Annotation for updated Overlay does not exist")}getAnnotationByOverlay(e){for(const[t,i]of this.#x.entries())if(i===e)return t;return null}getAnnotations(){return[...this.#x.keys()]}getOverlays(){return[...this.#x.values()]}applyAnnotationsFromCache(){this.#I=this.toJSON(),this.#x.clear(),this.#L(this.#I.annotations)}toJSON(){const e=this.#C.invisibleEntries().map((e=>this.#M.keyForEvent(e))).filter((e=>null!==e)),t=this.#C.expandableEntries().map((e=>this.#M.keyForEvent(e))).filter((e=>null!==e));return this.#I={entriesModifications:{hiddenEntries:e,expandableEntries:t},initialBreadcrumb:this.#k.initialBreadcrumb,annotations:this.#A()},this.#I}#A(){const e=this.getAnnotations(),i=[],n=[],r=[];for(let a=0;a<e.length;a++){const s=e[a];if(t.Types.File.isEntryLabelAnnotation(s)){const e=this.#M.keyForEvent(s.entry);e&&i.push({entry:e,label:s.label})}else if(t.Types.File.isTimeRangeAnnotation(s))n.push({bounds:s.bounds,label:s.label});else if(t.Types.File.isEntriesLinkAnnotation(s)&&s.entryTo){const e=this.#M.keyForEvent(s.entryFrom),t=this.#M.keyForEvent(s.entryTo);e&&t&&r.push({entryFrom:e,entryTo:t})}}return{entryLabels:i,labelledTimeRanges:n,linksBetweenEntries:r}}applyModificationsIfPresent(){if(!this.#I||!this.#I.annotations)return;const e=this.#I.entriesModifications.hiddenEntries,t=this.#I.entriesModifications.expandableEntries;this.#k.setInitialBreadcrumbFromLoadedModifications(this.#I.initialBreadcrumb),this.#N(e,t),this.#L(this.#I.annotations)}#L(e){try{(e.entryLabels??[]).forEach((e=>{this.createAnnotation({type:"ENTRY_LABEL",entry:this.#M.eventForKey(e.entry,this.#t),label:e.label},!0)}));(e.labelledTimeRanges??[]).forEach((e=>{this.createAnnotation({type:"TIME_RANGE",bounds:e.bounds,label:e.label},!0)}));(e.linksBetweenEntries??[]).forEach((e=>{this.createAnnotation({type:"ENTRIES_LINK",state:"connected",entryFrom:this.#M.eventForKey(e.entryFrom,this.#t),entryTo:this.#M.eventForKey(e.entryTo,this.#t)},!0)}))}catch(e){console.warn("Failed to apply stored annotations",e)}}#N(e,t){try{const i=e.map((e=>this.#M.eventForKey(e,this.#t))),n=t.map((e=>this.#M.eventForKey(e,this.#t)));this.#C.setHiddenAndExpandableEntries(i,n)}catch(e){console.warn("Failed to apply entriesFilter modifications",e),this.#C.setHiddenAndExpandableEntries([],[])}}}var Ge=Object.freeze({__proto__:null,AnnotationModifiedEvent:We,ModificationsManager:Ve});const ze={onIgnoreList:"On ignore list ({rule})",mainS:"Main — {PH1}",main:"Main",frameS:"Frame — {PH1}",workerS:"`Worker` — {PH1}",workerSS:"`Worker`: {PH1} — {PH2}",dedicatedWorker:"Dedicated `Worker`",threadS:"Thread {PH1}",raster:"Raster",threadPool:"Thread pool",rasterizerThreadS:"Rasterizer thread {PH1}",threadPoolThreadS:"Thread pool worker {PH1}",bidderWorkletS:"Bidder Worklet — {PH1}",bidderWorklet:"Bidder Worklet",sellerWorklet:"Seller Worklet",unknownWorklet:"Auction Worklet",workletService:"Auction Worklet service",sellerWorkletS:"Seller Worklet — {PH1}",unknownWorkletS:"Auction Worklet — {PH1}",workletServiceS:"Auction Worklet service — {PH1}"},je=e.i18n.registerUIStrings("panels/timeline/ThreadAppender.ts",ze),$e=e.i18n.getLocalizedString.bind(void 0,je);class Ke{appenderName="Thread";#d;#e;#t;#D=[];#B;#H;#U;#O;#_=!1;#W=!1;threadType="MAIN_THREAD";isOnMainFrame;#V=d.Runtime.experiments.isEnabled("timeline-show-all-events");#G="";#z=null;constructor(e,t,i,n,r,a,s,o){if(this.#e=e,this.#d=new l.Color.Generator({min:30,max:330,count:void 0},{min:50,max:80,count:3},85),this.#d.setColorForID("","#f2ecdc"),this.#t=t,this.#H=i,this.#U=n,!s||!o)throw new Error(`Could not find data for thread with id ${n} in process with id ${i}`);this.#D=s,this.#B=o,this.#O=r||$e(ze.threadS,{PH1:n}),this.isOnMainFrame=Boolean(this.#t.Renderer?.processes.get(i)?.isOnMainFrame),this.threadType=a,this.#t.AuctionWorklets.worklets.has(i)&&(this.appenderName="Thread_AuctionWorklet"),this.#G=this.#t.Renderer?.processes.get(this.#H)?.url||""}processId(){return this.#H}threadId(){return this.#U}appendTrackAtLevel(e,t=!1){return 0===this.#D.length?e:(this.#_=t,this.#j(e))}setHeaderNestingLevel(e){this.#z=e}#$(e){this.#W||("RASTERIZER"===this.threadType||"THREAD_POOL"===this.threadType?this.#K(e,this.threadType):this.#r(e),this.#W=!0)}setHeaderAppended(e){this.#W=e}headerAppended(){return this.#W}#r(e){const t=W({shareHeaderLine:!1,collapsible:this.#D.length>0});null!==this.#z&&(t.nestingLevel=this.#z);const i=V(this.#q(),e,this.trackName(),t,!0,this.#_,!0);this.#e.registerTrackForGroup(i,this)}#q(){switch(this.threadType){case"MAIN_THREAD":return this.isOnMainFrame?"thread.main":"thread.frame";case"WORKER":return"thread.worker";case"RASTERIZER":return"thread.rasterizer";case"AUCTION_WORKLET":return"thread.auction-worklet";case"OTHER":return"thread.other";case"CPU_PROFILE":return"thread.cpu-profile";case"THREAD_POOL":return"thread.pool";default:return null}}#K(e,t){const i=this.#e.getCurrentTrackCountForThreadType(t);if(0===i){const t=W({shareHeaderLine:!1,collapsible:this.#D.length>0}),i=V(null,e,this.trackName(),t,!1,this.#_);this.#e.getFlameChartTimelineData().groups.push(i)}const n=W({padding:2,nestingLevel:1,collapsible:!1}),r="RASTERIZER"===this.threadType?$e(ze.rasterizerThreadS,{PH1:i+1}):$e(ze.threadPoolThreadS,{PH1:i+1}),a=V(this.#q(),e,r,n,!0,this.#_);this.#e.registerTrackForGroup(a,this)}trackName(){let e=null;switch(this.threadType){case"MAIN_THREAD":e=this.isOnMainFrame?$e(ze.mainS,{PH1:this.#G}):$e(ze.frameS,{PH1:this.#G});break;case"CPU_PROFILE":e=$e(ze.main);break;case"WORKER":e=this.#Y();break;case"RASTERIZER":e=$e(ze.raster);break;case"THREAD_POOL":e=$e(ze.threadPool);break;case"OTHER":break;case"AUCTION_WORKLET":e=this.#J();break;default:return r.assertNever(this.threadType,`Unknown thread type: ${this.threadType}`)}let t="";return this.#t.Meta.traceIsGeneric&&(t+=` (${this.threadId()})`),(e||this.#O)+t}getUrl(){return this.#G}getEntries(){return this.#D}#J(){const e=this.#t.AuctionWorklets.worklets.get(this.#H);if(!e)return $e(ze.unknownWorklet);const t=e.host?`https://${e.host}`:"",i=t.length>0,n=e.args.data.utilityThread.tid===this.#U,a=e.args.data.v8HelperThread.tid===this.#U;if(n)return i?$e(ze.workletServiceS,{PH1:t}):$e(ze.workletService);if(a)switch(e.type){case"seller":return i?$e(ze.sellerWorkletS,{PH1:t}):$e(ze.sellerWorklet);case"bidder":return i?$e(ze.bidderWorkletS,{PH1:t}):$e(ze.bidderWorklet);case"unknown":return i?$e(ze.unknownWorkletS,{PH1:t}):$e(ze.unknownWorklet);default:r.assertNever(e.type,`Unexpected Auction Worklet Type ${e.type}`)}return i?$e(ze.unknownWorkletS,{PH1:t}):$e(ze.unknownWorklet)}#Y(){const e=this.#t.Renderer?.processes.get(this.#H)?.url||"",t=this.#t.Workers.workerIdByThread.get(this.#U),i=t?this.#t.Workers.workerURLById.get(t):e;let n=i?$e(ze.workerS,{PH1:i}):$e(ze.dedicatedWorker);const r=void 0!==t&&o.TargetManager.TargetManager.instance().targetById(t);return r&&(n=$e(ze.workerSS,{PH1:r.name(),PH2:e})),n}#j(e){return this.#X(this.#B.roots,e)}#X(e,t,i=!1){const n=Ve.activeManager()?.getEntriesFilter().invisibleEntries()??[];let r=t;for(const a of e){let e=t;const o=a.entry,l=s.IgnoreList.isIgnoreListedEntry(o);!n.includes(o)&&(Br(o,this.#t)||this.#V)&&!(l&&i)&&(this.#Z(o,t),e++);const d=this.#X(a.children,e,l);r=Math.max(d,r)}return r}#Z(e,t){this.#$(t);const i=this.#e.appendEventAtLevel(e,t,this);this.#Q(e,i)}#Q(e,i){const n=this.#e.getFlameChartTimelineData();Ve.activeManager()?.getEntriesFilter().isEntryExpandable(e)&&j(n,i,{type:"HIDDEN_DESCENDANTS_ARROW"});const r=this.#t.Warnings.perEvent.get(e);r&&(j(n,i,{type:"WARNING_TRIANGLE"}),r.includes("LONG_TASK")&&j(n,i,{type:"CANDY",startAtTime:t.Handlers.ModelHandlers.Warnings.LONG_MAIN_THREAD_TASK_THRESHOLD}))}colorForEvent(e){if(this.#t.Meta.traceIsGeneric)return e.name?`hsl(${r.StringUtilities.hashCode(e.name)%300+30}, 40%, 70%)`:"#ccc";if(t.Types.Events.isProfileCall(e))return"(idle)"===e.callFrame.functionName?s.EntryStyles.getCategoryStyles().idle.getComputedColorValue():"0"===e.callFrame.scriptId?s.EntryStyles.getCategoryStyles().scripting.getComputedColorValue():this.#d.colorForID(e.callFrame.url);const i=s.EntryStyles.getEventStyle(e.name)?.category.getComputedColorValue();return i||s.EntryStyles.getCategoryStyles().other.getComputedColorValue()}titleForEvent(e){if(s.IgnoreList.isIgnoreListedEntry(e)){const t=s.IgnoreList.getIgnoredReasonString(e);return $e(ze.onIgnoreList,{rule:t})}return s.EntryName.nameForEntry(e,this.#t)}setPopoverInfo(e,i){if(t.Types.Events.isParseHTML(e)){const t=e.args.beginData.startLine,n=e.args.endData?.endLine,r=e.args.beginData.url,a=u.ResourceUtils.displayNameForURL(r),s=-1!==n||n===t?`${t}...${n}`:t;i.title+=` - ${a} [${s}]`}const n=this.#t.Renderer.entryToNode.get(e)?.selfTime;i.formattedTime=G(e.dur,n)}}var qe=Object.freeze({__proto__:null,ThreadAppender:Ke});function Ye(e,t,i,n){const r=[...Xe(e,t,e.Initiators.eventToInitiator),...Ze(t,e.Initiators.initiatorToEvents)];return r.forEach((t=>function(e,t,i,n){if(i.includes(e.event)){let i=n.Renderer.entryToNode.get(e.event)?.parent;for(;i?.entry&&!t.includes(i?.entry);)i=i.parent??void 0;e.event=i?.entry??e.event,e.isEntryHidden=!0}if(i.includes(e.initiator)){let i=n.Renderer.entryToNode.get(e.initiator)?.parent;for(;i?.entry&&!t.includes(i?.entry);)i=i.parent??void 0;e.initiator=i?.entry??e.initiator,e.isInitiatorHidden=!0}return e}(t,n,i,e))),r}function Je(e,t){return Xe(e,t,e.NetworkRequests.eventToInitiator)}function Xe(e,t,i){const n=[];let r=t;const a=new Set;for(a.add(r);r;){const t=i.get(r);if(t){if(a.has(t))break;n.push({event:r,initiator:t}),r=t,a.add(r);continue}const s=e.Renderer.entryToNode.get(r);if(!s){r=null;break}r=s.parent?.entry||null}return n}function Ze(e,t){const i=[],n=t.get(e);return n&&n.forEach((t=>{i.push({event:t,initiator:e})})),i}var Qe=Object.freeze({__proto__:null,initiatorsDataToDraw:Ye,initiatorsDataToDrawForNetwork:Je}),et={cssText:`.timeline-flamechart-popover{overflow:hidden;padding:4px;margin:-4px}.timeline-flamechart-popover devtools-interaction-breakdown{margin-top:10px}.timeline-flamechart-popover span{margin-right:5px}.timeline-flamechart-popover span.popoverinfo-network-time{color:var(--sys-color-primary)}.timeline-flamechart-popover span.popoverinfo-time{color:var(--sys-color-green)}.timeline-flamechart-popover span.popoverinfo-warning{color:var(--sys-color-error)}.timeline-flamechart-popover span.popoverinfo-url-path,\n.timeline-flamechart-popover span.popoverinfo-url-origin{color:var(--sys-color-token-subtle);font-size:11px}.timeline-flamechart-popover span.popoverinfo-url-origin{font-style:italic}.timeline-flamechart-popover span.popoverinfo-warning *{color:inherit}.layout-shift-viz{position:relative;margin:var(--sys-size-8) var(--sys-size-5);outline:1px solid var(--sys-color-divider)}.layout-shift-viz-rect{outline:1px solid color-mix(in srgb,var(--color-background-inverted) 20%,var(--app-color-rendering));background-color:color-mix(in srgb,var(--color-background-inverted-opacity-0) 50%,var(--app-color-rendering-children));position:absolute;z-index:100}.layout-shift-viz > img{position:absolute;top:0;left:0}\n/*# sourceURL=${import.meta.resolve("./timelineFlamechartPopover.css")} */\n`};const tt={jsHeap:"JS heap",documents:"Documents",nodes:"Nodes",listeners:"Listeners",gpuMemory:"GPU memory",ss:"[{PH1} – {PH2}]",noEventsFound:"No memory usage data found within selected events."},it=e.i18n.registerUIStrings("panels/timeline/CountersGraph.ts",tt),nt=e.i18n.getLocalizedString.bind(void 0,it);class rt extends m.Widget.VBox{delegate;calculator;header;toolbar;graphsContainer;canvasContainer;canvas;timelineGrid;counters;counterUI;countersByName;gpuMemoryCounter;#ee=null;currentValuesBar;markerXPosition;#te=this.#ie.bind(this);#ne=document.createElement("div");#re=!1;constructor(t){super(),this.element.id="memory-graphs-container",this.delegate=t,this.calculator=new ot,this.header=new m.Widget.HBox,this.header.element.classList.add("timeline-memory-header"),this.header.show(this.element),this.toolbar=this.header.element.createChild("devtools-toolbar","timeline-memory-toolbar"),this.graphsContainer=new m.Widget.VBox,this.graphsContainer.show(this.element);const n=new m.Widget.VBoxWithResizeCallback(this.resize.bind(this));n.show(this.graphsContainer.element),this.createCurrentValuesBar(),this.canvasContainer=n.element,this.canvasContainer.id="memory-graphs-canvas-container",this.canvas=document.createElement("canvas"),this.canvasContainer.appendChild(this.canvas),this.canvas.id="memory-counters-graph";const r=document.createElement("p");r.innerText=nt(tt.noEventsFound),this.#ne.classList.add("no-events-found"),this.#ne.setAttribute("hidden","hidden"),this.#ne.appendChild(r),this.canvasContainer.appendChild(this.#ne),this.canvasContainer.addEventListener("mouseover",this.onMouseMove.bind(this),!0),this.canvasContainer.addEventListener("mousemove",this.onMouseMove.bind(this),!0),this.canvasContainer.addEventListener("mouseleave",this.onMouseLeave.bind(this),!0),this.canvasContainer.addEventListener("click",this.onClick.bind(this),!0),this.timelineGrid=new i.TimelineGrid.TimelineGrid,this.canvasContainer.appendChild(this.timelineGrid.dividersElement),this.counters=[],this.counterUI=[],this.countersByName=new Map,this.countersByName.set("jsHeapSizeUsed",this.createCounter(nt(tt.jsHeap),"js-heap-size-used","hsl(220, 90%, 43%)",e.ByteUtilities.bytesToString)),this.countersByName.set("documents",this.createCounter(nt(tt.documents),"documents","hsl(0, 90%, 43%)")),this.countersByName.set("nodes",this.createCounter(nt(tt.nodes),"nodes","hsl(120, 90%, 43%)")),this.countersByName.set("jsEventListeners",this.createCounter(nt(tt.listeners),"js-event-listeners","hsl(38, 90%, 43%)")),this.gpuMemoryCounter=this.createCounter(nt(tt.gpuMemory),"gpu-memory-used-kb","hsl(300, 90%, 43%)",e.ByteUtilities.bytesToString),this.countersByName.set("gpuMemoryUsedKB",this.gpuMemoryCounter),a.TraceBounds.onChange(this.#te)}#ie(e){if("RESET"===e.updateType||"VISIBLE_WINDOW"===e.updateType){const t=e.state.milli.timelineTraceWindow;this.calculator.setWindow(t.min,t.max),this.#ae()}}setModel(e,i){if(this.#ee=i,!i||!e)return;const n=t.Helpers.Timing.traceWindowMilliSeconds(e.Meta.traceBounds).min;this.calculator.setZeroTime(n);for(let e=0;e<this.counters.length;++e)this.counters[e].reset(),this.counterUI[e].reset();this.#ae();let r=0;for(let e=0;e<i.length;++e){const n=i[e];if(!t.Types.Events.isUpdateCounters(n))continue;r++;const a=n.args.data;if(!a)return;for(const e in a){const i=this.countersByName.get(e);if(i){const{startTime:r}=t.Helpers.Timing.eventTimingsMilliSeconds(n);i.appendSample(r,a[e])}}void 0!==a.gpuMemoryLimitKB&&this.gpuMemoryCounter.setLimit(a.gpuMemoryLimitKB)}this.#re=0===r}createCurrentValuesBar(){this.currentValuesBar=this.graphsContainer.element.createChild("div"),this.currentValuesBar.id="counter-values-bar"}createCounter(e,t,i,n){const r=new at;return this.counters.push(r),this.counterUI.push(new st(this,e,t,i,r,n)),r}resizerElement(){return this.header.element}resize(){const e=this.canvas.parentElement;this.canvas.width=e.clientWidth*window.devicePixelRatio,this.canvas.height=e.clientHeight*window.devicePixelRatio,this.calculator.setDisplayWidth(this.canvas.width),this.refresh()}#ae(){m.UIUtils.invokeOnceAfterBatchUpdate(this,this.refresh)}draw(){this.clear(),this.#re?this.#ne.removeAttribute("hidden"):this.#ne.setAttribute("hidden","hidden");for(const e of this.counters)e.calculateVisibleIndexes(this.calculator),e.calculateXValues(this.canvas.width);for(const e of this.counterUI)e.drawGraph(this.canvas)}onClick(e){const t=e.x-this.canvasContainer.getBoundingClientRect().left;let i,n=1/0;for(const e of this.counterUI){if(!e.counter.times.length)continue;const r=e.recordIndexAt(t),a=Math.abs(t*window.devicePixelRatio-e.counter.x[r]);a<n&&(n=a,i=e.counter.times[r])}void 0!==i&&this.#ee&&this.delegate.selectEntryAtTime(this.#ee,i)}onMouseLeave(e){delete this.markerXPosition,this.clearCurrentValueAndMarker()}clearCurrentValueAndMarker(){for(let e=0;e<this.counterUI.length;e++)this.counterUI[e].clearCurrentValueAndMarker()}onMouseMove(e){const t=e.x-this.canvasContainer.getBoundingClientRect().left;this.markerXPosition=t,this.refreshCurrentValues()}refreshCurrentValues(){if(void 0!==this.markerXPosition)for(let e=0;e<this.counterUI.length;++e)this.counterUI[e].updateCurrentValue(this.markerXPosition)}refresh(){this.timelineGrid.updateDividers(this.calculator),this.draw(),this.refreshCurrentValues()}clear(){const e=this.canvas.getContext("2d");if(!e)throw new Error("Unable to get canvas context");e.clearRect(0,0,e.canvas.width,e.canvas.height)}}class at{times;values;x;minimumIndex;maximumIndex;maxTime;minTime;limitValue;constructor(){this.times=[],this.values=[],this.x=[],this.minimumIndex=0,this.maximumIndex=0,this.maxTime=0,this.minTime=0}appendSample(e,t){this.values.length&&this.values[this.values.length-1]===t||(this.times.push(e),this.values.push(t))}reset(){this.times=[],this.values=[]}setLimit(e){this.limitValue=e}calculateBounds(){let e,t;for(let i=this.minimumIndex;i<=this.maximumIndex;i++){const n=this.values[i];(void 0===t||n<t)&&(t=n),(void 0===e||n>e)&&(e=n)}return t=t||0,e=e||1,this.limitValue&&(e>.5*this.limitValue&&(e=Math.max(e,this.limitValue)),t=Math.min(t,this.limitValue)),{min:t,max:e}}calculateVisibleIndexes(e){const t=e.minimumBoundary(),i=e.maximumBoundary();this.minimumIndex=r.NumberUtilities.clamp(r.ArrayUtilities.upperBound(this.times,t,r.ArrayUtilities.DEFAULT_COMPARATOR)-1,0,this.times.length-1),this.maximumIndex=r.NumberUtilities.clamp(r.ArrayUtilities.lowerBound(this.times,i,r.ArrayUtilities.DEFAULT_COMPARATOR),0,this.times.length-1),this.minTime=t,this.maxTime=i}calculateXValues(e){if(!this.values.length)return;const t=e/(this.maxTime-this.minTime);this.x=new Array(this.values.length);for(let e=this.minimumIndex+1;e<=this.maximumIndex;e++)this.x[e]=t*(this.times[e]-this.minTime)}}class st{countersPane;counter;formatter;setting;filter;range;value;graphColor;limitColor;graphYValues;verticalPadding;currentValueLabel;marker;constructor(e,t,i,n,a,s){this.countersPane=e,this.counter=a,this.formatter=s||r.NumberUtilities.withThousandsSeparator,this.setting=l.Settings.Settings.instance().createSetting("timeline-counters-graph-"+i,!0),this.setting.setTitle(t),this.filter=new m.Toolbar.ToolbarSettingCheckbox(this.setting,t),this.filter.inputElement.classList.add("-theme-preserve-input");const o=l.Color.parse(n);if(o){const e=o.setAlpha(.5).asString("rgba"),t=this.filter.element;e&&(t.style.backgroundColor=e),t.style.borderColor="transparent"}this.filter.inputElement.addEventListener("click",this.toggleCounterGraph.bind(this)),e.toolbar.appendToolbarItem(this.filter),this.range=this.filter.element.createChild("span","range"),this.value=e.currentValuesBar.createChild("span","memory-counter-value"),this.value.style.color=n,this.graphColor=n,o&&(this.limitColor=o.setAlpha(.3).asString("rgba")),this.graphYValues=[],this.verticalPadding=10,this.currentValueLabel=t,this.marker=e.canvasContainer.createChild("div","memory-counter-marker"),this.marker.style.backgroundColor=n,this.clearCurrentValueAndMarker()}reset(){this.range.textContent=""}setRange(e,t){const i=this.formatter(e),n=this.formatter(t);this.range.textContent=nt(tt.ss,{PH1:i,PH2:n})}toggleCounterGraph(){this.value.classList.toggle("hidden",!this.filter.checked()),this.countersPane.refresh()}recordIndexAt(e){return r.ArrayUtilities.upperBound(this.counter.x,e*window.devicePixelRatio,r.ArrayUtilities.DEFAULT_COMPARATOR,this.counter.minimumIndex+1,this.counter.maximumIndex+1)-1}updateCurrentValue(e){if(!this.visible()||!this.counter.values.length||!this.counter.x)return;const t=this.recordIndexAt(e),i=r.NumberUtilities.withThousandsSeparator(this.counter.values[t]);this.value.textContent=`${this.currentValueLabel}: ${i}`;const n=this.graphYValues[t]/window.devicePixelRatio;this.marker.style.left=e+"px",this.marker.style.top=n+"px",this.marker.classList.remove("hidden")}clearCurrentValueAndMarker(){this.value.textContent="",this.marker.classList.add("hidden")}drawGraph(e){const t=e.getContext("2d");if(!t)throw new Error("Unable to get canvas context");const i=e.width,n=e.height-2*this.verticalPadding;if(n<=0)return void(this.graphYValues=[]);const r=this.verticalPadding,a=this.counter,s=a.values;if(!s.length)return;const o=a.calculateBounds(),l=o.min,d=o.max;if(this.setRange(l,d),!this.visible())return;const c=this.graphYValues,h=d-l,p=h?n/h:1;t.save(),t.lineWidth=window.devicePixelRatio,t.lineWidth%2&&t.translate(.5,.5),t.beginPath();let m=s[a.minimumIndex],u=Math.round(r+n-(m-l)*p);t.moveTo(0,u);let g=a.minimumIndex;for(;g<=a.maximumIndex;g++){const e=Math.round(a.x[g]);t.lineTo(e,u);const i=s[g];void 0!==i&&(m=i),u=Math.round(r+n-(m-l)*p),t.lineTo(e,u),c[g]=u}if(c.length=g,t.lineTo(i,u),t.strokeStyle=this.graphColor,t.stroke(),a.limitValue){const e=Math.round(r+n-(a.limitValue-l)*p);t.moveTo(0,e),t.lineTo(i,e),this.limitColor&&(t.strokeStyle=this.limitColor),t.stroke()}t.closePath(),t.restore()}visible(){return this.filter.checked()}}class ot{minimumBoundaryInternal;maximumBoundaryInternal;workingArea;zeroTimeInternal;constructor(){this.minimumBoundaryInternal=0,this.maximumBoundaryInternal=0,this.workingArea=0,this.zeroTimeInternal=0}setZeroTime(e){this.zeroTimeInternal=e}computePosition(e){return(e-this.minimumBoundaryInternal)/this.boundarySpan()*this.workingArea}setWindow(e,t){this.minimumBoundaryInternal=e,this.maximumBoundaryInternal=t}setDisplayWidth(e){this.workingArea=e}formatValue(t,i){return e.TimeUtilities.preciseMillisToString(t-this.zeroTime(),i)}maximumBoundary(){return this.maximumBoundaryInternal}minimumBoundary(){return this.minimumBoundaryInternal}zeroTime(){return this.zeroTimeInternal}boundarySpan(){return this.maximumBoundaryInternal-this.minimumBoundaryInternal}}var lt=Object.freeze({__proto__:null,Calculator:ot,Counter:at,CounterUI:st,CountersGraph:rt});function dt(e,t){const i=o.TargetManager.TargetManager.instance(),n=e.Workers.workerIdByThread.get(t.tid);return n?i.targetById(n):i.primaryPageTarget()}var ct=Object.freeze({__proto__:null,targetForEvent:dt}),ht={cssText:`.token-variable{color:var(--sys-color-token-variable)}.token-property{color:var(--sys-color-token-property)}.token-type{color:var(--sys-color-token-type)}.token-variable-special{color:var(--sys-color-token-variable-special)}.token-definition{color:var(--sys-color-token-definition)}.token-builtin{color:var(--sys-color-token-builtin)}.token-number{color:var(--sys-color-token-number)}.token-string{color:var(--sys-color-token-string)}.token-string-special{color:var(--sys-color-token-string-special)}.token-atom{color:var(--sys-color-token-atom)}.token-keyword{color:var(--sys-color-token-keyword)}.token-comment{color:var(--sys-color-token-comment)}.token-meta{color:var(--sys-color-token-meta)}.token-invalid{color:var(--sys-color-error)}.token-tag{color:var(--sys-color-token-tag)}.token-attribute{color:var(--sys-color-token-attribute)}.token-attribute-value{color:var(--sys-color-token-attribute-value)}.token-inserted{color:var(--sys-color-token-inserted)}.token-deleted{color:var(--sys-color-token-deleted)}.token-heading{color:var(--sys-color-token-variable-special);font-weight:bold}.token-link{color:var(--sys-color-token-variable-special);text-decoration:underline}.token-strikethrough{text-decoration:line-through}.token-strong{font-weight:bold}.token-emphasis{font-style:italic}\n/*# sourceURL=${import.meta.resolve("./codeHighlighter.css")} */\n`},pt={cssText:`.image-preview-container{background:transparent;text-align:center;border-spacing:0}.image-preview-container img{margin:6px 0;max-width:100px;max-height:100px;background-image:var(--image-file-checker);user-select:text;vertical-align:top;-webkit-user-drag:auto}.image-container{padding:0}.image-container > div{min-height:50px;display:flex;align-items:center;justify-content:center;cursor:pointer}.image-container > div.start{justify-content:start}.image-preview-container .row{line-height:1.2;vertical-align:baseline}.image-preview-container .title{padding-right:0.5em;color:var(--sys-color-token-subtle);white-space:nowrap;&.start{text-align:start}&.center{text-align:end}}.image-preview-container .description{white-space:nowrap;text-align:left;color:var(--sys-color-on-surface)}.image-preview-container .description-link{max-width:20em}.image-preview-container .source-link{white-space:normal;word-break:break-all;color:var(--sys-color-primary);cursor:pointer}\n/*# sourceURL=${import.meta.resolve("./imagePreview.css")} */\n`};let mt=null;class ut{#se=new WeakSet;static instance(e={forceNew:!1}){return mt&&!e.forceNew||(mt=new ut),mt}registerFreshRecording(e){this.#se.add(e)}recordingIsFresh(e){return this.#se.has(e)}}var gt=Object.freeze({__proto__:null,Tracker:ut});let vt=null;class Tt{static instance(e={forceNew:null}){const t=Boolean(e.forceNew);return vt&&!t||(vt=new Tt),vt}static removeInstance(){vt=null}#oe=[];activeFilters(){return this.#oe}setFilters(e){this.#oe=e}isVisible(e){return this.#oe.every((t=>t.accept(e)))}}function yt(e){return{event:e}}function ft(e,i){return{bounds:t.Helpers.Timing.traceWindowFromMilliSeconds(e,i)}}function St(e){return Boolean(e&&"event"in e)}function wt(e){return Boolean(e&&"bounds"in e)}function bt(e){if(wt(e))return e.bounds;if(St(e)){const i=t.Helpers.Timing.eventTimingsMicroSeconds(e.event);return t.Helpers.Timing.traceWindowFromMicroSeconds(i.startTime,i.endTime)}r.assertNever(e,"Unknown selection type")}function Et(e,i){return St(e)&&St(i)?e.event===i.event:!(!wt(e)||!wt(i))&&t.Helpers.Timing.windowsEqual(e.bounds,i.bounds)}var Ct=Object.freeze({__proto__:null,rangeForSelection:bt,selectionFromEvent:yt,selectionFromRangeMicroSeconds:function(e,i){return{bounds:t.Helpers.Timing.traceWindowFromMicroSeconds(e,i)}},selectionFromRangeMilliSeconds:ft,selectionIsEvent:St,selectionIsRange:wt,selectionsEqual:Et});const kt={performance:"Performance",selfTime:"Self time",totalTime:"Total time",activity:"Activity",selectItemForDetails:"Select item for details.",percentPlaceholder:"{PH1} %",chromeExtensionsOve