@yuebai008/cli/dist/cli-server/client/front_end/ui/legacy/components/object_ui/ObjectPropertiesSection.js

Command line interface for rapid qg-minigame development

import*as Common from"../../../../core/common/common.js";import*as Root from"../../../../core/root/root.js";import*as Host from"../../../../core/host/host.js";import*as i18n from"../../../../core/i18n/i18n.js";import*as LinearMemoryInspector from"../../../components/linear_memory_inspector/linear_memory_inspector.js";import*as Platform from"../../../../core/platform/platform.js";import*as SDK from"../../../../core/sdk/sdk.js";import*as TextUtils from"../../../../models/text_utils/text_utils.js";import*as JavaScriptMetaData from"../../../../models/javascript_metadata/javascript_metadata.js";import*as IconButton from"../../../components/icon_button/icon_button.js";import*as TextEditor from"../../../components/text_editor/text_editor.js";import*as UI from"../../legacy.js";import{CustomPreviewComponent}from"./CustomPreviewComponent.js";import{JavaScriptREPL}from"./JavaScriptREPL.js";import{createSpansForNodeTitle,RemoteObjectPreviewFormatter}from"./RemoteObjectPreviewFormatter.js";import objectValueStyles from"./objectValue.css.js";import objectPropertiesSectionStyles from"./objectPropertiesSection.css.js";const UIStrings={exceptionS:"[Exception: {PH1}]",unknown:"unknown",expandRecursively:"Expand recursively",collapseChildren:"Collapse children",noProperties:"No properties",dots:"(...)",invokePropertyGetter:"Invoke property getter",showAllD:"Show all {PH1}",valueUnavailable:"<value unavailable>",valueNotAccessibleToTheDebugger:"Value is not accessible to the debugger",copyValue:"Copy value",copyPropertyPath:"Copy property path",stringIsTooLargeToEdit:"<string is too large to edit>",showMoreS:"Show more ({PH1})",longTextWasTruncatedS:"long text was truncated ({PH1})",copy:"Copy",revealInMemoryInpector:"Reveal in Memory Inspector panel"},str_=i18n.i18n.registerUIStrings("ui/legacy/components/object_ui/ObjectPropertiesSection.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_),EXPANDABLE_MAX_LENGTH=50,EXPANDABLE_MAX_DEPTH=100,parentMap=new WeakMap,objectPropertiesSectionMap=new WeakMap,domPinnedProperties=JavaScriptMetaData.JavaScriptMetadata.JavaScriptMetadataImpl.domPinnedProperties.DOMPinnedProperties;export const getObjectPropertiesSectionFrom=e=>objectPropertiesSectionMap.get(e);export class ObjectPropertiesSection extends UI.TreeOutline.TreeOutlineInShadow{object;editable;objectTreeElementInternal;titleElement;skipProtoInternal;constructor(e,t,n,i){super(),this.object=e,this.editable=!0,i||this.hideOverflow(),this.setFocusable(!0),this.setShowSelectionOnKeyboardFocus(!0),this.objectTreeElementInternal=new RootElement(e,n),this.appendChild(this.objectTreeElementInternal),"string"!=typeof t&&t?(this.titleElement=t,this.element.appendChild(t)):(this.titleElement=this.element.createChild("span"),this.titleElement.textContent=t||""),this.titleElement instanceof HTMLElement&&!this.titleElement.hasAttribute("tabIndex")&&(this.titleElement.tabIndex=-1),objectPropertiesSectionMap.set(this.element,this),this.registerCSSFiles([objectValueStyles,objectPropertiesSectionStyles]),this.rootElement().childrenListElement.classList.add("source-code","object-properties-section")}static defaultObjectPresentation(e,t,n,i){const r=ObjectPropertiesSection.defaultObjectPropertiesSection(e,t,n,i);return e.hasChildren?r.element:r.titleElement}static defaultObjectPropertiesSection(e,t,n,i){const r=document.createElement("span");r.classList.add("source-code");const s=UI.Utils.createShadowRootWithCoreStyles(r,{cssFile:[objectValueStyles],delegatesFocus:void 0}),o=ObjectPropertiesSection.createPropertyValue(e,!1,!0);s.appendChild(o.element);const a=new ObjectPropertiesSection(e,r,t);return a.editable=!1,n&&a.skipProto(),i&&a.setEditable(!1),a}static assignWebIDLMetadata(e,t){if(!e)return;const n="object"===e.type&&null!==e.className?domPinnedProperties[e.className]:void 0;if(!n)return;e.webIdl={info:n,state:new Map};const i=(n.includes?.map((e=>domPinnedProperties[e]))??[]).flatMap((e=>Object.entries(e?.props??{}))),r={...n.props,...Object.fromEntries(i)};for(const e of t){const t=r[e.name];t&&(e.webIdl={info:t})}}static getPropertyValuesByNames(e){const t=new Map;for(const n of e)t.set(n.name,n.value);return t}static compareProperties(e,t){if(!e.synthetic&&t.synthetic)return 1;if(!t.synthetic&&e.synthetic)return-1;if(!e.isOwn&&t.isOwn)return 1;if(!t.isOwn&&e.isOwn)return-1;if(!e.enumerable&&t.enumerable)return 1;if(!t.enumerable&&e.enumerable)return-1;if(e.symbol&&!t.symbol)return 1;if(t.symbol&&!e.symbol)return-1;if(e.private&&!t.private)return 1;if(t.private&&!e.private)return-1;const n=e.name,i=t.name;return n.startsWith("_")&&!i.startsWith("_")?1:i.startsWith("_")&&!n.startsWith("_")?-1:Platform.StringUtilities.naturalOrderComparator(n,i)}static createNameElement(e,t){return null===e?UI.Fragment.html`<span class="name"></span>`:/^\s|\s$|^$|\n/.test(e)?UI.Fragment.html`<span class="name">"${e.replace(/\n/g,"↵")}"</span>`:t?UI.Fragment.html`<span class="name">
  <span class="private-property-hash">${e[0]}</span>${e.substring(1)}
  </span>`:UI.Fragment.html`<span class="name">${e}</span>`}static valueElementForFunctionDescription(e,t,n){const i=document.createElement("span");i.classList.add("object-value-function");const r=(e=e||"").replace(/^function [gs]et /,"function ").replace(/^function [gs]et\(/,"function(").replace(/^[gs]et /,"");n=n||"";const s=r.match(/^(async\s+function)/),o=r.startsWith("function*"),a=r.startsWith("*"),l=!o&&r.startsWith("function"),p=r.startsWith("class ")||r.startsWith("class{"),c=r.indexOf("=>"),d=!s&&!o&&!l&&!p&&c>0;let h;if(p){h=r.substring(5);const e=/^[^{\s]+/.exec(h.trim());let t=n;e&&(t=e[0].trim()||n),u("class",h,t)}else if(s)h=r.substring(s[1].length),u("async ƒ",h,m(h));else if(o)h=r.substring(9),u("ƒ*",h,m(h));else if(a)h=r.substring(1),u("ƒ*",h,m(h));else if(l)h=r.substring(8),u("ƒ",h,m(h));else if(d){const e=60;let t=r;n?t=n+"()":r.length>e&&(t=r.substring(0,c+2)+" {…}"),u("",r,t)}else u("ƒ",r,m(r));return UI.Tooltip.Tooltip.install(i,Platform.StringUtilities.trimEndWithMaxLength(e,500)),i;function m(e){const t=e.indexOf("("),i=e.match(/\)\s*{/);if(-1!==t&&i&&void 0!==i.index&&i.index>t){return(e.substring(0,t).trim()||n)+e.substring(t,i.index+1)}return n+"()"}function u(e,n,r){e.length&&(i.createChild("span","object-value-function-prefix").textContent=e+" "),t?UI.UIUtils.createTextChild(i,Platform.StringUtilities.trimEndWithMaxLength(n.trim(),200)):UI.UIUtils.createTextChild(i,r.replace(/\n/g," "))}}static createPropertyValueWithCustomSupport(e,t,n,i,r,s,o){if(e.customPreview()){const t=new CustomPreviewComponent(e).element;return t.classList.add("object-properties-section-custom-section"),new ObjectPropertyValue(t)}return ObjectPropertiesSection.createPropertyValue(e,t,n,i,r,s,o)}static appendMemoryIcon(e,t,n){if(!("object"===t.type&&t.subtype&&LinearMemoryInspector.LinearMemoryInspectorController.ACCEPTED_MEMORY_TYPES.includes(t.subtype))&&!LinearMemoryInspector.LinearMemoryInspectorController.isDWARFMemoryObject(t))return;const i=new IconButton.Icon.Icon;i.data={iconName:"memory",color:"var(--icon-default)",width:"16px",height:"13px"},i.onclick=async e=>{e.stopPropagation();const i=LinearMemoryInspector.LinearMemoryInspectorController.LinearMemoryInspectorController.instance();Host.userMetrics.linearMemoryInspectorRevealedFrom(Host.UserMetrics.LinearMemoryInspectorRevealedFrom.MemoryIcon),i.openInspectorView(t,void 0,n)};const r=i18nString(UIStrings.revealInMemoryInpector);UI.Tooltip.Tooltip.install(i,r),UI.ARIAUtils.setLabel(i,r),i.style.setProperty("vertical-align","sub"),i.style.setProperty("cursor","pointer"),e.appendChild(i)}static createPropertyValue(e,t,n,i,r,s=!1,o){let a;const l=e.type,p=e.subtype,c=e.description||"",d=e.className;if("object"===l&&"internal#location"===p){const t=e.debuggerModel().createRawLocationByScriptId(e.value.scriptId,e.value.lineNumber,e.value.columnNumber);if(t&&r)return new ObjectPropertyValue(r.linkifyRawLocation(t,Platform.DevToolsPath.EmptyUrlString));a=new ObjectPropertyValue(function(){const e=document.createElement("span");return e.textContent="<"+i18nString(UIStrings.unknown)+">",UI.Tooltip.Tooltip.install(e,c||""),e}())}else if("string"===l&&"string"==typeof c)a=h();else if("object"===l&&"trustedtype"===p)a=function(){const e=document.createElement("span");e.classList.add("object-value-trustedtype");const t=`${d} "${c}"`;let n;if(t.length>maxRenderableStringLength)n=new ExpandableTextPropertyValue(e,t,50);else{const i=h();UI.UIUtils.createTextChild(e,`${d} `),e.appendChild(i.element),n=new ObjectPropertyValue(e),UI.Tooltip.Tooltip.install(e,t)}return n}();else if("function"===l)a=new ObjectPropertyValue(ObjectPropertiesSection.valueElementForFunctionDescription(c));else if("object"===l&&"node"===p&&c)a=new ObjectPropertyValue(function(){const t=document.createElement("span");return t.classList.add("object-value-node"),createSpansForNodeTitle(t,c),t.addEventListener("click",(t=>{Common.Revealer.reveal(e),t.consume(!0)}),!1),t.addEventListener("mousemove",(()=>SDK.OverlayModel.OverlayModel.highlightObjectAsDOMNode(e)),!1),t.addEventListener("mouseleave",(()=>SDK.OverlayModel.OverlayModel.hideDOMNodeHighlight()),!1),t}());else{const t=document.createElement("span");if(t.classList.add("object-value-"+(p||l)),e.preview&&n){(new RemoteObjectPreviewFormatter).appendObjectPreview(t,e.preview,!1),a=new ObjectPropertyValue(t),UI.Tooltip.Tooltip.install(a.element,c||"")}else c.length>maxRenderableStringLength?a=new ExpandableTextPropertyValue(t,c,50):(a=new ObjectPropertyValue(t),a.element.textContent=c,UI.Tooltip.Tooltip.install(a.element,c));s||this.appendMemoryIcon(t,e,o)}if(t){const e=document.createElement("span");e.classList.add("error"),e.classList.add("value"),e.appendChild(i18n.i18n.getFormatLocalizedString(str_,UIStrings.exceptionS,{PH1:a.element})),a.element=e}return a.element.classList.add("value"),a;function h(){const e=document.createElement("span");e.classList.add("object-value-string");const t=JSON.stringify(c);let n;return c.length>maxRenderableStringLength?n=new ExpandableTextPropertyValue(e,t,50):(UI.UIUtils.createTextChild(e,t),n=new ObjectPropertyValue(e),UI.Tooltip.Tooltip.install(e,c)),n}}static formatObjectAsFunction(e,t,n,i){return e.debuggerModel().functionDetailsPromise(e).then((function(r){n&&r&&r.location&&(t.classList.add("linkified"),t.addEventListener("click",(()=>(Common.Revealer.reveal(r.location),!1))));let s=i?"":"anonymous";r&&r.functionName&&(s=r.functionName);const o=ObjectPropertiesSection.valueElementForFunctionDescription(e.description,i,s);t.appendChild(o)}))}static isDisplayableProperty(e,t){if(!t||!t.synthetic)return!0;const n=e.name;return!("[[Entries]]"===t.name&&("length"===n||"__proto__"===n))}skipProto(){this.skipProtoInternal=!0}expand(){this.objectTreeElementInternal.expand()}setEditable(e){this.editable=e}objectTreeElement(){return this.objectTreeElementInternal}enableContextMenu(){this.element.addEventListener("contextmenu",this.contextMenuEventFired.bind(this),!1)}contextMenuEventFired(e){const t=new UI.ContextMenu.ContextMenu(e);t.appendApplicableItems(this.object),this.object instanceof SDK.RemoteObject.LocalJSONObject&&(t.viewSection().appendItem(i18nString(UIStrings.expandRecursively),this.objectTreeElementInternal.expandRecursively.bind(this.objectTreeElementInternal,100)),t.viewSection().appendItem(i18nString(UIStrings.collapseChildren),this.objectTreeElementInternal.collapseChildren.bind(this.objectTreeElementInternal))),t.show()}titleLessMode(){this.objectTreeElementInternal.listItemElement.classList.add("hidden"),this.objectTreeElementInternal.childrenListElement.classList.add("title-less-mode"),this.objectTreeElementInternal.expand()}}const ARRAY_LOAD_THRESHOLD=100;let maxRenderableStringLength=1e4;export function setMaxRenderableStringLength(e){maxRenderableStringLength=e}export function getMaxRenderableStringLength(){return maxRenderableStringLength}export class ObjectPropertiesSectionsTreeOutline extends UI.TreeOutline.TreeOutlineInShadow{editable;constructor(e){super(),this.registerCSSFiles([objectValueStyles,objectPropertiesSectionStyles]),this.editable=!(e&&e.readOnly),this.contentElement.classList.add("source-code"),this.contentElement.classList.add("object-properties-section"),this.hideOverflow()}}export class RootElement extends UI.TreeOutline.TreeElement{object;linkifier;emptyPlaceholder;propertiesMode;extraProperties;targetObject;toggleOnClick;constructor(e,t,n,i=1,r=[],s=e){super(document.createElement("slot")),this.object=e,this.linkifier=t,this.emptyPlaceholder=n,this.propertiesMode=i,this.extraProperties=r,this.targetObject=s,this.setExpandable(!0),this.selectable=!0,this.toggleOnClick=!0,this.listItemElement.classList.add("object-properties-section-root-element"),this.listItemElement.addEventListener("contextmenu",this.onContextMenu.bind(this),!1)}onexpand(){this.treeOutline&&this.treeOutline.element.classList.add("expanded")}oncollapse(){this.treeOutline&&this.treeOutline.element.classList.remove("expanded")}ondblclick(e){return!0}onContextMenu(e){const t=new UI.ContextMenu.ContextMenu(e);if(t.appendApplicableItems(this.object),this.object instanceof SDK.RemoteObject.LocalJSONObject){const{value:e}=this.object,n="object"==typeof e?JSON.stringify(e,null,2):e,i=()=>{Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue),Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(n)};t.clipboardSection().appendItem(i18nString(UIStrings.copyValue),i)}t.viewSection().appendItem(i18nString(UIStrings.expandRecursively),this.expandRecursively.bind(this,100)),t.viewSection().appendItem(i18nString(UIStrings.collapseChildren),this.collapseChildren.bind(this)),t.show()}async onpopulate(){const e=this.treeOutline,t=!!e&&Boolean(e.skipProtoInternal);return ObjectPropertyTreeElement.populate(this,this.object,t,!1,this.linkifier,this.emptyPlaceholder,this.propertiesMode,this.extraProperties,this.targetObject)}}export const InitialVisibleChildrenLimit=200;export class ObjectPropertyTreeElement extends UI.TreeOutline.TreeElement{property;toggleOnClick;highlightChanges;linkifier;maxNumPropertiesToShow;nameElement;valueElement;rowContainer;readOnly;prompt;editableDiv;propertyValue;expandedValueElement;constructor(e,t){super(),this.property=e,this.toggleOnClick=!0,this.highlightChanges=[],this.linkifier=t,this.maxNumPropertiesToShow=200,this.listItemElement.addEventListener("contextmenu",this.contextMenuFired.bind(this),!1),this.listItemElement.dataset.objectPropertyNameForTest=e.name,this.setExpandRecursively("[[Prototype]]"!==e.name)}static async populate(e,t,n,i,r,s,o=1,a,l){if(t.arrayLength()>100)return e.removeChildren(),void ArrayGroupingTreeElement.populateArray(e,t,0,t.arrayLength()-1,r);let p,c=null;switch(o){case 0:({properties:p}=await t.getAllProperties(!1,!0));break;case 1:({properties:p,internalProperties:c}=await SDK.RemoteObject.RemoteObject.loadFromObjectPerProto(t,!0))}e.removeChildren(),p&&(void 0!==a&&p.push(...a),ObjectPropertyTreeElement.populateWithProperties(e,p,c,n,i,l||t,r,s))}static populateWithProperties(e,t,n,i,r,s,o,a){ObjectPropertiesSection.assignWebIDLMetadata(s,t);const l=ObjectPropertiesSection.getPropertyValuesByNames(t);if(s?.webIdl){const e=s.webIdl.info.rules;if(e)for(const{when:t,is:n}of e)l.get(t)?.value===n&&s.webIdl.state.set(t,n);for(const n of t)if(n.webIdl){const t=s.webIdl.state,i=n.webIdl.info.rules;n.webIdl.applicable=!e&&!i||(!i||i?.some((e=>t.get(e.when)===e.is)))}}t.sort(ObjectPropertiesSection.compareProperties);const p=(n=n||[]).find((e=>"[[Entries]]"===e.name));if(p){parentMap.set(p,s);const t=new ObjectPropertyTreeElement(p,o);t.setExpandable(!0),t.expand(),e.appendChild(t)}const c=[];for(let n=0;n<t.length;++n){const i=t[n];if(parentMap.set(i,s),!ObjectPropertiesSection.isDisplayableProperty(i,e.property))continue;if(i.isOwn&&!r){if(i.getter){const e=new SDK.RemoteObject.RemoteObjectProperty("get "+i.name,i.getter,!1);parentMap.set(e,s),c.push(e)}if(i.setter){const e=new SDK.RemoteObject.RemoteObjectProperty("set "+i.name,i.setter,!1);parentMap.set(e,s),c.push(e)}}if(i.getter||!i.isAccessorProperty()){const t=new ObjectPropertyTreeElement(i,o);"memories"===i.name&&"Memories"===i.value?.className&&(t.updateExpandable(),t.isExpandable()&&t.expand()),e.appendChild(t)}}for(let t=0;t<c.length;++t)e.appendChild(new ObjectPropertyTreeElement(c[t],o));for(const t of n){parentMap.set(t,s);const n=new ObjectPropertyTreeElement(t,o);"[[Entries]]"!==t.name&&("[[Prototype]]"===t.name&&i||e.appendChild(n))}ObjectPropertyTreeElement.appendEmptyPlaceholderIfNeeded(e,a)}static appendEmptyPlaceholderIfNeeded(e,t){if(e.childCount())return;const n=document.createElement("div");n.classList.add("gray-info-message"),n.textContent=t||i18nString(UIStrings.noProperties);const i=new UI.TreeOutline.TreeElement(n);e.appendChild(i)}static createRemoteObjectAccessorPropertySpan(e,t,n){const i=document.createElement("span"),r=i.createChild("span");if(r.textContent=i18nString(UIStrings.dots),!e)return i;function s(e){let t=this;const n=JSON.parse(e);for(let e=0,i=n.length;e<i;++e)t=t[n[e]];return t}return r.classList.add("object-value-calculate-value-button"),UI.Tooltip.Tooltip.install(r,i18nString(UIStrings.invokePropertyGetter)),r.addEventListener("click",(function(i){i.consume(),e&&e.callFunction(s,[{value:JSON.stringify(t)}]).then(n)}),!1),i}setSearchRegex(e,t){let n=UI.UIUtils.highlightedSearchResultClassName;if(t&&(n+=" "+t),this.revertHighlightChanges(),this.applySearch(e,this.nameElement,n),this.property.value){"object"!==this.property.value.type&&this.applySearch(e,this.valueElement,n)}return Boolean(this.highlightChanges.length)}applySearch(e,t,n){const i=[],r=t.textContent||"";e.lastIndex=0;let s=e.exec(r);for(;s;)i.push(new TextUtils.TextRange.SourceRange(s.index,s[0].length)),s=e.exec(r);i.length&&UI.UIUtils.highlightRangesWithStyleClass(t,i,n,this.highlightChanges)}showAllPropertiesElementSelected(e){return this.removeChild(e),this.children().forEach((e=>{e.hidden=!1})),!1}createShowAllPropertiesButton(){const e=document.createElement("div");e.classList.add("object-value-calculate-value-button"),e.textContent=i18nString(UIStrings.dots),UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.showAllD,{PH1:this.childCount()}));const t=this.children();for(let e=this.maxNumPropertiesToShow;e<this.childCount();++e)t[e].hidden=!0;const n=new UI.TreeOutline.TreeElement(e);n.onselect=this.showAllPropertiesElementSelected.bind(this,n),this.appendChild(n)}revertHighlightChanges(){UI.UIUtils.revertDomChanges(this.highlightChanges),this.highlightChanges=[]}async onpopulate(){const e=this.property.value;console.assert(void 0!==e);const t=this.treeOutline,n=!!t&&Boolean(t.skipProtoInternal),i="[[Prototype]]"!==this.property.name?e:parentMap.get(this.property);i&&(await ObjectPropertyTreeElement.populate(this,e,n,!1,this.linkifier,void 0,void 0,void 0,i),this.childCount()>this.maxNumPropertiesToShow&&this.createShowAllPropertiesButton())}ondblclick(e){const t=e.target,n=t.isSelfOrDescendant(this.valueElement)||this.expandedValueElement&&t.isSelfOrDescendant(this.expandedValueElement);return this.property.value&&!this.property.value.customPreview()&&n&&(this.property.writable||this.property.setter)&&this.startEditing(),!1}onenter(){return!(!this.property.value||this.property.value.customPreview()||!this.property.writable&&!this.property.setter)&&(this.startEditing(),!0)}onattach(){this.update(),this.updateExpandable()}onexpand(){this.showExpandedValueElement(!0)}oncollapse(){this.showExpandedValueElement(!1)}showExpandedValueElement(e){this.expandedValueElement&&(e?this.rowContainer.replaceChild(this.expandedValueElement,this.valueElement):this.rowContainer.replaceChild(this.valueElement,this.expandedValueElement))}createExpandedValueElement(e,t){if(!(e.hasChildren&&!e.customPreview()&&"node"!==e.subtype&&"function"!==e.type&&("object"!==e.type||e.preview)))return null;const n=document.createElement("span");return n.classList.add("value"),"Object"===e.description?n.textContent="":n.setTextContentTruncatedIfNeeded(e.description||""),n.classList.add("object-value-"+(e.subtype||e.type)),UI.Tooltip.Tooltip.install(n,e.description||""),t||ObjectPropertiesSection.appendMemoryIcon(n,e),n}update(){this.nameElement=ObjectPropertiesSection.createNameElement(this.property.name,this.property.private),this.property.enumerable||this.nameElement.classList.add("object-properties-section-dimmed"),this.property.isOwn&&this.nameElement.classList.add("own-property"),this.property.synthetic&&this.nameElement.classList.add("synthetic-property"),this.updatePropertyPath();const e=this.property.synthetic&&"[[Entries]]"===this.property.name;if(e)this.valueElement=document.createElement("span"),this.valueElement.classList.add("value");else if(this.property.value){const e="[[Prototype]]"!==this.property.name;this.propertyValue=ObjectPropertiesSection.createPropertyValueWithCustomSupport(this.property.value,this.property.wasThrown,e,this.listItemElement,this.linkifier,this.property.synthetic,this.path()),this.valueElement=this.propertyValue.element}else if(this.property.getter){this.valueElement=document.createElement("span");const e=this.valueElement.createChild("span");e.textContent=i18nString(UIStrings.dots),e.classList.add("object-value-calculate-value-button"),UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.invokePropertyGetter));const t=parentMap.get(this.property),n=this.property.getter;e.addEventListener("click",(e=>{e.consume();t.callFunction("\n          function invokeGetter(getter) {\n            return Reflect.apply(getter, this, []);\n          }",[SDK.RemoteObject.RemoteObject.toCallArgument(n)]).then(this.onInvokeGetterClick.bind(this))}),!1)}else this.valueElement=document.createElement("span"),this.valueElement.classList.add("object-value-unavailable"),this.valueElement.textContent=i18nString(UIStrings.valueUnavailable),UI.Tooltip.Tooltip.install(this.valueElement,i18nString(UIStrings.valueNotAccessibleToTheDebugger));const t=this.valueElement.textContent;this.property.value&&t&&!this.property.wasThrown&&(this.expandedValueElement=this.createExpandedValueElement(this.property.value,this.property.synthetic));const n=Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.IMPORTANT_DOM_PROPERTIES);let i,r="";if(this.property.webIdl?.applicable&&n){const e=new IconButton.Icon.Icon;e.data={iconName:"star",color:"var(--icon-default)",width:"16px",height:"16px"},r=UI.Fragment.html`
         <span class='adorner'>${e}</span>
       `}i=e?UI.Fragment.html`
        <span class='name-and-value'>${r}${this.nameElement}</span>
      `:UI.Fragment.html`
        <span class='name-and-value'>${r}${this.nameElement}<span class='separator'>: </span>${this.valueElement}</span>
      `,this.listItemElement.removeChildren(),this.rowContainer=i,this.listItemElement.appendChild(this.rowContainer),n&&(this.listItemElement.dataset.webidl=this.property.webIdl?.applicable?"true":"false")}updatePropertyPath(){if(this.nameElement.title)return;const e=this.property.name;if(this.property.synthetic)return void UI.Tooltip.Tooltip.install(this.nameElement,e);const t=this.parent instanceof ObjectPropertyTreeElement&&this.parent.nameElement&&!this.parent.property.synthetic?this.parent.nameElement.title:"";this.property.private||/^(?:[$_\p{ID_Start}])(?:[$_\u200C\u200D\p{ID_Continue}])*$/u.test(e)?UI.Tooltip.Tooltip.install(this.nameElement,t?`${t}.${e}`:e):/^(?:0|[1-9]\d*)$/.test(e)?UI.Tooltip.Tooltip.install(this.nameElement,`${t}[${e}]`):UI.Tooltip.Tooltip.install(this.nameElement,`${t}[${JSON.stringify(e)}]`)}contextMenuFired(e){const t=new UI.ContextMenu.ContextMenu(e);if(t.appendApplicableItems(this),this.property.symbol&&t.appendApplicableItems(this.property.symbol),this.property.value&&(t.appendApplicableItems(this.property.value),parentMap.get(this.property)instanceof SDK.RemoteObject.LocalJSONObject)){const{value:{value:e}}=this.property,n="object"==typeof e?JSON.stringify(e,null,2):e,i=()=>{Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue),Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(n)};t.clipboardSection().appendItem(i18nString(UIStrings.copyValue),i)}if(!this.property.synthetic&&this.nameElement&&this.nameElement.title){const e=Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText.bind(Host.InspectorFrontendHost.InspectorFrontendHostInstance,this.nameElement.title);t.clipboardSection().appendItem(i18nString(UIStrings.copyPropertyPath),e)}parentMap.get(this.property)instanceof SDK.RemoteObject.LocalJSONObject&&(t.viewSection().appendItem(i18nString(UIStrings.expandRecursively),this.expandRecursively.bind(this,100)),t.viewSection().appendItem(i18nString(UIStrings.collapseChildren),this.collapseChildren.bind(this))),this.propertyValue&&this.propertyValue.appendApplicableItems(e,t,{}),t.show()}startEditing(){const e=this.treeOutline;if(this.prompt||!e||!e.editable||this.readOnly)return;if(this.editableDiv=this.rowContainer.createChild("span","editable-div"),this.property.value){let e=this.property.value.description;"string"===this.property.value.type&&"string"==typeof e&&(e=`"${e}"`),this.editableDiv.setTextContentTruncatedIfNeeded(e,i18nString(UIStrings.stringIsTooLargeToEdit))}const t=this.editableDiv.textContent||"";this.setExpandable(!1),this.listItemElement.classList.add("editing-sub-part"),this.valueElement.classList.add("hidden"),this.prompt=new ObjectPropertyPrompt;const n=this.prompt.attachAndStartEditing(this.editableDiv,this.editingCommitted.bind(this,t));n.classList.add("property-prompt");const i=this.listItemElement.getComponentSelection();i&&i.selectAllChildren(this.editableDiv),n.addEventListener("keydown",this.promptKeyDown.bind(this,t),!1)}editingEnded(){this.prompt&&(this.prompt.detach(),delete this.prompt),this.editableDiv.remove(),this.updateExpandable(),this.listItemElement.scrollLeft=0,this.listItemElement.classList.remove("editing-sub-part"),this.select()}editingCancelled(){this.valueElement.classList.remove("hidden"),this.editingEnded()}async editingCommitted(e){const t=this.prompt?this.prompt.text():"";t!==e?(this.editingEnded(),await this.applyExpression(t)):this.editingCancelled()}promptKeyDown(e,t){const n=t;return"Enter"===n.key?(n.consume(),void this.editingCommitted(e)):n.key===Platform.KeyboardUtilities.ESCAPE_KEY?(n.consume(),void this.editingCancelled()):void 0}async applyExpression(e){const t=SDK.RemoteObject.RemoteObject.toCallArgument(this.property.symbol||this.property.name);if(e=JavaScriptREPL.wrapObjectLiteral(e.trim()),this.property.synthetic){let t=!1;if(e&&(t=await this.property.setSyntheticValue(e)),t){const e=this.parent;e&&(e.invalidateChildren(),e.onpopulate())}else this.update();return}const n=parentMap.get(this.property),i=e?n.setPropertyValue(t,e):n.deleteProperty(t);if(await i)this.update();else if(e){const e=this.parent;e&&(e.invalidateChildren(),e.onpopulate())}else this.parent&&this.parent.removeChild(this)}onInvokeGetterClick(e){e.object&&(this.property.value=e.object,this.property.wasThrown=e.wasThrown||!1,this.update(),this.invalidateChildren(),this.updateExpandable())}updateExpandable(){this.property.value?this.setExpandable(!this.property.value.customPreview()&&this.property.value.hasChildren&&!this.property.wasThrown):this.setExpandable(!1)}path(){return this.nameElement.title}}export class ArrayGroupingTreeElement extends UI.TreeOutline.TreeElement{toggleOnClick;fromIndex;toIndex;object;readOnly;propertyCount;linkifier;constructor(e,t,n,i,r){super(Platform.StringUtilities.sprintf("[%d … %d]",t,n),!0),this.toggleOnClick=!0,this.fromIndex=t,this.toIndex=n,this.object=e,this.readOnly=!0,this.propertyCount=i,this.linkifier=r}static async populateArray(e,t,n,i,r){await ArrayGroupingTreeElement.populateRanges(e,t,n,i,!0,r)}static async populateRanges(e,t,n,i,r,s){const o=await t.callFunctionJSON((function(e,t,n,i){if(void 0===e||void 0===t||void 0===i||void 0===n)return;let r=null;const s=t-e>=i&&ArrayBuffer.isView(this);function*o(n){if(void 0!==e&&void 0!==t&&void 0!==i)if(t-e<i)for(let i=e;i<=t;++i)i in n&&(yield i);else{r=r||Object.getOwnPropertyNames(n);for(let n=0;n<r.length;++n){const i=r[n],s=Number(i)>>>0;String(s)===i&&e<=s&&s<=t&&(yield s)}}}let a=0;if(s)a=t-e+1;else for(const e of o(this))++a;let l=a;l=a<=n?a:Math.pow(n,Math.ceil(Math.log(a)/Math.log(n))-1);const p=[];if(s)for(let n=e;n<=t;n+=l){const e=n;let i=e+l-1;i>t&&(i=t),p.push([e,i,i-e+1])}else{a=0;let e=-1,t=0;for(const n of o(this))-1===e&&(e=n),t=n,++a===l&&(p.push([e,t,a]),a=0,e=-1);a>0&&p.push([e,t,a])}return{ranges:p}}),[{value:n},{value:i},{value:ArrayGroupingTreeElement.bucketThreshold},{value:ArrayGroupingTreeElement.sparseIterationThreshold}]);await async function(n){if(!n)return;const i=n.ranges;if(1===i.length)await ArrayGroupingTreeElement.populateAsFragment(e,t,i[0][0],i[0][1],s);else for(let n=0;n<i.length;++n){const r=i[n][0],o=i[n][1],a=i[n][2];r===o?await ArrayGroupingTreeElement.populateAsFragment(e,t,r,o,s):e.appendChild(new ArrayGroupingTreeElement(t,r,o,a,s))}r&&await ArrayGroupingTreeElement.populateNonIndexProperties(e,t,s)}(o)}static async populateAsFragment(e,t,n,i,r){const s=await t.callFunction((function(e,t,n){const i=Object.create(null);if(void 0===e||void 0===t||void 0===n)return;if(t-e<n)for(let n=e;n<=t;++n)n in this&&(i[n]=this[n]);else{const n=Object.getOwnPropertyNames(this);for(let r=0;r<n.length;++r){const s=n[r],o=Number(s)>>>0;String(o)===s&&e<=o&&o<=t&&(i[o]=this[o])}}return i}),[{value:n},{value:i},{value:ArrayGroupingTreeElement.sparseIterationThreshold}]);if(!s.object||s.wasThrown)return;const o=s.object,a=await o.getAllProperties(!1,!0);o.release();const l=a.properties;if(l){l.sort(ObjectPropertiesSection.compareProperties);for(let t=0;t<l.length;++t){parentMap.set(l[t],this.object);const n=new ObjectPropertyTreeElement(l[t],r);n.readOnly=!0,e.appendChild(n)}}}static async populateNonIndexProperties(e,t,n){const{properties:i,internalProperties:r}=await SDK.RemoteObject.RemoteObject.loadFromObjectPerProto(t,!0,!0);i&&ObjectPropertyTreeElement.populateWithProperties(e,i,r,!1,!1,t,n)}async onpopulate(){this.propertyCount>=ArrayGroupingTreeElement.bucketThreshold?await ArrayGroupingTreeElement.populateRanges(this,this.object,this.fromIndex,this.toIndex,!1,this.linkifier):await ArrayGroupingTreeElement.populateAsFragment(this,this.object,this.fromIndex,this.toIndex,this.linkifier)}onattach(){this.listItemElement.classList.add("object-properties-section-name")}static bucketThreshold=100;static sparseIterationThreshold=25e4}export class ObjectPropertyPrompt extends UI.TextPrompt.TextPrompt{constructor(){super(),this.initialize(TextEditor.JavaScript.completeInContext)}}const sectionMap=new Map,cachedResultMap=new Map;export class ObjectPropertiesSectionsTreeExpandController{expandedProperties;constructor(e){this.expandedProperties=new Set,e.addEventListener(UI.TreeOutline.Events.ElementAttached,this.elementAttached,this),e.addEventListener(UI.TreeOutline.Events.ElementExpanded,this.elementExpanded,this),e.addEventListener(UI.TreeOutline.Events.ElementCollapsed,this.elementCollapsed,this)}watchSection(e,t){sectionMap.set(t,e),this.expandedProperties.has(e)&&t.expand()}stopWatchSectionsWithId(e){for(const t of this.expandedProperties)t.startsWith(e+":")&&this.expandedProperties.delete(t)}elementAttached(e){const t=e.data;t.isExpandable()&&this.expandedProperties.has(this.propertyPath(t))&&t.expand()}elementExpanded(e){const t=e.data;this.expandedProperties.add(this.propertyPath(t))}elementCollapsed(e){const t=e.data;this.expandedProperties.delete(this.propertyPath(t))}propertyPath(e){const t=cachedResultMap.get(e);if(t)return t;let n=e,i=n;if(!e.treeOutline)throw new Error("No tree outline available");const r=e.treeOutline.rootElement();let s;for(;n!==r;){let e="";e=n.property?n.property.name:"string"==typeof n.title?n.title:n.title.textContent||"",s=e+(s?"."+s:""),i=n,n.parent&&(n=n.parent)}return s=sectionMap.get(i)+(s?":"+s:""),cachedResultMap.set(e,s),s}}let rendererInstance;export class Renderer{static instance(e={forceNew:!1}){const{forceNew:t}=e;return rendererInstance&&!t||(rendererInstance=new Renderer),rendererInstance}async render(e,t){if(!(e instanceof SDK.RemoteObject.RemoteObject))throw new Error("Can't render "+e);const n=(t=t||{title:void 0,editable:void 0}).title,i=new ObjectPropertiesSection(e,n);return n||i.titleLessMode(),i.editable=Boolean(t.editable),{node:i.element,tree:i}}}export class ObjectPropertyValue{element;constructor(e){this.element=e}appendApplicableItems(e,t,n){}}export class ExpandableTextPropertyValue extends ObjectPropertyValue{text;maxLength;expandElement;maxDisplayableTextLength;expandElementText;copyButtonText;constructor(e,t,n){super(e);const i=e.createChild("span");this.text=t,this.maxLength=n,i.textContent=t.slice(0,n),UI.Tooltip.Tooltip.install(i,`${t.slice(0,n)}…`),this.expandElement=i.createChild("span"),this.maxDisplayableTextLength=1e7;const r=Platform.StringUtilities.countWtf8Bytes(t),s=Platform.NumberUtilities.bytesToString(r);this.text.length<this.maxDisplayableTextLength?(this.expandElementText=i18nString(UIStrings.showMoreS,{PH1:s}),this.expandElement.setAttribute("data-text",this.expandElementText),this.expandElement.classList.add("expandable-inline-button"),this.expandElement.addEventListener("click",this.expandText.bind(this)),this.expandElement.addEventListener("keydown",(e=>{const t=e;"Enter"!==t.key&&" "!==t.key||this.expandText()})),UI.ARIAUtils.markAsButton(this.expandElement)):(this.expandElement.setAttribute("data-text",i18nString(UIStrings.longTextWasTruncatedS,{PH1:s})),this.expandElement.classList.add("undisplayable-text")),this.copyButtonText=i18nString(UIStrings.copy);const o=i.createChild("span","expandable-inline-button");o.setAttribute("data-text",this.copyButtonText),o.addEventListener("click",this.copyText.bind(this)),o.addEventListener("keydown",(e=>{const t=e;"Enter"!==t.key&&" "!==t.key||this.copyText()})),UI.ARIAUtils.markAsButton(o)}appendApplicableItems(e,t,n){this.text.length<this.maxDisplayableTextLength&&this.expandElement&&t.clipboardSection().appendItem(this.expandElementText||"",this.expandText.bind(this)),t.clipboardSection().appendItem(this.copyButtonText,this.copyText.bind(this))}expandText(){this.expandElement&&(this.expandElement.parentElement&&this.expandElement.parentElement.insertBefore(document.createTextNode(this.text.slice(this.maxLength)),this.expandElement),this.expandElement.remove(),this.expandElement=null)}copyText(){Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.text)}}