@yuebai008/cli/dist/cli-server/client/front_end/core/sdk/DOMDebuggerModel.js

Command line interface for rapid qg-minigame development

import*as Common from"../common/common.js";import*as i18n from"../i18n/i18n.js";import*as Platform from"../platform/platform.js";import{CategorizedBreakpoint}from"./CategorizedBreakpoint.js";import{DOMModel,Events as DOMModelEvents}from"./DOMModel.js";import{RemoteObject}from"./RemoteObject.js";import{RuntimeModel}from"./RuntimeModel.js";import{Capability}from"./Target.js";import{SDKModel}from"./SDKModel.js";import{TargetManager}from"./TargetManager.js";const UIStrings={trustedTypeViolations:"Trusted Type Violations",sinkViolations:"Sink Violations",policyViolations:"Policy Violations",animation:"Animation",canvas:"Canvas",geolocation:"Geolocation",notification:"Notification",parse:"Parse",script:"Script",timer:"Timer",window:"Window",webaudio:"WebAudio",media:"Media",pictureinpicture:"Picture-in-Picture",clipboard:"Clipboard",control:"Control",device:"Device",domMutation:"DOM Mutation",dragDrop:"Drag / drop",keyboard:"Keyboard",load:"Load",mouse:"Mouse",pointer:"Pointer",touch:"Touch",xhr:"XHR",setTimeoutOrIntervalFired:"{PH1} fired",scriptFirstStatement:"Script First Statement",scriptBlockedByContentSecurity:"Script Blocked by Content Security Policy",requestAnimationFrame:"Request Animation Frame",cancelAnimationFrame:"Cancel Animation Frame",animationFrameFired:"Animation Frame Fired",webglErrorFired:"WebGL Error Fired",webglWarningFired:"WebGL Warning Fired",setInnerhtml:"Set `innerHTML`",createCanvasContext:"Create canvas context",createAudiocontext:"Create `AudioContext`",closeAudiocontext:"Close `AudioContext`",resumeAudiocontext:"Resume `AudioContext`",suspendAudiocontext:"Suspend `AudioContext`",webglErrorFiredS:"WebGL Error Fired ({PH1})",scriptBlockedDueToContent:"Script blocked due to Content Security Policy directive: {PH1}",worker:"Worker"},str_=i18n.i18n.registerUIStrings("core/sdk/DOMDebuggerModel.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);function getInstrumentationBreakpointTitles(){return[["setTimeout.callback",i18nString(UIStrings.setTimeoutOrIntervalFired,{PH1:"setTimeout"})],["setInterval.callback",i18nString(UIStrings.setTimeoutOrIntervalFired,{PH1:"setInterval"})],["scriptFirstStatement",i18nString(UIStrings.scriptFirstStatement)],["scriptBlockedByCSP",i18nString(UIStrings.scriptBlockedByContentSecurity)],["requestAnimationFrame",i18nString(UIStrings.requestAnimationFrame)],["cancelAnimationFrame",i18nString(UIStrings.cancelAnimationFrame)],["requestAnimationFrame.callback",i18nString(UIStrings.animationFrameFired)],["webglErrorFired",i18nString(UIStrings.webglErrorFired)],["webglWarningFired",i18nString(UIStrings.webglWarningFired)],["Element.setInnerHTML",i18nString(UIStrings.setInnerhtml)],["canvasContextCreated",i18nString(UIStrings.createCanvasContext)],["Geolocation.getCurrentPosition","getCurrentPosition"],["Geolocation.watchPosition","watchPosition"],["Notification.requestPermission","requestPermission"],["DOMWindow.close","window.close"],["Document.write","document.write"],["audioContextCreated",i18nString(UIStrings.createAudiocontext)],["audioContextClosed",i18nString(UIStrings.closeAudiocontext)],["audioContextResumed",i18nString(UIStrings.resumeAudiocontext)],["audioContextSuspended",i18nString(UIStrings.suspendAudiocontext)]]}export class DOMDebuggerModel extends SDKModel{agent;#e;#t;#n;#r;suspended=!1;constructor(e){super(e),this.agent=e.domdebuggerAgent(),this.#e=e.model(RuntimeModel),this.#t=e.model(DOMModel),this.#t.addEventListener(DOMModelEvents.DocumentUpdated,this.documentUpdated,this),this.#t.addEventListener(DOMModelEvents.NodeRemoved,this.nodeRemoved,this),this.#n=[],this.#r=Common.Settings.Settings.instance().createLocalSetting("domBreakpoints",[]),this.#t.existingDocument()&&this.documentUpdated()}runtimeModel(){return this.#e}async suspendModel(){this.suspended=!0}async resumeModel(){this.suspended=!1}async eventListeners(e){if(console.assert(e.runtimeModel()===this.#e),!e.objectId)return[];const t=await this.agent.invoke_getEventListeners({objectId:e.objectId}),n=[];for(const r of t.listeners||[]){const t=this.#e.debuggerModel().createRawLocationByScriptId(r.scriptId,r.lineNumber,r.columnNumber);t&&n.push(new EventListener(this,e,r.type,r.useCapture,r.passive,r.once,r.handler?this.#e.createRemoteObject(r.handler):null,r.originalHandler?this.#e.createRemoteObject(r.originalHandler):null,t,null))}return n}retrieveDOMBreakpoints(){this.#t.requestDocument()}domBreakpoints(){return this.#n.slice()}hasDOMBreakpoint(e,t){return this.#n.some((n=>n.node===e&&n.type===t))}setDOMBreakpoint(e,t){for(const n of this.#n)if(n.node===e&&n.type===t)return this.toggleDOMBreakpoint(n,!0),n;const n=new DOMBreakpoint(this,e,t,!0);return this.#n.push(n),this.saveDOMBreakpoints(),this.enableDOMBreakpoint(n),this.dispatchEventToListeners(Events.DOMBreakpointAdded,n),n}removeDOMBreakpoint(e,t){this.removeDOMBreakpoints((n=>n.node===e&&n.type===t))}removeAllDOMBreakpoints(){this.removeDOMBreakpoints((e=>!0))}toggleDOMBreakpoint(e,t){t!==e.enabled&&(e.enabled=t,t?this.enableDOMBreakpoint(e):this.disableDOMBreakpoint(e),this.dispatchEventToListeners(Events.DOMBreakpointToggled,e))}enableDOMBreakpoint(e){e.node.id&&(this.agent.invoke_setDOMBreakpoint({nodeId:e.node.id,type:e.type}),e.node.setMarker(Marker,!0))}disableDOMBreakpoint(e){e.node.id&&(this.agent.invoke_removeDOMBreakpoint({nodeId:e.node.id,type:e.type}),e.node.setMarker(Marker,!!this.nodeHasBreakpoints(e.node)||null))}nodeHasBreakpoints(e){for(const t of this.#n)if(t.node===e&&t.enabled)return!0;return!1}resolveDOMBreakpointData(e){const t=e.type,n=this.#t.nodeForId(e.nodeId);if(!t||!n)return null;let r=null,i=!1;return"subtree-modified"===t&&(i=e.insertion||!1,r=this.#t.nodeForId(e.targetNodeId)),{type:t,node:n,targetNode:r,insertion:i}}currentURL(){const e=this.#t.existingDocument();return e?e.documentURL:Platform.DevToolsPath.EmptyUrlString}async documentUpdated(){if(this.suspended)return;const e=this.#n;this.#n=[],this.dispatchEventToListeners(Events.DOMBreakpointsRemoved,e);const t=await this.#t.requestDocument(),n=t?t.documentURL:Platform.DevToolsPath.EmptyUrlString;for(const e of this.#r.get())e.url===n&&this.#t.pushNodeByPathToFrontend(e.path).then(r.bind(this,e));function r(e,t){const n=t?this.#t.nodeForId(t):null;if(!n)return;const r=new DOMBreakpoint(this,n,e.type,e.enabled);this.#n.push(r),e.enabled&&this.enableDOMBreakpoint(r),this.dispatchEventToListeners(Events.DOMBreakpointAdded,r)}}removeDOMBreakpoints(e){const t=[],n=[];for(const r of this.#n)e(r)?(t.push(r),r.enabled&&(r.enabled=!1,this.disableDOMBreakpoint(r))):n.push(r);t.length&&(this.#n=n,this.saveDOMBreakpoints(),this.dispatchEventToListeners(Events.DOMBreakpointsRemoved,t))}nodeRemoved(e){if(this.suspended)return;const{node:t}=e.data,n=t.children()||[];this.removeDOMBreakpoints((e=>e.node===t||-1!==n.indexOf(e.node)))}saveDOMBreakpoints(){const e=this.currentURL(),t=this.#r.get().filter((t=>t.url!==e));for(const n of this.#n)t.push({url:e,path:n.node.path(),type:n.type,enabled:n.enabled});this.#r.set(t)}}export var Events;!function(e){e.DOMBreakpointAdded="DOMBreakpointAdded",e.DOMBreakpointToggled="DOMBreakpointToggled",e.DOMBreakpointsRemoved="DOMBreakpointsRemoved"}(Events||(Events={}));const Marker="breakpoint-marker";export class DOMBreakpoint{domDebuggerModel;node;type;enabled;constructor(e,t,n,r){this.domDebuggerModel=e,this.node=t,this.type=n,this.enabled=r}}export class EventListener{#i;#o;#s;#a;#l;#d;#c;#u;#p;#m;#g;#h;constructor(e,t,n,r,i,o,s,a,l,d,c){this.#i=e,this.#o=t,this.#s=n,this.#a=r,this.#l=i,this.#d=o,this.#c=s,this.#u=a||s,this.#p=l;const u=l.script();this.#m=u?u.contentURL():Platform.DevToolsPath.EmptyUrlString,this.#g=d,this.#h=c||EventListener.Origin.Raw}domDebuggerModel(){return this.#i}type(){return this.#s}useCapture(){return this.#a}passive(){return this.#l}once(){return this.#d}handler(){return this.#c}location(){return this.#p}sourceURL(){return this.#m}originalHandler(){return this.#u}canRemove(){return Boolean(this.#g)||this.#h!==EventListener.Origin.FrameworkUser}remove(){if(!this.canRemove())return Promise.resolve(void 0);if(this.#h!==EventListener.Origin.FrameworkUser){function e(e,t,n){this.removeEventListener(e,t,n),this["on"+e]&&(this["on"+e]=void 0)}return this.#o.callFunction(e,[RemoteObject.toCallArgument(this.#s),RemoteObject.toCallArgument(this.#u),RemoteObject.toCallArgument(this.#a)]).then((()=>{}))}if(this.#g){function t(e,t,n,r){this.call(null,e,t,n,r)}return this.#g.callFunction(t,[RemoteObject.toCallArgument(this.#s),RemoteObject.toCallArgument(this.#u),RemoteObject.toCallArgument(this.#a),RemoteObject.toCallArgument(this.#l)]).then((()=>{}))}return Promise.resolve(void 0)}canTogglePassive(){return this.#h!==EventListener.Origin.FrameworkUser}togglePassive(){return this.#o.callFunction((function(e,t,n,r){this.removeEventListener(e,t,{capture:n}),this.addEventListener(e,t,{capture:n,passive:!r})}),[RemoteObject.toCallArgument(this.#s),RemoteObject.toCallArgument(this.#u),RemoteObject.toCallArgument(this.#a),RemoteObject.toCallArgument(this.#l)]).then((()=>{}))}origin(){return this.#h}markAsFramework(){this.#h=EventListener.Origin.Framework}isScrollBlockingType(){return"touchstart"===this.#s||"touchmove"===this.#s||"mousewheel"===this.#s||"wheel"===this.#s}}!function(e){let t;!function(e){e.Raw="Raw",e.Framework="Framework",e.FrameworkUser="FrameworkUser"}(t=e.Origin||(e.Origin={}))}(EventListener||(EventListener={}));export class CSPViolationBreakpoint extends CategorizedBreakpoint{#s;constructor(e,t,n){super(e,t),this.#s=n}type(){return this.#s}}export class DOMEventListenerBreakpoint extends CategorizedBreakpoint{instrumentationName;eventName;eventTargetNames;constructor(e,t,n,r,i){super(r,i),this.instrumentationName=e,this.eventName=t,this.eventTargetNames=n}setEnabled(e){if(this.enabled()!==e){super.setEnabled(e);for(const e of TargetManager.instance().models(DOMDebuggerModel))this.updateOnModel(e)}}updateOnModel(e){if(this.instrumentationName)this.enabled()?e.agent.invoke_setInstrumentationBreakpoint({eventName:this.instrumentationName}):e.agent.invoke_removeInstrumentationBreakpoint({eventName:this.instrumentationName});else for(const t of this.eventTargetNames)this.enabled()?e.agent.invoke_setEventListenerBreakpoint({eventName:this.eventName,targetName:t}):e.agent.invoke_removeEventListenerBreakpoint({eventName:this.eventName,targetName:t})}static listener="listener:";static instrumentation="instrumentation:"}let domDebuggerManagerInstance;export class DOMDebuggerManager{#k;#v;#I;#B;constructor(){this.#k=Common.Settings.Settings.instance().createLocalSetting("xhrBreakpoints",[]),this.#v=new Map;for(const e of this.#k.get())this.#v.set(e.url,e.enabled);this.#I=[],this.#I.push(new CSPViolationBreakpoint(i18nString(UIStrings.trustedTypeViolations),i18nString(UIStrings.sinkViolations),"trustedtype-sink-violation")),this.#I.push(new CSPViolationBreakpoint(i18nString(UIStrings.trustedTypeViolations),i18nString(UIStrings.policyViolations),"trustedtype-policy-violation")),this.#B=[],this.createInstrumentationBreakpoints(i18nString(UIStrings.animation),["requestAnimationFrame","cancelAnimationFrame","requestAnimationFrame.callback"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.canvas),["canvasContextCreated","webglErrorFired","webglWarningFired"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.geolocation),["Geolocation.getCurrentPosition","Geolocation.watchPosition"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.notification),["Notification.requestPermission"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.parse),["Element.setInnerHTML","Document.write"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.script),["scriptFirstStatement","scriptBlockedByCSP"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.timer),["setTimeout","clearTimeout","setInterval","clearInterval","setTimeout.callback","setInterval.callback"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.window),["DOMWindow.close"]),this.createInstrumentationBreakpoints(i18nString(UIStrings.webaudio),["audioContextCreated","audioContextClosed","audioContextResumed","audioContextSuspended"]),this.createEventListenerBreakpoints(i18nString(UIStrings.media),["play","pause","playing","canplay","canplaythrough","seeking","seeked","timeupdate","ended","ratechange","durationchange","volumechange","loadstart","progress","suspend","abort","error","emptied","stalled","loadedmetadata","loadeddata","waiting"],["audio","video"]),this.createEventListenerBreakpoints(i18nString(UIStrings.pictureinpicture),["enterpictureinpicture","leavepictureinpicture"],["video"]),this.createEventListenerBreakpoints(i18nString(UIStrings.pictureinpicture),["resize"],["PictureInPictureWindow"]),this.createEventListenerBreakpoints(i18nString(UIStrings.pictureinpicture),["enter"],["documentPictureInPicture"]),this.createEventListenerBreakpoints(i18nString(UIStrings.clipboard),["copy","cut","paste","beforecopy","beforecut","beforepaste"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.control),["resize","scroll","scrollend","zoom","focus","blur","select","change","submit","reset"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.device),["deviceorientation","devicemotion"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.domMutation),["DOMActivate","DOMFocusIn","DOMFocusOut","DOMAttrModified","DOMCharacterDataModified","DOMNodeInserted","DOMNodeInsertedIntoDocument","DOMNodeRemoved","DOMNodeRemovedFromDocument","DOMSubtreeModified","DOMContentLoaded"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.dragDrop),["drag","dragstart","dragend","dragenter","dragover","dragleave","drop"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.keyboard),["keydown","keyup","keypress","input"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.load),["load","beforeunload","unload","abort","error","hashchange","popstate","navigate","navigatesuccess","navigateerror","currentchange","navigateto","navigatefrom","finish","dispose"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.mouse),["auxclick","click","dblclick","mousedown","mouseup","mouseover","mousemove","mouseout","mouseenter","mouseleave","mousewheel","wheel","contextmenu"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.pointer),["pointerover","pointerout","pointerenter","pointerleave","pointerdown","pointerup","pointermove","pointercancel","gotpointercapture","lostpointercapture","pointerrawupdate"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.touch),["touchstart","touchmove","touchend","touchcancel"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.worker),["message","messageerror"],["*"]),this.createEventListenerBreakpoints(i18nString(UIStrings.xhr),["readystatechange","load","loadstart","loadend","abort","error","progress","timeout"],["xmlhttprequest","xmlhttprequestupload"]);for(const[e,t]of getInstrumentationBreakpointTitles()){const n=this.resolveEventListenerBreakpointInternal("instrumentation:"+e);n&&n.setTitle(t)}TargetManager.instance().observeModels(DOMDebuggerModel,this)}static instance(e={forceNew:null}){const{forceNew:t}=e;return domDebuggerManagerInstance&&!t||(domDebuggerManagerInstance=new DOMDebuggerManager),domDebuggerManagerInstance}cspViolationBreakpoints(){return this.#I.slice()}createInstrumentationBreakpoints(e,t){for(const n of t)this.#B.push(new DOMEventListenerBreakpoint(n,"",[],e,n))}createEventListenerBreakpoints(e,t,n){for(const r of t)this.#B.push(new DOMEventListenerBreakpoint("",r,n,e,r))}resolveEventListenerBreakpointInternal(e,t){const n="instrumentation:",r="listener:";let i="";if(e.startsWith(n))i=e.substring(16),e="";else{if(!e.startsWith(r))return null;e=e.substring(9)}t=(t||"*").toLowerCase();let o=null;for(const n of this.#B)i&&n.instrumentationName===i&&(o=n),e&&n.eventName===e&&-1!==n.eventTargetNames.indexOf(t)&&(o=n),!o&&e&&n.eventName===e&&-1!==n.eventTargetNames.indexOf("*")&&(o=n);return o}eventListenerBreakpoints(){return this.#B.slice()}resolveEventListenerBreakpointTitle(e){const t=e.eventName;if("instrumentation:webglErrorFired"===t&&e.webglErrorName){let t=e.webglErrorName;return t=t.replace(/^.*(0x[0-9a-f]+).*$/i,"$1"),i18nString(UIStrings.webglErrorFiredS,{PH1:t})}if("instrumentation:scriptBlockedByCSP"===t&&e.directiveText)return i18nString(UIStrings.scriptBlockedDueToContent,{PH1:e.directiveText});const n=this.resolveEventListenerBreakpointInternal(t,e.targetName);return n?e.targetName?e.targetName+"."+n.title():n.title():""}resolveEventListenerBreakpoint(e){return this.resolveEventListenerBreakpointInternal(e.eventName,e.targetName)}updateCSPViolationBreakpoints(){const e=this.#I.filter((e=>e.enabled())).map((e=>e.type()));for(const t of TargetManager.instance().models(DOMDebuggerModel))this.updateCSPViolationBreakpointsForModel(t,e)}updateCSPViolationBreakpointsForModel(e,t){e.agent.invoke_setBreakOnCSPViolation({violationTypes:t})}xhrBreakpoints(){return this.#v}saveXHRBreakpoints(){const e=[];for(const t of this.#v.keys())e.push({url:t,enabled:this.#v.get(t)||!1});this.#k.set(e)}addXHRBreakpoint(e,t){if(this.#v.set(e,t),t)for(const t of TargetManager.instance().models(DOMDebuggerModel))t.agent.invoke_setXHRBreakpoint({url:e});this.saveXHRBreakpoints()}removeXHRBreakpoint(e){const t=this.#v.get(e);if(this.#v.delete(e),t)for(const t of TargetManager.instance().models(DOMDebuggerModel))t.agent.invoke_removeXHRBreakpoint({url:e});this.saveXHRBreakpoints()}toggleXHRBreakpoint(e,t){this.#v.set(e,t);for(const n of TargetManager.instance().models(DOMDebuggerModel))t?n.agent.invoke_setXHRBreakpoint({url:e}):n.agent.invoke_removeXHRBreakpoint({url:e});this.saveXHRBreakpoints()}modelAdded(e){for(const t of this.#v.keys())this.#v.get(t)&&e.agent.invoke_setXHRBreakpoint({url:t});for(const t of this.#B)t.enabled()&&t.updateOnModel(e);const t=this.#I.filter((e=>e.enabled())).map((e=>e.type()));this.updateCSPViolationBreakpointsForModel(e,t)}modelRemoved(e){}}SDKModel.register(DOMDebuggerModel,{capabilities:Capability.DOM,autostart:!1});