@browserless.io/browserless 2.2.0-beta-8 → 2.3.0-beta-1

package/static/devtools/accessibility/accessibility-legacy.js

@@ -0,0 +1 @@
+import{ARIAAttributesView as e,ARIAMetadata as i,AXBreadcrumbsPane as t,AccessibilityNodeView as s,AccessibilitySidebarView as A,AccessibilitySubPane as c,AccessibilityStrings as r}from"./accessibility.js";self.Accessibility=self.Accessibility||{},Accessibility=Accessibility||{},Accessibility.ARIAAttributesPane=e.ARIAAttributesPane,Accessibility.ARIAAttributesTreeElement=e.ARIAAttributesTreeElement,Accessibility.ARIAAttributesPane.ARIAAttributePrompt=e.ARIAAttributePrompt,Accessibility.ARIAMetadata=i.ARIAMetadata,Accessibility.ARIAMetadata.Attribute=i.Attribute,Accessibility.ariaMetadata=i.ariaMetadata,Accessibility.AXBreadcrumbsPane=t.AXBreadcrumbsPane,Accessibility.AXBreadcrumb=t.AXBreadcrumb,Accessibility.AXBreadcrumb.RoleStyles=t.RoleStyles,Accessibility.AXNodeSubPane=s.AXNodeSubPane,Accessibility.AXNodePropertyTreeElement=s.AXNodePropertyTreeElement,Accessibility.AXNodePropertyTreeElement.TypeStyles=s.TypeStyles,Accessibility.AXNodePropertyTreeElement.StringProperties=s.StringProperties,Accessibility.AXNodePropertyTreePropertyElement=s.AXNodePropertyTreePropertyElement,Accessibility.AXValueSourceTreeElement=s.AXValueSourceTreeElement,Accessibility.AXRelatedNodeSourceTreeElement=s.AXRelatedNodeSourceTreeElement,Accessibility.AXRelatedNodeElement=s.AXRelatedNodeElement,Accessibility.AXNodeIgnoredReasonTreeElement=s.AXNodeIgnoredReasonTreeElement,Accessibility.AccessibilitySidebarView=A.AccessibilitySidebarView,Accessibility.AccessibilitySubPane=c.AccessibilitySubPane,Accessibility.AccessibilityStrings={},Accessibility.AccessibilityStrings.AXAttributes=r.AXAttributes,Accessibility.AccessibilityStrings.AXSourceTypes=r.AXSourceTypes,Accessibility.AccessibilityStrings.AXNativeSourceTypes=r.AXNativeSourceTypes;

package/static/devtools/accessibility/accessibility-meta.js

@@ -0,0 +1 @@
+import{ls as i}from"../platform/platform.js";import{Runtime as e}from"../root/root.js";import{ViewManager as t}from"../ui/ui.js";let s;t.registerViewExtension({location:"elements-sidebar",id:"accessibility.view",title:()=>i`Accessibility`,commandPrompt:()=>i`Show Accessibility`,order:10,persistence:"permanent",loadView:async()=>(await async function(){return s||(await e.Runtime.instance().loadModulePromise("accessibility"),s=await import("./accessibility.js")),s}()).AccessibilitySidebarView.AccessibilitySidebarView.instance()});

package/static/devtools/accessibility/accessibility.js

@@ -0,0 +1 @@
+import{Linkifier as e,Revealer as t}from"../common/common.js";import{ls as a}from"../platform/platform.js";import{AccessibilityModel as i,DOMModel as s,OverlayModel as r,SDKModel as n}from"../sdk/sdk.js";import{View as o,TreeOutline as l,Tooltip as d,UIUtils as c,TextPrompt as u,ARIAUtils as m,ContextMenu as h,ThrottledWidget as p,ViewManager as b,Context as _}from"../ui/ui.js";import{Runtime as f}from"../root/root.js";import{userMetrics as g,UserMetrics as v}from"../host/host.js";const x={disabled:{name:a`Disabled`,description:a`If true, this element currently cannot be interacted with.`,group:"AXGlobalStates"},invalid:{name:a`Invalid user entry`,description:a`If true, this element's user-entered value does not conform to validation requirement.`,group:"AXGlobalStates"},editable:{name:a`Editable`,description:a`If and how this element can be edited.`},focusable:{name:a`Focusable`,description:a`If true, this element can receive focus.`},focused:{name:a`Focused`,description:a`If true, this element currently has focus.`},settable:{name:a`Can set value`,description:a`Whether the value of this element can be set.`},live:{name:a`Live region`,description:a`Whether and what priority of live updates may be expected for this element.`,group:"AXLiveRegionAttributes"},atomic:{name:a`Atomic (live regions)`,description:a`If this element may receive live updates, whether the entire live region should be presented to the user on changes, or only changed nodes.`,group:"AXLiveRegionAttributes"},relevant:{name:a`Relevant (live regions)`,description:a`If this element may receive live updates, what type of updates should trigger a notification.`,group:"AXLiveRegionAttributes"},busy:{name:a`Busy (live regions)`,description:a`Whether this element or its subtree are currently being updated (and thus may be in an inconsistent state).`,group:"AXLiveRegionAttributes"},root:{name:a`Live region root`,description:a`If this element may receive live updates, the root element of the containing live region.`,group:"AXLiveRegionAttributes"},autocomplete:{name:a`Has autocomplete`,description:a`Whether and what type of autocomplete suggestions are currently provided by this element.`,group:"AXWidgetAttributes"},haspopup:{name:a`Has popup`,description:a`Whether this element has caused some kind of pop-up (such as a menu) to appear.`,group:"AXWidgetAttributes"},level:{name:a`Level`,description:a`The hierarchical level of this element.`,group:"AXWidgetAttributes"},multiselectable:{name:a`Multi-selectable`,description:a`Whether a user may select more than one option from this widget.`,group:"AXWidgetAttributes"},orientation:{name:a`Orientation`,description:a`Whether this linear element's orientation is horizontal or vertical.`,group:"AXWidgetAttributes"},multiline:{name:a`Multi-line`,description:a`Whether this text box may have more than one line.`,group:"AXWidgetAttributes"},readonly:{name:a`Read-only`,description:a`If true, this element may be interacted with, but its value cannot be changed.`,group:"AXWidgetAttributes"},required:{name:a`Required`,description:a`Whether this element is a required field in a form.`,group:"AXWidgetAttributes"},valuemin:{name:a`Minimum value`,description:a`For a range widget, the minimum allowed value.`,group:"AXWidgetAttributes"},valuemax:{name:a`Maximum value`,description:a`For a range widget, the maximum allowed value.`,group:"AXWidgetAttributes"},valuetext:{name:a`Value description`,description:a`A human-readable version of the value of a range widget (where necessary).`,group:"AXWidgetAttributes"},checked:{name:a`Checked`,description:a`Whether this checkbox, radio button or tree item is checked, unchecked, or mixed (e.g. has both checked and un-checked children).`,group:"AXWidgetStates"},expanded:{name:a`Expanded`,description:a`Whether this element, or another grouping element it controls, is expanded.`,group:"AXWidgetStates"},pressed:{name:a`Pressed`,description:a`Whether this toggle button is currently in a pressed state.`,group:"AXWidgetStates"},selected:{name:a`Selected`,description:a`Whether the option represented by this element is currently selected.`,group:"AXWidgetStates"},activedescendant:{name:a`Active descendant`,description:a`The descendant of this element which is active; i.e. the element to which focus should be delegated.`,group:"AXRelationshipAttributes"},flowto:{name:a`Flows to`,description:a`Element to which the user may choose to navigate after this one, instead of the next element in the DOM order.`,group:"AXRelationshipAttributes"},controls:{name:a`Controls`,description:a`Element or elements whose content or presence is/are controlled by this widget.`,group:"AXRelationshipAttributes"},describedby:{name:a`Described by`,description:a`Element or elements which form the description of this element.`,group:"AXRelationshipAttributes"},labelledby:{name:a`Labeled by`,description:a`Element or elements which may form the name of this element.`,group:"AXRelationshipAttributes"},owns:{name:a`Owns`,description:a`Element or elements which should be considered descendants of this element, despite not being descendants in the DOM.`,group:"AXRelationshipAttributes"},name:{name:a`Name`,description:a`The computed name of this element.`,group:"Default"},role:{name:a`Role`,description:a`Indicates the purpose of this element, such as a user interface idiom for a widget, or structural role within a document.`,group:"Default"},value:{name:a`Value`,description:a`The value of this element; this may be user-provided or developer-provided, depending on the element.`,group:"Default"},help:{name:a`Help`,description:a`The computed help text for this element.`,group:"Default"},description:{name:a`Description`,description:a`The accessible description for this element.`,group:"Default"}},y={attribute:{name:a`From attribute`,description:a`Value from attribute.`},implicit:{name:a`Implicit`,description:a`Implicit value.`},style:{name:a`From style`,description:a`Value from style.`},contents:{name:a`Contents`,description:a`Value from element contents.`},placeholder:{name:a`From placeholder attribute`,description:a`Value from placeholder attribute.`},relatedElement:{name:a`Related element`,description:a`Value from related element.`}},E={figcaption:{name:a`From caption`,description:a`Value from figcaption element.`},label:{name:a`From label`,description:a`Value from label element.`},labelfor:{name:a`From label (for)`,description:a`Value from label element with for= attribute.`},labelwrapped:{name:a`From label (wrapped)`,description:a`Value from label element wrapped.`},legend:{name:a`From legend`,description:a`Value from legend element.`},rubyannotation:{name:a`From ruby annotation`,description:a`Value from native HTML ruby annotation.`},tablecaption:{name:a`From caption`,description:a`Value from table caption.`},title:{name:a`From title`,description:a`Value from title attribute.`},other:{name:a`From native HTML`,description:a`Value from native HTML (unknown source).`}};var N=Object.freeze({__proto__:null,AXAttributes:x,AXSourceTypes:y,AXNativeSourceTypes:E});class A extends o.SimpleView{constructor(e){super(e),this._axNode=null,this.registerRequiredCSS("accessibility/accessibilityProperties.css",{enableLegacyPatching:!1})}setAXNode(e){}node(){return this._node||null}setNode(e){this._node=e}createInfo(e,t){const a=t||"gray-info-message",i=this.element.createChild("div",a);return i.textContent=e,i}createTreeOutline(){const e=new l.TreeOutlineInShadow;return e.registerRequiredCSS("accessibility/accessibilityNode.css",{enableLegacyPatching:!1}),e.registerRequiredCSS("accessibility/accessibilityProperties.css",{enableLegacyPatching:!1}),e.registerRequiredCSS("object_ui/objectValue.css",{enableLegacyPatching:!0}),e.element.classList.add("hidden"),e.hideOverflow(),this.element.appendChild(e.element),e}}var w=Object.freeze({__proto__:null,AccessibilitySubPane:A});class C extends A{constructor(){super(a`Computed Properties`),this._axNode=null,this.contentElement.classList.add("ax-subpane"),this._noNodeInfo=this.createInfo(a`No accessibility node`),this._ignoredInfo=this.createInfo(a`Accessibility node not exposed`,"ax-ignored-info hidden"),this._treeOutline=this.createTreeOutline(),this._ignoredReasonsTree=this.createTreeOutline(),this.element.classList.add("accessibility-computed"),this.registerRequiredCSS("accessibility/accessibilityNode.css",{enableLegacyPatching:!1}),this._treeOutline.setFocusable(!0)}setAXNode(e){if(this._axNode===e)return;this._axNode=e;const t=this._treeOutline;t.removeChildren();const a=this._ignoredReasonsTree;if(a.removeChildren(),!e)return t.element.classList.add("hidden"),this._ignoredInfo.classList.add("hidden"),a.element.classList.add("hidden"),this._noNodeInfo.classList.remove("hidden"),void this.element.classList.add("ax-ignored-node-pane");if(e.ignored()){this._noNodeInfo.classList.add("hidden"),t.element.classList.add("hidden"),this.element.classList.add("ax-ignored-node-pane"),this._ignoredInfo.classList.remove("hidden"),a.element.classList.remove("hidden");const i=e.ignoredReasons();for(const t of i)s=t,a.appendChild(new S(s,e));return void(a.firstChild()||a.element.classList.add("hidden"))}var s;function r(a){t.appendChild(new I(a,e))}this.element.classList.remove("ax-ignored-node-pane"),this._ignoredInfo.classList.add("hidden"),a.element.classList.add("hidden"),this._noNodeInfo.classList.add("hidden"),t.element.classList.remove("hidden");for(const t of e.coreProperties())r(t);const n=e.role();if(n){r({name:i.CoreAxPropertyName.Role,value:n})}for(const t of e.properties())r(t);const o=t.firstChild();o&&o.select(!0,!1)}setNode(e){super.setNode(e),this._axNode=null}}class k extends l.TreeElement{constructor(e){super(""),this._axNode=e}static createSimpleValueElement(e,t){let a;const i=Protocol.Accessibility.AXValueType;let s;e&&e!==i.ValueUndefined&&e!==i.ComputedString?(a=document.createElement("span"),a.classList.add("monospace")):a=document.createElement("span");return s=e&&R.has(e)?'"'+t.replace(/\n/g,"↵")+'"':String(t),e&&e in L&&a.classList.add(L[e]),a.setTextContentTruncatedIfNeeded(s||""),d.Tooltip.install(a,String(t)||""),a}static createExclamationMark(e){const t=document.createElement("span",{is:"dt-icon-label"});return t.type="smallicon-warning",d.Tooltip.install(t,e),t}appendNameElement(e){const t=document.createElement("span");if(e in x){const a=x[e];t.textContent=a.name,d.Tooltip.install(t,a.description),t.classList.add("ax-readable-name")}else t.textContent=e,t.classList.add("ax-name"),t.classList.add("monospace");this.listItemElement.appendChild(t)}appendValueElement(e){const t=Protocol.Accessibility.AXValueType;if(e.type===t.Idref||e.type===t.Node||e.type===t.IdrefList||e.type===t.NodeList)return void this.appendRelatedNodeListValueElement(e);if(e.sources){const t=e.sources;for(let e=0;e<t.length;e++){const a=t[e],i=new P(a,this._axNode);this.appendChild(i)}this.expand()}const a=k.createSimpleValueElement(e.type,String(e.value));this.listItemElement.appendChild(a)}appendRelatedNode(e,t){const a=new s.DeferredDOMNode(this._axNode.accessibilityModel().target(),e.backendDOMNodeId),i=new M({deferredNode:a,idref:void 0},e);this.appendChild(i)}appendRelatedNodeInline(e){const t=new s.DeferredDOMNode(this._axNode.accessibilityModel().target(),e.backendDOMNodeId),a=new F({deferredNode:t,idref:void 0},e);this.listItemElement.appendChild(a.render())}appendRelatedNodeListValueElement(e){!e.relatedNodes||1!==e.relatedNodes.length||e.value?(e.relatedNodes&&e.relatedNodes.forEach(this.appendRelatedNode,this),e.relatedNodes&&e.relatedNodes.length<=3?this.expand():this.collapse()):this.appendRelatedNodeInline(e.relatedNodes[0])}}const L={attribute:"ax-value-string",boolean:"object-value-boolean",booleanOrUndefined:"object-value-boolean",computedString:"ax-readable-string",idref:"ax-value-string",idrefList:"ax-value-string",integer:"object-value-number",internalRole:"ax-internal-role",number:"ax-value-number",role:"ax-role",string:"ax-value-string",tristate:"object-value-boolean",valueUndefined:"ax-value-undefined"},R=new Set([Protocol.Accessibility.AXValueType.String,Protocol.Accessibility.AXValueType.ComputedString,Protocol.Accessibility.AXValueType.IdrefList,Protocol.Accessibility.AXValueType.Idref]);class I extends k{constructor(e,t){super(t),this._property=e,this.toggleOnClick=!0,this.listItemElement.classList.add("property")}onattach(){this._update()}_update(){this.listItemElement.removeChildren(),this.appendNameElement(this._property.name),this.listItemElement.createChild("span","separator").textContent=": ",this.appendValueElement(this._property.value)}}class P extends k{constructor(e,t){super(t),this._source=e}onattach(){this._update()}appendRelatedNodeWithIdref(e,t){const a=new s.DeferredDOMNode(this._axNode.accessibilityModel().target(),e.backendDOMNodeId),i=new M({deferredNode:a,idref:t},e);this.appendChild(i)}appendIDRefValueElement(e){if(null===e.value)return;const t=e.relatedNodes||[];if(""===e.value){for(const e of t){const t=e.idref||"";this.appendRelatedNodeWithIdref(e,t)}return}const a=e.value.trim().split(/\s+/);for(const e of a){const i=t.find((t=>t.idref===e));i?this.appendRelatedNodeWithIdref(i,e):1===a.length?this.listItemElement.appendChild(new F({deferredNode:void 0,idref:e}).render()):this.appendChild(new M({deferredNode:void 0,idref:e}))}}appendRelatedNodeListValueElement(e){const t=e.relatedNodes,a=t?t.length:0;e.type===Protocol.Accessibility.AXValueType.IdrefList||e.type===Protocol.Accessibility.AXValueType.Idref?this.appendIDRefValueElement(e):super.appendRelatedNodeListValueElement(e),a<=3?this.expand():this.collapse()}appendSourceNameElement(e){const t=document.createElement("span"),a=Protocol.Accessibility.AXValueSourceType,i=e.type;switch(i){case a.Attribute:case a.Placeholder:case a.RelatedElement:if(e.nativeSource){const a=e.nativeSource;t.textContent=E[a].name,d.Tooltip.install(t,E[a].description),t.classList.add("ax-readable-name");break}t.textContent=e.attribute||null,t.classList.add("ax-name"),t.classList.add("monospace");break;default:i in y?(t.textContent=y[i].name,d.Tooltip.install(t,y[i].description),t.classList.add("ax-readable-name")):(console.warn(i,"not in AXSourceTypes"),t.textContent=i)}this.listItemElement.appendChild(t)}_update(){if(this.listItemElement.removeChildren(),this._source.invalid){const e=k.createExclamationMark(a`Invalid source.`);this.listItemElement.appendChild(e),this.listItemElement.classList.add("ax-value-source-invalid")}else this._source.superseded&&this.listItemElement.classList.add("ax-value-source-unused");if(this.appendSourceNameElement(this._source),this.listItemElement.createChild("span","separator").textContent=": ",this._source.attributeValue)this.appendValueElement(this._source.attributeValue),c.createTextChild(this.listItemElement," ");else if(this._source.nativeSourceValue)this.appendValueElement(this._source.nativeSourceValue),c.createTextChild(this.listItemElement," "),this._source.value&&this.appendValueElement(this._source.value);else if(this._source.value)this.appendValueElement(this._source.value);else{const e=k.createSimpleValueElement(Protocol.Accessibility.AXValueType.ValueUndefined,a`Not specified`);this.listItemElement.appendChild(e),this.listItemElement.classList.add("ax-value-source-unused")}this._source.value&&this._source.superseded&&this.listItemElement.classList.add("ax-value-source-superseded")}}class M extends l.TreeElement{constructor(e,t){super(""),this._value=t,this._axRelatedNodeElement=new F(e,t),this.selectable=!0}onattach(){this.listItemElement.appendChild(this._axRelatedNodeElement.render()),this._value&&this._value.text&&this.listItemElement.appendChild(k.createSimpleValueElement(Protocol.Accessibility.AXValueType.ComputedString,this._value.text))}onenter(){return this._axRelatedNodeElement.revealNode(),!0}}class F{constructor(e,t){this._deferredNode=e.deferredNode,this._idref=e.idref,this._value=t}render(){const t=document.createElement("span");if(this._deferredNode){const a=document.createElement("span");t.appendChild(a),this._deferredNode.resolvePromise().then((t=>{e.Linkifier.linkify(t,{tooltip:void 0,preventKeyboardFocus:!0}).then((e=>a.appendChild(e)))}))}else if(this._idref){t.classList.add("invalid");const e=k.createExclamationMark(a`No node with this ID.`);c.createTextChild(e,this._idref),t.appendChild(e)}return t}revealNode(){this._deferredNode&&this._deferredNode.resolvePromise().then((e=>t.reveal(e)))}}class S extends k{constructor(e,t){super(t),this._property=e,this._axNode=t,this.toggleOnClick=!0,this.selectable=!1}static createReasonElement(e,t){let a=null;switch(e){case"activeModalDialog":a=c.formatLocalized("Element is hidden by active modal dialog: ",[]);break;case"ancestorIsLeafNode":a=c.formatLocalized("Ancestor's children are all presentational: ",[]);break;case"ariaHiddenElement":{const e=document.createElement("span",{is:"source-code"}).textContent="aria-hidden";a=c.formatLocalized("Element is %s.",[e]);break}case"ariaHiddenSubtree":{const e=document.createElement("span",{is:"source-code"}).textContent="aria-hidden",t=document.createElement("span",{is:"source-code"}).textContent="true";a=c.formatLocalized("%s is %s on ancestor: ",[e,t]);break}case"emptyAlt":a=c.formatLocalized("Element has empty alt text.",[]);break;case"emptyText":a=c.formatLocalized("No text content.",[]);break;case"inertElement":a=c.formatLocalized("Element is inert.",[]);break;case"inertSubtree":a=c.formatLocalized("Element is in an inert subtree from ",[]);break;case"inheritsPresentation":a=c.formatLocalized("Element inherits presentational role from ",[]);break;case"labelContainer":a=c.formatLocalized("Part of label element: ",[]);break;case"labelFor":a=c.formatLocalized("Label for ",[]);break;case"notRendered":a=c.formatLocalized("Element is not rendered.",[]);break;case"notVisible":a=c.formatLocalized("Element is not visible.",[]);break;case"presentationalRole":{const e=t&&t.role()||"",i=document.createElement("span",{is:"source-code"}).textContent="role="+e;a=c.formatLocalized("Element has %s.",[i]);break}case"probablyPresentational":a=c.formatLocalized("Element is presentational.",[]);break;case"staticTextUsedAsNameFor":a=c.formatLocalized("Static text node is used as name for ",[]);break;case"uninteresting":a=c.formatLocalized("Element not interesting for accessibility.",[])}return a&&a.classList.add("ax-reason"),a}onattach(){this.listItemElement.removeChildren(),this._reasonElement=S.createReasonElement(this._property.name,this._axNode),this._reasonElement&&this.listItemElement.appendChild(this._reasonElement);const e=this._property.value;e.type===Protocol.Accessibility.AXValueType.Idref&&this.appendRelatedNodeListValueElement(e)}}var V=Object.freeze({__proto__:null,AXNodeSubPane:C,AXNodePropertyTreeElement:k,TypeStyles:L,StringProperties:R,AXNodePropertyTreePropertyElement:I,AXValueSourceTreeElement:P,AXRelatedNodeSourceTreeElement:M,AXRelatedNodeElement:F,AXNodeIgnoredReasonTreeElement:S});const O={attributes:[{type:"IDREF",name:"aria-activedescendant"},{default:"false",type:"boolean",name:"aria-atomic"},{default:"none",enum:["inline","list","both","none"],type:"token",name:"aria-autocomplete"},{default:"false",type:"boolean",name:"aria-busy"},{default:"undefined",enum:["true","false","mixed","undefined"],type:"token",name:"aria-checked"},{type:"integer",name:"aria-colcount"},{type:"integer",name:"aria-colindex"},{type:"integer",name:"aria-colspan"},{type:"IDREF_list",name:"aria-controls"},{default:"false",enum:["page","step","location","date","time","true","false"],type:"token",name:"aria-current"},{type:"IDREF_list",name:"aria-describedby"},{type:"string",name:"aria-description"},{type:"IDREF",name:"aria-details"},{default:"false",type:"boolean",name:"aria-disabled"},{default:"none",enum:["copy","move","link","execute","popup","none"],type:"token_list",name:"aria-dropeffect"},{type:"IDREF",name:"aria-errormessage"},{default:"undefined",enum:["true","false","undefined"],type:"token",name:"aria-expanded"},{type:"IDREF_list",name:"aria-flowto"},{default:"undefined",enum:["true","false","undefined"],type:"token",name:"aria-grabbed"},{default:"false",enum:["false","true","menu","listbox","tree","grid","dialog"],type:"token",name:"aria-haspopup"},{default:"undefined",enum:["true","false","undefined"],type:"token",name:"aria-hidden"},{default:"false",enum:["grammar","false","spelling","true"],type:"token",name:"aria-invalid"},{type:"string",name:"aria-keyshortcuts"},{type:"string",name:"aria-label"},{type:"IDREF_list",name:"aria-labelledby"},{type:"IDREF_list",name:"aria-labeledby"},{type:"integer",name:"aria-level"},{default:"off",enum:["off","polite","assertive"],type:"token",name:"aria-live"},{default:"false",type:"boolean",name:"aria-modal"},{default:"false",type:"boolean",name:"aria-multiline"},{default:"false",type:"boolean",name:"aria-multiselectable"},{default:"undefined",enum:["horizontal","undefined","vertical"],type:"token",name:"aria-orientation"},{type:"IDREF_list",name:"aria-owns"},{type:"string",name:"aria-placeholder"},{type:"integer",name:"aria-posinset"},{default:"undefined",enum:["true","false","mixed","undefined"],type:"token",name:"aria-pressed"},{default:"false",type:"boolean",name:"aria-readonly"},{default:"additions text",enum:["additions","removals","text","all"],type:"token_list",name:"aria-relevant"},{default:"false",type:"boolean",name:"aria-required"},{type:"string",name:"aria-roledescription"},{type:"integer",name:"aria-rowcount"},{type:"integer",name:"aria-rowindex"},{type:"integer",name:"aria-rowspan"},{default:"undefined",enum:["true","false","undefined"],type:"token",name:"aria-selected"},{type:"integer",name:"aria-setsize"},{default:"none",enum:["ascending","descending","none","other"],type:"token",name:"aria-sort"},{type:"decimal",name:"aria-valuemax"},{type:"decimal",name:"aria-valuemin"},{type:"decimal",name:"aria-valuenow"},{type:"string",name:"aria-valuetext"}],roles:[{implicitValues:{"aria-atomic":"true","aria-live":"assertive"},superclasses:["section"],name:"alert",nameFrom:["author"]},{superclasses:["alert","dialog"],name:"alertdialog",nameRequired:!0,nameFrom:["author"]},{superclasses:["structure"],name:"application",nameRequired:!0,nameFrom:["author"]},{supportedAttributes:["aria-posinset","aria-setsize"],superclasses:["document"],name:"article",nameFrom:["author"]},{superclasses:["landmark"],name:"banner",nameFrom:["author"]},{name:"button",nameRequired:!0,nameFrom:["contents","author"],supportedAttributes:["aria-expanded","aria-pressed"],superclasses:["command"],childrenPresentational:!0},{scope:"row",supportedAttributes:["aria-colindex","aria-colspan","aria-rowindex","aria-rowspan"],superclasses:["section"],name:"cell",namefrom:["contents","author"]},{name:"checkbox",nameRequired:!0,implicitValues:{"aria-checked":!1},requiredAttributes:["aria-checked"],nameFrom:["contents","author"],supportedAttributes:["aria-readonly"],superclasses:["input"]},{name:"columnheader",nameRequired:!0,nameFrom:["contents","author"],supportedAttributes:["aria-sort"],superclasses:["gridcell","sectionhead","widget"],scope:["row"]},{name:"combobox",nameRequired:!0,implicitValues:{"aria-haspopup":"listbox","aria-expanded":"false"},requiredAttributes:["aria-controls","aria-expanded"],mustContain:["textbox"],nameFrom:["author"],supportedAttributes:["aria-autocomplete","aria-readonly","aria-required"],superclasses:["select"]},{abstract:!0,superclasses:["widget"],name:"command",nameFrom:["author"]},{superclasses:["landmark"],name:"complementary",nameFrom:["author"]},{supportedAttributes:["aria-activedescendant"],abstract:!0,superclasses:["widget"],name:"composite",nameFrom:["author"]},{superclasses:["landmark"],name:"contentinfo",nameFrom:["author"]},{superclasses:["section"],name:"definition",nameFrom:["author"]},{superclasses:["window"],name:"dialog",nameRequired:!0,nameFrom:["author"]},{superclasses:["list"],name:"directory",nameFrom:["author"]},{supportedAttributes:["aria-expanded"],superclasses:["structure"],name:"document",nameRequired:!1,nameFrom:["author"]},{nameRequired:!1,superclasses:["list"],name:"feed",mustContain:["article"],nameFrom:["author"]},{superclasses:["section"],name:"figure",nameRequired:!1,namefrom:["author"]},{superclasses:["landmark"],name:"form",nameFrom:["author"]},{name:"grid",nameRequired:!0,nameFrom:["author"],mustContain:["row"],supportedAttributes:["aria-level","aria-multiselectable","aria-readonly"],superclasses:["composite","table"]},{name:"gridcell",nameRequired:!0,nameFrom:["contents","author"],supportedAttributes:["aria-readonly","aria-required","aria-selected"],superclasses:["cell","widget"],scope:["row"]},{supportedAttributes:["aria-activedescendant"],superclasses:["section"],name:"group",nameFrom:["author"]},{name:"heading",nameRequired:!0,implicitValues:{"aria-level":"2"},namefrom:["contents","author"],supportedAttributes:["aria-level"],superclasses:["sectionhead"]},{childrenPresentational:!0,superclasses:["section"],name:"img",nameRequired:!0,nameFrom:["author"]},{abstract:!0,superclasses:["widget"],name:"input",nameFrom:["author"]},{abstract:!0,superclasses:["section"],name:"landmark",nameRequired:!1,nameFrom:["author"]},{supportedAttributes:["aria-expanded"],superclasses:["command"],name:"link",nameRequired:!0,nameFrom:["contents","author"]},{implicitValues:{"aria-orientation":"vertical"},superclasses:["section"],name:"list",mustContain:["listitem"],nameFrom:["author"]},{name:"listbox",nameRequired:!0,implicitValues:{"aria-orientation":"vertical"},nameFrom:["author"],mustContain:["option"],supportedAttributes:["aria-multiselectable","aria-readonly","aria-required"],superclasses:["select"]},{scope:["group","list"],supportedAttributes:["aria-level","aria-posinset","aria-setsize"],superclasses:["section"],name:"listitem",nameFrom:["author"]},{implicitValues:{"aria-live":"polite"},superclasses:["section"],name:"log",nameRequired:!0,nameFrom:["author"]},{superclasses:["landmark"],name:"main",nameFrom:["author"]},{superclasses:["section"],name:"marquee",nameRequired:!0,nameFrom:["author"]},{childrenPresentational:!0,superclasses:["section"],name:"math",nameRequired:!0,nameFrom:["author"]},{implicitValues:{"aria-orientation":"vertical"},superclasses:["select"],name:"menu",mustContain:["group","menuitemradio","menuitem","menuitemcheckbox","menuitemradio"],nameFrom:["author"]},{implicitValues:{"aria-orientation":"horizontal"},superclasses:["menu"],name:"menubar",mustContain:["menuitem","menuitemradio","menuitemcheckbox"],nameFrom:["author"]},{scope:["group","menu","menubar"],superclasses:["command"],name:"menuitem",nameRequired:!0,nameFrom:["contents","author"]},{name:"menuitemcheckbox",nameRequired:!0,implicitValues:{"aria-checked":!1},nameFrom:["contents","author"],superclasses:["checkbox","menuitem"],childrenPresentational:!0,scope:["menu","menubar"]},{name:"menuitemradio",nameRequired:!0,implicitValues:{"aria-checked":!1},nameFrom:["contents","author"],superclasses:["menuitemcheckbox","radio"],childrenPresentational:!0,scope:["menu","menubar","group"]},{superclasses:["landmark"],name:"navigation",nameFrom:["author"]},{name:"none",superclasses:["structure"]},{superclasses:["section"],name:"note",nameFrom:["author"]},{name:"option",nameRequired:!0,implicitValues:{"aria-selected":"false"},requiredAttributes:["aria-selected"],nameFrom:["contents","author"],supportedAttributes:["aria-checked","aria-posinset","aria-setsize"],superclasses:["input"],childrenPresentational:!0,scope:["listbox"]},{name:"presentation",superclasses:["structure"]},{childrenPresentational:!0,superclasses:["range"],name:"progressbar",nameRequired:!0,nameFrom:["author"]},{name:"radio",nameRequired:!0,implicitValues:{"aria-checked":"false"},requiredAttributes:["aria-checked"],nameFrom:["contents","author"],supportedAttributes:["aria-posinset","aria-setsize"],superclasses:["input"],childrenPresentational:!0},{name:"radiogroup",nameRequired:!0,nameFrom:["author"],mustContain:["radio"],supportedAttributes:["aria-readonly","aria-required"],superclasses:["select"]},{supportedAttributes:["aria-valuemax","aria-valuemin","aria-valuenow","aria-valuetext"],abstract:!0,superclasses:["widget"],name:"range",nameFrom:["author"]},{superclasses:["landmark"],name:"region",nameRequired:!0,nameFrom:["author"]},{supportedAttributes:["aria-atomic","aria-busy","aria-controls","aria-current","aria-describedby","aria-details","aria-disabled","aria-dropeffect","aria-errormessage","aria-flowto","aria-grabbed","aria-haspopup","aria-hidden","aria-invalid","aria-keyshortcuts","aria-label","aria-labelledby","aria-live","aria-owns","aria-relevant","aria-roledescription"],abstract:!0,name:"roletype"},{name:"row",nameFrom:["contents","author"],mustContain:["cell","columnheader","gridcell","rowheader"],supportedAttributes:["aria-colindex","aria-level","aria-rowindex","aria-selected","aria-setsize","aria-posinset"],superclasses:["group","widget"],scope:["grid","rowgroup","table","treegrid"]},{scope:["grid","table","treegrid"],superclasses:["structure"],name:"rowgroup",mustContain:["row"],nameFrom:["contents","author"]},{name:"rowheader",nameRequired:!0,nameFrom:["contents","author"],supportedAttributes:["aria-sort"],superclasses:["cell","gridcell","sectionhead"],scope:["row"]},{name:"scrollbar",nameRequired:!1,implicitValues:{"aria-valuemax":"100","aria-valuemin":"0","aria-orientation":"vertical"},nameFrom:["author"],requiredAttributes:["aria-controls","aria-orientation","aria-valuemax","aria-valuemin","aria-valuenow"],superclasses:["range"],childrenPresentational:!0},{superclasses:["landmark"],name:"search",nameFrom:["author"]},{superclasses:["textbox"],name:"searchbox",nameRequired:!0,nameFrom:["author"]},{supportedAttributes:["aria-expanded"],abstract:!0,name:"section",superclasses:["structure"]},{supportedAttributes:["aria-expanded"],abstract:!0,superclasses:["structure"],name:"sectionhead",nameFrom:["contents","author"]},{abstract:!0,superclasses:["composite","group"],name:"select",nameFrom:["author"]},{supportedAttributes:["aria-orientation","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext"],superclasses:["structure"],name:"separator",nameFrom:["author"]},{name:"slider",nameRequired:!0,implicitValues:{"aria-valuemax":"100","aria-valuemin":"0","aria-orientation":"horizontal"},requiredAttributes:["aria-valuemax","aria-valuemin","aria-valuenow"],nameFrom:["author"],supportedAttributes:["aria-orientation"],superclasses:["input","range"],childrenPresentational:!0},{name:"spinbutton",nameRequired:!0,implicitValues:{"aria-valuenow":"0"},requiredAttributes:["aria-valuemax","aria-valuemin","aria-valuenow"],nameFrom:["author"],supportedAttributes:["aria-required","aria-readonly"],superclasses:["composite","input","range"]},{implicitValues:{"aria-atomic":"true","aria-live":"polite"},superclasses:["section"],name:"status",nameFrom:["author"]},{abstract:!0,name:"structure",superclasses:["roletype"]},{name:"switch",nameRequired:!0,implicitValues:{"aria-checked":"false"},nameFrom:["contents","author"],requiredAttributes:["aria-checked"],superclasses:["checkbox"],childrenPresentational:!0},{name:"tab",implicitValues:{"aria-selected":"false"},nameFrom:["contents","author"],supportedAttributes:["aria-selected"],superclasses:["sectionhead","widget"],childrenPresentational:!0,scope:["tablist"]},{name:"table",nameRequired:!0,nameFrom:["author"],mustContain:["row"],supportedAttributes:["aria-colcount","aria-rowcount"],superclasses:["section"]},{name:"tablist",implicitValues:{"aria-orientation":"horizontal"},nameFrom:["author"],mustContain:["tab"],supportedAttributes:["aria-level","aria-multiselectable","aria-orientation"],superclasses:["composite"]},{superclasses:["section"],name:"tabpanel",nameRequired:!0,nameFrom:["author"]},{superclasses:["section"],name:"term",nameFrom:["author"]},{supportedAttributes:["aria-activedescendant","aria-autocomplete","aria-multiline","aria-placeholder","aria-readonly","aria-required"],superclasses:["input"],name:"textbox",nameRequired:!0,nameFrom:["author"]},{superclasses:["status"],name:"timer",nameFrom:["author"]},{implicitValues:{"aria-orientation":"horizontal"},supportedAttributes:["aria-orientation"],superclasses:["group"],name:"toolbar",nameFrom:["author"]},{superclasses:["section"],name:"tooltip",nameRequired:!0,nameFrom:["contents","author"]},{name:"tree",nameRequired:!0,implicitValues:{"aria-orientation":"vertical"},nameFrom:["author"],mustContain:["group","treeitem"],supportedAttributes:["aria-multiselectable","aria-required"],superclasses:["select"]},{nameRequired:!0,superclasses:["grid","tree"],name:"treegrid",mustContain:["row"],nameFrom:["author"]},{scope:["group","tree"],superclasses:["listitem","option"],name:"treeitem",nameRequired:!0,nameFrom:["contents","author"]},{abstract:!0,name:"widget",superclasses:["roletype"]},{supportedAttributes:["aria-expanded","aria-modal"],abstract:!0,superclasses:["roletype"],name:"window",nameFrom:["author"]}],metadata:{namespaceURI:"http://www.w3.org/1999/xhtml",attrsNullNamespace:!0,namespace:"HTML",export:"CORE_EXPORT",namespacePrefix:"xhtml"}};let T;class D{constructor(e){this._attributes=new Map,this._roleNames=[],e&&this._initialize(e)}_initialize(e){const t=e.attributes,a=["true","false"];for(const e of t)"boolean"===e.type&&(e.enum=a),this._attributes.set(e.name,new B(e));this._roleNames=e.roles.map((e=>e.name))}valuesForProperty(e){const t=this._attributes.get(e);return t?t.getEnum():"role"===e?this._roleNames:[]}}function q(){return T||(T=new D(O||null)),T}class B{constructor(e){this._enum=[],e.enum&&(this._enum=e.enum)}getEnum(){return this._enum}}var X=Object.freeze({__proto__:null,AttributeConfig:undefined,RoleConfig:undefined,Config:undefined,ARIAMetadata:D,ariaMetadata:q,Attribute:B});class W extends A{constructor(){super(a`ARIA Attributes`),this._noPropertiesInfo=this.createInfo(a`No ARIA attributes`),this._treeOutline=this.createTreeOutline()}setNode(e){if(super.setNode(e),this._treeOutline.removeChildren(),!e)return;const t=e.domModel().target(),a=e.attributes();for(let e=0;e<a.length;++e){const i=a[e];this._isARIAAttribute(i)&&this._treeOutline.appendChild(new z(this,i,t))}const i=0!==this._treeOutline.rootElement().childCount();this._noPropertiesInfo.classList.toggle("hidden",i),this._treeOutline.element.classList.toggle("hidden",!i)}_isARIAAttribute(e){return j.has(e.name)}}class z extends l.TreeElement{constructor(e,t,a){super(""),this._parentPane=e,this._attribute=t,this.selectable=!1}static createARIAValueElement(e){const t=document.createElement("span");return t.classList.add("monospace"),t.setTextContentTruncatedIfNeeded(e||""),t}onattach(){this._populateListItem(),this.listItemElement.addEventListener("click",this._mouseClick.bind(this))}_populateListItem(){this.listItemElement.removeChildren(),this.appendNameElement(this._attribute.name),this.listItemElement.createChild("span","separator").textContent=": ",this.appendAttributeValueElement(this._attribute.value)}appendNameElement(e){this._nameElement=document.createElement("span"),this._nameElement.textContent=e,this._nameElement.classList.add("ax-name"),this._nameElement.classList.add("monospace"),this.listItemElement.appendChild(this._nameElement)}appendAttributeValueElement(e){this._valueElement=z.createARIAValueElement(e),this.listItemElement.appendChild(this._valueElement)}_mouseClick(e){e.target!==this.listItemElement&&(e.consume(!0),this._startEditing())}_startEditing(){const e=this._valueElement;if(!e||c.isBeingEdited(e))return;const t=e.textContent||"";const a=this._nameElement.textContent||"";this._prompt=new H(q().valuesForProperty(a),this),this._prompt.setAutocompletionTimeout(0);this._prompt.attachAndStartEditing(e,function(e,t){const a=t.target.textContent||"";this._editingCommitted(a,e)}.bind(this,t)).addEventListener("keydown",(e=>this._editingValueKeyDown(t,e)),!1);const i=e.getComponentSelection();i&&i.selectAllChildren(e)}_removePrompt(){this._prompt&&(this._prompt.detach(),delete this._prompt)}_editingCommitted(e,t){if(this._removePrompt(),e!==t){this._parentPane.node().setAttributeValue(this._attribute.name,e)}}_editingCancelled(){this._removePrompt(),this._populateListItem()}_editingValueKeyDown(e,t){if(!t.handled){if("Enter"===t.key){const a=t.target;return this._editingCommitted(a.textContent||"",e),void t.consume()}return isEscKey(t)?(this._editingCancelled(),void t.consume()):void 0}}}class H extends u.TextPrompt{constructor(e,t){super(),this.initialize(this._buildPropertyCompletions.bind(this)),this._ariaCompletions=e,this._treeElement=t}async _buildPropertyCompletions(e,t,a){return(t=t.toLowerCase())||a||!e?this._ariaCompletions.filter((e=>e.startsWith(t))).map((e=>({text:e,title:void 0,subtitle:void 0,iconType:void 0,priority:void 0,isSecondary:void 0,subtitleRenderer:void 0,selectionRange:void 0,hideGhostText:void 0,iconElement:void 0}))):[]}}const j=new Set(["role","aria-activedescendant","aria-atomic","aria-autocomplete","aria-brailleroledescription","aria-busy","aria-checked","aria-colcount","aria-colindex","aria-colindextext","aria-colspan","aria-controls","aria-current","aria-describedby","aria-details","aria-disabled","aria-dropeffect","aria-errormessage","aria-expanded","aria-flowto","aria-grabbed","aria-haspopup","aria-hidden","aria-invalid","aria-keyshortcuts","aria-label","aria-labelledby","aria-level","aria-live","aria-modal","aria-multiline","aria-multiselectable","aria-orientation","aria-owns","aria-placeholder","aria-posinset","aria-pressed","aria-readonly","aria-relevant","aria-required","aria-roledescription","aria-rowcount","aria-rowindex","aria-rowindextext","aria-rowspan","aria-selected","aria-setsize","aria-sort","aria-valuemax","aria-valuemin","aria-valuenow","aria-valuetext"]);var K=Object.freeze({__proto__:null,ARIAAttributesPane:W,ARIAAttributesTreeElement:z,ARIAAttributePrompt:H});class U extends A{constructor(e){super(a`Accessibility Tree`),this.element.classList.add("ax-subpane"),m.markAsTree(this.element),this.element.tabIndex=-1,this._axSidebarView=e,this._preselectedBreadcrumb=null,this._inspectedNodeBreadcrumb=null,this._collapsingBreadcrumbId=-1,this._hoveredBreadcrumb=null,this._rootElement=this.element.createChild("div","ax-breadcrumbs"),this._rootElement.addEventListener("keydown",this._onKeyDown.bind(this),!0),this._rootElement.addEventListener("mousemove",this._onMouseMove.bind(this),!1),this._rootElement.addEventListener("mouseleave",this._onMouseLeave.bind(this),!1),this._rootElement.addEventListener("click",this._onClick.bind(this),!1),this._rootElement.addEventListener("contextmenu",this._contextMenuEventFired.bind(this),!1),this._rootElement.addEventListener("focusout",this._onFocusOut.bind(this),!1),this.registerRequiredCSS("accessibility/axBreadcrumbs.css",{enableLegacyPatching:!1})}focus(){this._inspectedNodeBreadcrumb?this._inspectedNodeBreadcrumb.nodeElement().focus():this.element.focus()}setAXNode(e){const t=this.element.hasFocus();if(super.setAXNode(e),this._rootElement.removeChildren(),!e)return;const a=[];let i=e;for(;i;)a.push(i),i=i.parentNode();a.reverse();let s=0,r=null,n=null;for(i of a)r=new J(i,s,i===e),n?n.appendChild(r):this._rootElement.appendChild(r.element()),n=r,s++;function o(e,t,a){const i=new J(t,a,!1);e.appendChild(i);for(const e of t.children())o(i,e,a+1)}if(this._inspectedNodeBreadcrumb=r,this._inspectedNodeBreadcrumb&&this._inspectedNodeBreadcrumb.setPreselected(!0,t),this._setPreselectedBreadcrumb(this._inspectedNodeBreadcrumb),this._inspectedNodeBreadcrumb)for(const t of e.children())o(this._inspectedNodeBreadcrumb,t,s),t.backendDOMNodeId()===this._collapsingBreadcrumbId&&this._setPreselectedBreadcrumb(this._inspectedNodeBreadcrumb.lastChild());this._collapsingBreadcrumbId=-1}willHide(){this._setPreselectedBreadcrumb(null)}_onKeyDown(e){const t=this._preselectedBreadcrumb;if(!t)return;const a=e;if(!a.composedPath().some((e=>e===t.element())))return;if(a.shiftKey||a.metaKey||a.ctrlKey)return;let i=!1;"ArrowUp"!==a.key||a.altKey?"ArrowDown"!==a.key||a.altKey?"ArrowLeft"!==a.key||a.altKey?("Enter"===a.key||"ArrowRight"===a.key&&!a.altKey&&t.axNode().hasOnlyUnloadedChildren())&&(i=this._inspectDOMNode(t.axNode())):t.hasExpandedChildren()?this._collapseBreadcrumb(t):i=this._preselectParent():i=this._preselectNext():i=this._preselectPrevious(),i&&a.consume(!0)}_preselectPrevious(){if(!this._preselectedBreadcrumb)return!1;const e=this._preselectedBreadcrumb.previousBreadcrumb();return!!e&&(this._setPreselectedBreadcrumb(e),!0)}_preselectNext(){if(!this._preselectedBreadcrumb)return!1;const e=this._preselectedBreadcrumb.nextBreadcrumb();return!!e&&(this._setPreselectedBreadcrumb(e),!0)}_preselectParent(){if(!this._preselectedBreadcrumb)return!1;const e=this._preselectedBreadcrumb.parentBreadcrumb();return!!e&&(this._setPreselectedBreadcrumb(e),!0)}_setPreselectedBreadcrumb(e){if(e===this._preselectedBreadcrumb)return;const t=this.element.hasFocus();this._preselectedBreadcrumb&&this._preselectedBreadcrumb.setPreselected(!1,t),this._preselectedBreadcrumb=e||this._inspectedNodeBreadcrumb,this._preselectedBreadcrumb&&this._preselectedBreadcrumb.setPreselected(!0,t),!e&&t&&r.OverlayModel.hideDOMNodeHighlight()}_collapseBreadcrumb(e){if(!e.parentBreadcrumb())return;const t=e.axNode().backendDOMNodeId();null!==t&&(this._collapsingBreadcrumbId=t);const a=e.parentBreadcrumb();a&&this._inspectDOMNode(a.axNode())}_onMouseLeave(e){this._setHoveredBreadcrumb(null)}_onMouseMove(e){const t=e.target;if(!t)return;const a=t.enclosingNodeOrSelfWithClass("ax-breadcrumb");if(!a)return void this._setHoveredBreadcrumb(null);const i=G.get(a);i&&i.isDOMNode()&&this._setHoveredBreadcrumb(i)}_onFocusOut(e){this._preselectedBreadcrumb&&e.target===this._preselectedBreadcrumb.nodeElement()&&this._setPreselectedBreadcrumb(null)}_onClick(e){const t=e.target;if(!t)return;const a=t.enclosingNodeOrSelfWithClass("ax-breadcrumb");if(!a)return void this._setHoveredBreadcrumb(null);const i=G.get(a);return i?i.inspected()?(this._collapseBreadcrumb(i),void i.nodeElement().focus()):void(i.isDOMNode()&&this._inspectDOMNode(i.axNode())):void 0}_setHoveredBreadcrumb(e){if(e===this._hoveredBreadcrumb)return;this._hoveredBreadcrumb&&this._hoveredBreadcrumb.setHovered(!1);const t=this.node();e?e.setHovered(!0):t&&t.id&&t.domModel().overlayModel().nodeHighlightRequested({nodeId:t.id}),this._hoveredBreadcrumb=e}_inspectDOMNode(e){if(!e.isDOMNode())return!1;const a=e.deferredDOMNode();return a&&a.resolve((e=>{this._axSidebarView.setNode(e,!0),t.reveal(e,!0)})),!0}_contextMenuEventFired(e){const t=e.target;if(!t)return;const i=t.enclosingNodeOrSelfWithClass("ax-breadcrumb");if(!i)return;const s=G.get(i);if(!s)return;const r=s.axNode();if(!r.isDOMNode()||!r.deferredDOMNode())return;const n=new h.ContextMenu(e);n.viewSection().appendItem(a`Scroll into view`,(()=>{const e=r.deferredDOMNode();e&&e.resolvePromise().then((e=>{e&&e.scrollIntoView()}))}));const o=r.deferredDOMNode();o&&n.appendApplicableItems(o),n.show()}}const G=new WeakMap;class J{constructor(e,t,a){if(this._axNode=e,this._element=document.createElement("div"),this._element.classList.add("ax-breadcrumb"),G.set(this._element,this),this._nodeElement=document.createElement("div"),this._nodeElement.classList.add("ax-node"),m.markAsTreeitem(this._nodeElement),this._nodeElement.tabIndex=-1,this._element.appendChild(this._nodeElement),this._nodeWrapper=document.createElement("div"),this._nodeWrapper.classList.add("wrapper"),this._nodeElement.appendChild(this._nodeWrapper),this._selectionElement=document.createElement("div"),this._selectionElement.classList.add("selection"),this._selectionElement.classList.add("fill"),this._nodeElement.appendChild(this._selectionElement),this._childrenGroupElement=document.createElement("div"),this._childrenGroupElement.classList.add("children"),m.markAsGroup(this._childrenGroupElement),this._element.appendChild(this._childrenGroupElement),this._children=[],this._hovered=!1,this._preselected=!1,this._parent=null,this._inspected=a,this._nodeElement.classList.toggle("inspected",a),this._nodeElement.style.paddingLeft=16*t+4+"px",this._axNode.ignored())this._appendIgnoredNodeElement();else{this._appendRoleElement(this._axNode.role());const e=this._axNode.name();e&&e.value&&(this._nodeWrapper.createChild("span","separator").textContent=" ",this._appendNameElement(e.value))}this._axNode.hasOnlyUnloadedChildren()&&(this._nodeElement.classList.add("children-unloaded"),m.setExpanded(this._nodeElement,!1)),this._axNode.isDOMNode()||this._nodeElement.classList.add("no-dom-node")}element(){return this._element}nodeElement(){return this._nodeElement}appendChild(e){this._children.push(e),e.setParent(this),this._nodeElement.classList.add("parent"),m.setExpanded(this._nodeElement,!0),this._childrenGroupElement.appendChild(e.element())}hasExpandedChildren(){return this._children.length}setParent(e){this._parent=e}preselected(){return this._preselected}setPreselected(e,t){this._preselected!==e&&(this._preselected=e,this._nodeElement.classList.toggle("preselected",e),this._nodeElement.tabIndex=e?0:-1,this._preselected&&(t&&this._nodeElement.focus(),this._inspected?r.OverlayModel.hideDOMNodeHighlight():this._axNode.highlightDOMNode()))}setHovered(e){this._hovered!==e&&(this._hovered=e,this._nodeElement.classList.toggle("hovered",e),this._hovered&&(this._nodeElement.classList.toggle("hovered",!0),this._axNode.highlightDOMNode()))}axNode(){return this._axNode}inspected(){return this._inspected}isDOMNode(){return this._axNode.isDOMNode()}nextBreadcrumb(){if(this._children.length)return this._children[0];const e=this.element().nextSibling;return e&&G.get(e)||null}previousBreadcrumb(){const e=this.element().previousSibling;return e?G.get(e)||null:this._parent}parentBreadcrumb(){return this._parent}lastChild(){return this._children[this._children.length-1]}_appendNameElement(e){const t=document.createElement("span");t.textContent='"'+e+'"',t.classList.add("ax-readable-string"),this._nodeWrapper.appendChild(t)}_appendRoleElement(e){if(!e)return;const t=document.createElement("span");t.classList.add("monospace"),t.classList.add(Q[e.type]),t.setTextContentTruncatedIfNeeded(e.value||""),this._nodeWrapper.appendChild(t)}_appendIgnoredNodeElement(){const e=document.createElement("span");e.classList.add("monospace"),e.textContent=a`Ignored`,e.classList.add("ax-breadcrumbs-ignored-node"),this._nodeWrapper.appendChild(e)}}const Q={internalRole:"ax-internal-role",role:"ax-role"};var Y=Object.freeze({__proto__:null,AXBreadcrumbsPane:U,AXBreadcrumb:J,RoleStyles:Q});class Z extends A{constructor(){super(a`Source Order Viewer`),this._noNodeInfo=this.createInfo(a`No source order information available`),this._warning=this.createInfo(a`There may be a delay in displaying source order for elements with many children`),this._warning.id="source-order-warning",this._checked=!1,this._checkboxLabel=c.CheckboxLabel.create(a`Show source order`,!1),this._checkboxElement=this._checkboxLabel.checkboxElement,this._checkboxLabel.classList.add("source-order-checkbox"),this._checkboxElement.addEventListener("click",this._checkboxClicked.bind(this),!1),this.element.appendChild(this._checkboxLabel),this._node=null,this._overlayModel=null}async setNodeAsync(e){if(this._checkboxLabel.classList.contains("hidden")||(this._checked=this._checkboxElement.checked),this._checkboxElement.checked=!1,this._checkboxClicked(),super.setNode(e),!this._node)return void(this._overlayModel=null);let t=!1;const a=this._node.childNodeCount();if(a>0){this._node.children()||await this._node.getSubtree(1,!1);t=this._node.children().some((e=>e.nodeType()===Node.ELEMENT_NODE))}this._noNodeInfo.classList.toggle("hidden",t),this._warning.classList.toggle("hidden",a<300),this._checkboxLabel.classList.toggle("hidden",!t),t?(this._overlayModel=this._node.domModel().overlayModel(),this._checkboxElement.checked=this._checked,this._checkboxClicked()):this._overlayModel=null}_checkboxClicked(){this._node&&this._overlayModel&&(this._checkboxElement.checked?(g.actionTaken(v.Action.SourceOrderViewActivated),this._overlayModel.highlightSourceOrderInOverlay(this._node)):this._overlayModel.hideSourceOrderInOverlay())}}let $;class ee extends p.ThrottledWidget{constructor(){super(),this._sourceOrderViewerExperimentEnabled=f.experiments.isEnabled("sourceOrderViewer"),this._node=null,this._axNode=null,this._skipNextPullNode=!1,this._sidebarPaneStack=b.ViewManager.instance().createStackLocation(),this._breadcrumbsSubPane=new U(this),this._sidebarPaneStack.showView(this._breadcrumbsSubPane),this._ariaSubPane=new W,this._sidebarPaneStack.showView(this._ariaSubPane),this._axNodeSubPane=new C,this._sidebarPaneStack.showView(this._axNodeSubPane),this._sourceOrderViewerExperimentEnabled&&(this._sourceOrderSubPane=new Z,this._sidebarPaneStack.showView(this._sourceOrderSubPane)),this._sidebarPaneStack.widget().show(this.element),_.Context.instance().addFlavorChangeListener(s.DOMNode,this._pullNode,this),this._pullNode()}static instance(){return $||($=new ee),$}node(){return this._node}axNode(){return this._axNode}setNode(e,t){this._skipNextPullNode=Boolean(t),this._node=e,this.update()}accessibilityNodeCallback(e){e&&(this._axNode=e,e.isDOMNode()?this._sidebarPaneStack.showView(this._ariaSubPane,this._axNodeSubPane):this._sidebarPaneStack.removeView(this._ariaSubPane),this._axNodeSubPane&&this._axNodeSubPane.setAXNode(e),this._breadcrumbsSubPane&&this._breadcrumbsSubPane.setAXNode(e))}async doUpdate(){const e=this.node();if(this._axNodeSubPane.setNode(e),this._ariaSubPane.setNode(e),this._breadcrumbsSubPane.setNode(e),this._sourceOrderViewerExperimentEnabled&&this._sourceOrderSubPane&&this._sourceOrderSubPane.setNodeAsync(e),!e)return;const t=e.domModel().target().model(i.AccessibilityModel);t&&(t.clear(),await t.requestPartialAXTree(e),this.accessibilityNodeCallback(t.axNodeForDOMNode(e)))}wasShown(){super.wasShown(),this.doUpdate(),n.TargetManager.instance().addModelListener(s.DOMModel,s.Events.AttrModified,this._onAttrChange,this),n.TargetManager.instance().addModelListener(s.DOMModel,s.Events.AttrRemoved,this._onAttrChange,this),n.TargetManager.instance().addModelListener(s.DOMModel,s.Events.CharacterDataModified,this._onNodeChange,this),n.TargetManager.instance().addModelListener(s.DOMModel,s.Events.ChildNodeCountUpdated,this._onNodeChange,this)}willHide(){n.TargetManager.instance().removeModelListener(s.DOMModel,s.Events.AttrModified,this._onAttrChange,this),n.TargetManager.instance().removeModelListener(s.DOMModel,s.Events.AttrRemoved,this._onAttrChange,this),n.TargetManager.instance().removeModelListener(s.DOMModel,s.Events.CharacterDataModified,this._onNodeChange,this),n.TargetManager.instance().removeModelListener(s.DOMModel,s.Events.ChildNodeCountUpdated,this._onNodeChange,this)}_pullNode(){this._skipNextPullNode?this._skipNextPullNode=!1:this.setNode(_.Context.instance().flavor(s.DOMNode))}_onAttrChange(e){if(!this.node())return;const t=e.data.node;this.node()===t&&this.update()}_onNodeChange(e){if(!this.node())return;const t=e.data;this.node()===t&&this.update()}}var te=Object.freeze({__proto__:null,AccessibilitySidebarView:ee});export{K as ARIAAttributesView,X as ARIAMetadata,Y as AXBreadcrumbsPane,V as AccessibilityNodeView,te as AccessibilitySidebarView,N as AccessibilityStrings,w as AccessibilitySubPane};

package/static/devtools/accessibility/accessibility_module.js

@@ -0,0 +1 @@
+import*as RootModule from'../root/root.js';RootModule.Runtime.cachedResources.set("accessibility/accessibilityNode.css","/*\n * Copyright 2017 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n.widget.ax-subpane {\n  overflow-x: hidden;\n  user-select: text;\n}\n\n.ax-ignored-info {\n  padding: 6px;\n}\n\n.ax-ignored-node-pane {\n  flex: none;\n}\n\n.invalid {\n  text-decoration: line-through;\n}\n\nspan.ax-value-undefined {\n  font-style: italic;\n}\n\n.ax-value-source-unused {\n  opacity: 70%;\n}\n\n.ax-value-source-superseded,\n.ax-value-source-invalid {\n  text-decoration: line-through;\n}\n\n.tree-outline span[is=dt-icon-label] {\n  position: relative;\n  left: -11px;\n}\n\n.tree-outline li {\n  display: block;\n  overflow-x: hidden;\n  align-items: baseline;\n}\n\n.tree-outline li::before {\n  content: \"\";\n  width: 14px;\n  display: inline-block;\n}\n\n.tree-outline li.property {\n  color: var(--color-text-primary);\n}\n\n.tree-outline li.invalid {\n  position: relative;\n  left: -2px;\n}\n\n.tree-outline span[is=dt-icon-label] + .ax-name {\n  margin-left: -11px;\n}\n\n.tree-outline li span {\n  flex-shrink: 0;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n@media (forced-colors: active) {\n  .ax-value-source-unused {\n    opacity: 100%;\n  }\n\n  .tree-outline-disclosure:hover li.parent::before {\n    background-color: ButtonText;\n  }\n}\n\n/*# sourceURL=accessibility/accessibilityNode.css */");RootModule.Runtime.cachedResources.set("accessibility/accessibilityProperties.css","/*\n * Copyright 2015 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n.ax-name {\n  color: var(--color-syntax-4);\n  flex-shrink: 0;\n}\n\n.ax-readable-name {\n  flex-shrink: 0;\n}\n\n.ax-readable-string {\n  font-style: italic;\n}\n\n.ax-value-string {\n  color: var(--color-syntax-1);\n}\n\nspan.ax-internal-role {\n  font-style: italic;\n}\n\n#source-order-warning {\n  padding-bottom: 0;\n  text-align: left;\n}\n\n.source-order-checkbox {\n  margin: 5px;\n}\n\n/*# sourceURL=accessibility/accessibilityProperties.css */");RootModule.Runtime.cachedResources.set("accessibility/axBreadcrumbs.css","/*\n * Copyright 2017 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n.ax-breadcrumbs-ignored-node {\n  font-style: italic;\n  opacity: 70%;\n}\n\n.ax-breadcrumbs {\n  padding-top: 1px;\n  margin: 0;\n  position: relative;\n}\n\n.ax-breadcrumbs .ax-node {\n  align-items: center;\n  margin-top: 1px;\n  min-height: 16px;\n  overflow-x: hidden;\n  padding-left: 4px;\n  padding-right: 4px;\n  padding-top: 1px;\n  position: relative;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ax-breadcrumbs .ax-node span {\n  flex-shrink: 0;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ax-breadcrumbs .ax-node .wrapper {\n  padding-left: 12px;\n  overflow-x: hidden;\n}\n\n.ax-breadcrumbs .ax-node::before {\n  -webkit-mask-image: url(Images/chevrons.svg);\n  -webkit-mask-position: 0 0;\n  -webkit-mask-size: 30px 10px;\n  -webkit-mask-repeat: no-repeat;\n  background-color: var(--color-syntax-7);\n  content: '';\n  text-shadow: none;\n  margin-right: -2px;\n  height: 12px;\n  width: 14px;\n  position: absolute;\n  display: inline-block;\n}\n\n.ax-breadcrumbs .ax-node:not(.parent):not(.children-unloaded)::before {\n  background-color: transparent;\n}\n\n.ax-breadcrumbs .ax-node.parent::before {\n  -webkit-mask-position: -20px 1px;\n}\n\n.ax-breadcrumbs .ax-node.no-dom-node {\n  opacity: 70%;\n}\n\n.ax-breadcrumbs .ax-node.children-unloaded::before {\n  -webkit-mask-position: 0 1px;\n  width: 13px;\n  opacity: 40%;\n}\n\n.ax-breadcrumbs .ax-node .selection {\n  display: none;\n  z-index: -1;\n}\n\n.ax-breadcrumbs .ax-node.inspected .selection {\n  display: block;\n  background-color: var(--color-background-elevation-2);\n}\n\n.ax-breadcrumbs .ax-node.inspected:focus .selection {\n  background-color: var(--selection-bg-color);\n}\n\n.ax-breadcrumbs .ax-node.parent.inspected:focus::before {\n  background-color: var(--color-background);\n}\n\n.ax-breadcrumbs .ax-node.inspected:focus {\n  color: var(--color-background);\n}\n\n.ax-breadcrumbs .ax-node.inspected:focus * {\n  color: inherit;\n}\n\n.ax-breadcrumbs .ax-node.preselected:not(.inspected) .selection,\n.ax-breadcrumbs .ax-node.hovered:not(.inspected) .selection {\n  display: block;\n  left: 2px;\n  right: 2px;\n  background-color: var(--item-hover-color);\n  border-radius: 5px;\n}\n\n.ax-breadcrumbs .ax-node.preselected:not(.inspected):focus .selection {\n  border: 1px solid var(--color-primary-variant);\n}\n\n@media (forced-colors: active) {\n  .ax-value-source-unused,\n  .ax-breadcrumbs .ax-node.children-unloaded::before {\n    opacity: 100%;\n  }\n\n  .ax-breadcrumbs .ax-node.parent::before,\n  .ax-breadcrumbs .ax-node.children-unloaded::before {\n    forced-color-adjust: none;\n    background-color: ButtonText;\n  }\n\n  .ax-breadcrumbs .ax-node.parent.inspected::before,\n  .ax-breadcrumbs .ax-node.parent.inspected:focus::before {\n    background-color: HighlightText;\n  }\n\n  .ax-breadcrumbs .ax-node.inspected .selection {\n    forced-color-adjust: none;\n    background: Highlight !important;\n  }\n\n  .ax-breadcrumbs .ax-node.inspected .wrapper {\n    forced-color-adjust: none;\n    color: HighlightText;\n  }\n\n  .ax-breadcrumbs .ax-node.preselected:not(.inspected) .selection,\n  .ax-breadcrumbs .ax-node.hovered:not(.inspected) .selection,\n  .ax-breadcrumbs .ax-node.hovered:not(.inspected) .wrapper,\n  .ax-breadcrumbs .ax-node:focus-visible:not(.inspected) .wrapper {\n    forced-color-adjust: none;\n    background-color: Highlight;\n    color: HighlightText;\n    border-radius: 0;\n  }\n\n  .ax-breadcrumbs .ax-node.parent.hovered:not(.inspected)::before,\n  .ax-breadcrumbs .ax-node.parent:focus-visible:not(.inspected)::before,\n  .ax-breadcrumbs .ax-node.children-unloaded:focus-visible:not(.inspected)::before,\n  .ax-breadcrumbs .ax-node.hovered:not(.inspected).children-unloaded::before {\n    background-color: HighlightText;\n  }\n}\n\n/*# sourceURL=accessibility/axBreadcrumbs.css */");

package/static/devtools/accessibility_test_runner/accessibility_test_runner.js

@@ -0,0 +1,77 @@
+// Copyright 2017 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview using private properties isn't a Closure violation in tests.
+ */
+
+self.AccessibilityTestRunner = self.AccessibilityTestRunner || {};
+
+AccessibilityTestRunner.accessibilitySidebarPane = function() {
+  return self.runtime.sharedInstance(Accessibility.AccessibilitySidebarView);
+};
+
+AccessibilityTestRunner.selectNodeAndWaitForAccessibility = function(idValue) {
+  return new Promise(resolve => {
+    ElementsTestRunner.selectNodeWithId(idValue, function() {
+      self.runtime.sharedInstance(Accessibility.AccessibilitySidebarView).doUpdate().then(resolve);
+    });
+  });
+};
+
+AccessibilityTestRunner.dumpSelectedElementAccessibilityNode = function() {
+  const sidebarPane = AccessibilityTestRunner.accessibilitySidebarPane();
+
+  if (!sidebarPane) {
+    TestRunner.addResult('No sidebarPane in dumpSelectedElementAccessibilityNode');
+    TestRunner.completeTest();
+    return;
+  }
+
+  AccessibilityTestRunner.dumpAccessibilityNode(sidebarPane._axNodeSubPane._axNode);
+};
+
+AccessibilityTestRunner.dumpAccessibilityNode = function(accessibilityNode) {
+  if (!accessibilityNode) {
+    TestRunner.addResult('<null>');
+    TestRunner.completeTest();
+    return;
+  }
+
+  const builder = [];
+  builder.push(accessibilityNode.role().value);
+  builder.push((accessibilityNode.name() ? '"' + accessibilityNode.name().value + '"' : '<undefined>'));
+
+  if (accessibilityNode.properties()) {
+    for (const property of accessibilityNode.properties()) {
+      if ('value' in property) {
+        builder.push(property.name + '="' + property.value.value + '"');
+      }
+    }
+  }
+
+  TestRunner.addResult(builder.join(' '));
+};
+
+AccessibilityTestRunner.findARIAAttributeTreeElement = function(attribute) {
+  const sidebarPane = AccessibilityTestRunner.accessibilitySidebarPane();
+
+  if (!sidebarPane) {
+    TestRunner.addResult('Could not get Accessibility sidebar pane.');
+    TestRunner.completeTest();
+    return;
+  }
+
+  const ariaSubPane = sidebarPane._ariaSubPane;
+  const treeOutline = ariaSubPane._treeOutline;
+  const childNodes = treeOutline._rootElement._children;
+
+  for (const treeElement of childNodes) {
+    if (treeElement._attribute.name === attribute) {
+      return treeElement;
+    }
+  }
+
+  return null;
+};

package/static/devtools/animation/animation-legacy.js

@@ -0,0 +1 @@
+import{AnimationModel as n,AnimationTimeline as i,AnimationUI as o}from"./animation.js";self.Animation=self.Animation||{},Animation=Animation||{},Animation.AnimationModel=n.AnimationModel,Animation.AnimationModel.Events=n.Events,Animation.AnimationModel.Animation=n.AnimationImpl,Animation.AnimationModel.AnimationGroup=n.AnimationGroup,Animation.AnimationModel.ScreenshotCapture=n.ScreenshotCapture,Animation.AnimationTimeline=i.AnimationTimeline,Animation.AnimationUI=o.AnimationUI,Animation.AnimationUI.Events=o.Events;

package/static/devtools/animation/animation-meta.js

@@ -0,0 +1 @@
+import{i18n as i}from"../i18n/i18n.js";import{Runtime as n}from"../root/root.js";import{ViewManager as o}from"../ui/ui.js";let t;const a={animations:"Animations",showAnimations:"Show Animations"},e=i.registerUIStrings("animation/animation-meta.ts",a),m=i.getLazilyComputedLocalizedString.bind(void 0,e);o.registerViewExtension({location:"drawer-view",id:"animations",title:m(a.animations),commandPrompt:m(a.showAnimations),persistence:"closeable",order:0,loadView:async()=>(await async function(){return t||(await n.Runtime.instance().loadModulePromise("animation"),t=await import("./animation.js")),t}()).AnimationTimeline.AnimationTimeline.instance()});export{a as UIStrings};

package/static/devtools/animation/animation.js

@@ -0,0 +1 @@
+import{Widget as e,UIUtils as t,Context as i,Toolbar as n,ARIAUtils as s,Tooltip as a,PopoverHelper as r,Geometry as o,ContextMenu as h}from"../ui/ui.js";import{Linkifier as l,Color as d,Revealer as _}from"../common/common.js";import{i18n as m}from"../i18n/i18n.js";import{BezierUI as c}from"../inline_editor/inline_editor.js";import{ArrayUtilities as u,StringUtilities as p}from"../platform/platform.js";import{userMetrics as f,UserMetrics as g}from"../host/host.js";import{SDKModel as b,RuntimeModel as y,ResourceTreeModel as v,ScreenCaptureModel as w,DOMModel as M}from"../sdk/sdk.js";class A extends b.SDKModel{constructor(e){super(e),this._runtimeModel=e.model(y.RuntimeModel),this._agent=e.animationAgent(),e.registerAnimationDispatcher(new R(this)),this._animationsById=new Map,this._animationGroups=new Map,this._pendingAnimations=new Set,this._playbackRate=1;e.model(v.ResourceTreeModel).addEventListener(v.Events.MainFrameNavigated,this._reset,this);const t=e.model(w.ScreenCaptureModel);t&&(this._screenshotCapture=new E(this,t))}_reset(){this._animationsById.clear(),this._animationGroups.clear(),this._pendingAnimations.clear(),this.dispatchEventToListeners(k.ModelReset)}animationCreated(e){this._pendingAnimations.add(e)}_animationCanceled(e){this._pendingAnimations.delete(e),this._flushPendingAnimationsIfNeeded()}animationStarted(e){if(!e.source||!e.source.backendNodeId)return;const t=S.parsePayload(this,e);if(!t)return;const i=t.source().keyframesRule();"WebAnimation"===t.type()&&i&&0===i.keyframes().length?this._pendingAnimations.delete(t.id()):(this._animationsById.set(t.id(),t),this._pendingAnimations.add(t.id())),this._flushPendingAnimationsIfNeeded()}_flushPendingAnimationsIfNeeded(){for(const e of this._pendingAnimations)if(!this._animationsById.get(e))return;for(;this._pendingAnimations.size;)this._matchExistingGroups(this._createGroupFromPendingAnimations())}_matchExistingGroups(e){let t=null;for(const i of this._animationGroups.values())if(i._matches(e)){t=i,i._update(e);break}return t||(this._animationGroups.set(e.id(),e),this._screenshotCapture&&this._screenshotCapture.captureScreenshots(e.finiteDuration(),e._screenshots)),this.dispatchEventToListeners(k.AnimationGroupStarted,t||e),Boolean(t)}_createGroupFromPendingAnimations(){console.assert(this._pendingAnimations.size>0);const e=this._pendingAnimations.values().next().value;this._pendingAnimations.delete(e);const t=this._animationsById.get(e);if(!t)throw new Error("Unable to locate first animation");const i=[t],n=t.startTime(),s=new Set;for(const e of this._pendingAnimations){const t=this._animationsById.get(e);t.startTime()===n?i.push(t):s.add(e)}return this._pendingAnimations=s,new x(this,e,i)}setPlaybackRate(e){this._playbackRate=e,this._agent.invoke_setPlaybackRate({playbackRate:e})}_releaseAnimations(e){this._agent.invoke_releaseAnimations({animations:e})}async suspendModel(){this._reset(),await this._agent.invoke_disable()}async resumeModel(){this._enabled&&await this._agent.invoke_enable()}async ensureEnabled(){this._enabled||(await this._agent.invoke_enable(),this._enabled=!0)}}var k;!function(e){e.AnimationGroupStarted="AnimationGroupStarted",e.ModelReset="ModelReset"}(k||(k={}));class S{constructor(e,t){this._animationModel=e,this._payload=t,this._source=new C(e,this._payload.source)}static parsePayload(e,t){return new S(e,t)}payload(){return this._payload}id(){return this._payload.id}name(){return this._payload.name}paused(){return this._payload.pausedState}playState(){return this._playState||this._payload.playState}setPlayState(e){this._playState=e}playbackRate(){return this._payload.playbackRate}startTime(){return this._payload.startTime}endTime(){return this.source().iterations?this.startTime()+this.source().delay()+this.source().duration()*this.source().iterations()+this.source().endDelay():1/0}_finiteDuration(){const e=Math.min(this.source().iterations(),3);return this.source().delay()+this.source().duration()*e}currentTime(){return this._payload.currentTime}source(){return this._source}type(){return this._payload.type}overlaps(e){if(!this.source().iterations()||!e.source().iterations())return!0;const t=this.startTime()<e.startTime()?this:e,i=t===this?e:this;return t.endTime()>=i.startTime()}setTiming(e,t){this._source.node().then((i=>{if(!i)throw new Error("Unable to find node");this._updateNodeStyle(e,t,i)})),this._source._duration=e,this._source._delay=t,this._animationModel._agent.invoke_setTiming({animationId:this.id(),duration:e,delay:t})}_updateNodeStyle(e,t,i){let n;if(this.type()===Protocol.Animation.AnimationType.CSSTransition)n="transition-";else{if(this.type()!==Protocol.Animation.AnimationType.CSSAnimation)return;n="animation-"}if(!i.id)throw new Error("Node has no id");const s=i.domModel().cssModel();s.setEffectivePropertyValueForNode(i.id,n+"duration",e+"ms"),s.setEffectivePropertyValueForNode(i.id,n+"delay",t+"ms")}async remoteObjectPromise(){const e=await this._animationModel._agent.invoke_resolveAnimation({animationId:this.id()});return e?this._animationModel._runtimeModel.createRemoteObject(e.remoteObject):null}_cssId(){return this._payload.cssId||""}}class C{constructor(e,t){this._animationModel=e,this._payload=t,t.keyframesRule&&(this._keyframesRule=new T(t.keyframesRule)),this._delay=this._payload.delay,this._duration=this._payload.duration}delay(){return this._delay}endDelay(){return this._payload.endDelay}iterationStart(){return this._payload.iterationStart}iterations(){return this.delay()||this.endDelay()||this.duration()?this._payload.iterations||1/0:0}duration(){return this._duration}direction(){return this._payload.direction}fill(){return this._payload.fill}node(){return this._deferredNode||(this._deferredNode=new M.DeferredDOMNode(this._animationModel.target(),this.backendNodeId())),this._deferredNode.resolvePromise()}deferredNode(){return new M.DeferredDOMNode(this._animationModel.target(),this.backendNodeId())}backendNodeId(){return this._payload.backendNodeId}keyframesRule(){return this._keyframesRule||null}easing(){return this._payload.easing}}class T{constructor(e){this._payload=e,this._keyframes=this._payload.keyframes.map((function(e){return new P(e)}))}_setKeyframesPayload(e){this._keyframes=e.map((function(e){return new P(e)}))}name(){return this._payload.name}keyframes(){return this._keyframes}}class P{constructor(e){this._payload=e,this._offset=this._payload.offset}offset(){return this._offset}setOffset(e){this._offset=100*e+"%"}offsetAsNumber(){return parseFloat(this._offset)/100}easing(){return this._payload.easing}}class x{constructor(e,t,i){this._animationModel=e,this._id=t,this._animations=i,this._paused=!1,this._screenshots=[],this._screenshotImages=[]}id(){return this._id}animations(){return this._animations}release(){this._animationModel._animationGroups.delete(this.id()),this._animationModel._releaseAnimations(this._animationIds())}_animationIds(){return this._animations.map((function(e){return e.id()}))}startTime(){return this._animations[0].startTime()}finiteDuration(){let e=0;for(let t=0;t<this._animations.length;++t)e=Math.max(e,this._animations[t]._finiteDuration());return e}seekTo(e){this._animationModel._agent.invoke_seekAnimations({animations:this._animationIds(),currentTime:e})}paused(){return this._paused}togglePause(e){e!==this._paused&&(this._paused=e,this._animationModel._agent.invoke_setPaused({animations:this._animationIds(),paused:e}))}currentTimePromise(){let e=null;for(const t of this._animations)(!e||t.endTime()>e.endTime())&&(e=t);if(!e)throw new Error("No longest animation found");return this._animationModel._agent.invoke_getCurrentTime({id:e.id()}).then((({currentTime:e})=>e||0))}_matches(e){function t(e){return e.type()===Protocol.Animation.AnimationType.WebAnimation?e.type()+e.id():e._cssId()}if(this._animations.length!==e._animations.length)return!1;const i=this._animations.map(t).sort(),n=e._animations.map(t).sort();for(let e=0;e<i.length;e++)if(i[e]!==n[e])return!1;return!0}_update(e){this._animationModel._releaseAnimations(this._animationIds()),this._animations=e._animations}screenshots(){for(let e=0;e<this._screenshots.length;++e){const t=new Image;t.src="data:image/jpeg;base64,"+this._screenshots[e],this._screenshotImages.push(t)}return this._screenshots=[],this._screenshotImages}}class R{constructor(e){this._animationModel=e}animationCreated({id:e}){this._animationModel.animationCreated(e)}animationCanceled({id:e}){this._animationModel._animationCanceled(e)}animationStarted({animation:e}){this._animationModel.animationStarted(e)}}class E{constructor(e,t){this._requests=[],this._screenCaptureModel=t,this._animationModel=e,this._animationModel.addEventListener(k.ModelReset,this._stopScreencast,this)}captureScreenshots(e,t){const i=Math.min(e/this._animationModel._playbackRate,3e3),n=i+window.performance.now();this._requests.push({endTime:n,screenshots:t}),(!this._endTime||n>this._endTime)&&(clearTimeout(this._stopTimer),this._stopTimer=window.setTimeout(this._stopScreencast.bind(this),i),this._endTime=n),this._capturing||(this._capturing=!0,this._screenCaptureModel.startScreencast(Protocol.Page.StartScreencastRequestFormat.Jpeg,80,void 0,300,2,this._screencastFrame.bind(this),(e=>{})))}_screencastFrame(e,t){if(!this._capturing)return;const i=window.performance.now();this._requests=this._requests.filter((function(e){return e.endTime>=i}));for(const t of this._requests)t.screenshots.push(e)}_stopScreencast(){this._capturing&&(delete this._stopTimer,delete this._endTime,this._requests=[],this._capturing=!1,this._screenCaptureModel.stopScreencast())}}b.SDKModel.register(A,b.Capability.DOM,!1);var B=Object.freeze({__proto__:null,AnimationModel:A,get Events(){return k},AnimationImpl:S,AnimationEffect:C,KeyframesRule:T,KeyframeStyle:P,AnimationGroup:x,AnimationDispatcher:R,ScreenshotCapture:E});class G extends e.VBox{constructor(e){super(!0),console.assert(e.length>0),this.registerRequiredCSS("animation/animationScreenshotPopover.css",{enableLegacyPatching:!1}),this.contentElement.classList.add("animation-screenshot-popover"),this._frames=e;for(const t of e)this.contentElement.appendChild(t),t.style.display="none";this._rafId=0,this._currentFrame=0,this._frames[0].style.display="block",this._progressBar=this.contentElement.createChild("div","animation-progress")}wasShown(){this._rafId=this.contentElement.window().requestAnimationFrame(this._changeFrame.bind(this))}willHide(){this.contentElement.window().cancelAnimationFrame(this._rafId),delete this._endDelay}_changeFrame(){if(this._rafId=this.contentElement.window().requestAnimationFrame(this._changeFrame.bind(this)),this._endDelay)return void this._endDelay--;if(this._showFrame=!this._showFrame,!this._showFrame)return;const e=this._frames.length;this._frames[this._currentFrame%e].style.display="none",this._currentFrame++,this._frames[this._currentFrame%e].style.display="block",this._currentFrame%e==e-1&&(this._endDelay=50),this._progressBar.style.width=(this._currentFrame%e+1)/e*100+"%"}}var L=Object.freeze({__proto__:null,AnimationScreenshotPopover:G});const I={selectAnEffectAboveToInspectAnd:"Select an effect above to inspect and modify.",clearAll:"Clear all",pauseAll:"Pause all",playbackRates:"Playback rates",playbackRatePlaceholder:"{PH1}%",pause:"Pause",setSpeedToS:"Set speed to {PH1}",animationPreviews:"Animation previews",listeningForAnimations:"Listening for animations...",replayTimeline:"Replay timeline",resumeAll:"Resume all",playTimeline:"Play timeline",pauseTimeline:"Pause timeline",animationPreviewS:"Animation Preview {PH1}"},D=m.registerUIStrings("animation/AnimationTimeline.ts",I),F=m.getLocalizedString.bind(void 0,D),N=new WeakMap,H=new WeakMap;let O;class K extends e.VBox{constructor(){super(!0),this.registerRequiredCSS("animation/animationTimeline.css",{enableLegacyPatching:!1}),this.element.classList.add("animations-timeline"),this._gridWrapper=this.contentElement.createChild("div","grid-overflow-wrapper"),this._grid=t.createSVGChild(this._gridWrapper,"svg","animation-timeline-grid"),this._playbackRate=1,this._allPaused=!1,this._createHeader(),this._animationsContainer=this.contentElement.createChild("div","animation-timeline-rows");this.contentElement.createChild("div","animation-timeline-rows-hint").textContent=F(I.selectAnEffectAboveToInspectAnd),this._defaultDuration=100,this._duration=this._defaultDuration,this._timelineControlsWidth=150,this._nodesMap=new Map,this._uiAnimations=[],this._groupBuffer=[],this._previewMap=new Map,this._symbol=Symbol("animationTimeline"),this._animationsMap=new Map,b.TargetManager.instance().addModelListener(M.DOMModel,M.Events.NodeRemoved,this._nodeRemoved,this),b.TargetManager.instance().observeModels(A,this),i.Context.instance().addFlavorChangeListener(M.DOMNode,this._nodeChanged,this)}static instance(){return O||(O=new K),O}wasShown(){for(const e of b.TargetManager.instance().models(A))this._addEventListeners(e)}willHide(){for(const e of b.TargetManager.instance().models(A))this._removeEventListeners(e);this._popoverHelper&&this._popoverHelper.hidePopover()}modelAdded(e){this.isShowing()&&this._addEventListeners(e)}modelRemoved(e){this._removeEventListeners(e)}_addEventListeners(e){e.ensureEnabled(),e.addEventListener(k.AnimationGroupStarted,this._animationGroupStarted,this),e.addEventListener(k.ModelReset,this._reset,this)}_removeEventListeners(e){e.removeEventListener(k.AnimationGroupStarted,this._animationGroupStarted,this),e.removeEventListener(k.ModelReset,this._reset,this)}_nodeChanged(){for(const e of this._nodesMap.values())e._nodeChanged()}_createScrubber(){return this._timelineScrubber=document.createElement("div"),this._timelineScrubber.classList.add("animation-scrubber"),this._timelineScrubber.classList.add("hidden"),this._timelineScrubberLine=this._timelineScrubber.createChild("div","animation-scrubber-line"),this._timelineScrubberLine.createChild("div","animation-scrubber-head"),this._timelineScrubber.createChild("div","animation-time-overlay"),this._timelineScrubber}_createHeader(){const e=this.contentElement.createChild("div","animation-timeline-toolbar-container"),i=new n.Toolbar("animation-timeline-toolbar",e);this._clearButton=new n.ToolbarButton(F(I.clearAll),"largeicon-clear"),this._clearButton.addEventListener(n.ToolbarButton.Events.Click,this._reset.bind(this)),i.appendToolbarItem(this._clearButton),i.appendSeparator(),this._pauseButton=new n.ToolbarToggle(F(I.pauseAll),"largeicon-pause","largeicon-resume"),this._pauseButton.addEventListener(n.ToolbarButton.Events.Click,this._togglePauseAll.bind(this)),i.appendToolbarItem(this._pauseButton);const o=e.createChild("div","animation-playback-rate-control");o.addEventListener("keydown",this._handlePlaybackRateControlKeyDown.bind(this)),s.markAsListBox(o),s.setAccessibleName(o,F(I.playbackRates)),this._playbackRateButtons=[];for(const e of U){const t=o.createChild("button","animation-playback-rate-button");t.textContent=e?F(I.playbackRatePlaceholder,{PH1:100*e}):F(I.pause),H.set(t,e),t.addEventListener("click",this._setPlaybackRate.bind(this,e)),s.markAsOption(t),a.Tooltip.install(t,F(I.setSpeedToS,{PH1:t.textContent})),t.tabIndex=-1,this._playbackRateButtons.push(t)}this._updatePlaybackControls(),this._previewContainer=this.contentElement.createChild("div","animation-timeline-buffer"),s.markAsListBox(this._previewContainer),s.setAccessibleName(this._previewContainer,F(I.animationPreviews)),this._popoverHelper=new r.PopoverHelper(this._previewContainer,this._getPopoverRequest.bind(this)),this._popoverHelper.setDisableOnClick(!0),this._popoverHelper.setTimeout(0);this.contentElement.createChild("div","animation-timeline-buffer-hint").textContent=F(I.listeningForAnimations);const h=this.contentElement.createChild("div","animation-timeline-header"),l=h.createChild("div","animation-controls");this._currentTime=l.createChild("div","animation-timeline-current-time monospace");const d=new n.Toolbar("animation-controls-toolbar",l);this._controlButton=new n.ToolbarToggle(F(I.replayTimeline),"largeicon-replay-animation"),this._controlState="replay-outline",this._controlButton.setToggled(!0),this._controlButton.addEventListener(n.ToolbarButton.Events.Click,this._controlButtonToggle.bind(this)),d.appendToolbarItem(this._controlButton);const _=h.createChild("div","animation-grid-header");return t.installDragHandle(_,this._repositionScrubber.bind(this),this._scrubberDragMove.bind(this),this._scrubberDragEnd.bind(this),"text"),this._gridWrapper.appendChild(this._createScrubber()),this._timelineScrubberLine&&t.installDragHandle(this._timelineScrubberLine,this._scrubberDragStart.bind(this),this._scrubberDragMove.bind(this),this._scrubberDragEnd.bind(this),"col-resize"),this._currentTime.textContent="",h}_handlePlaybackRateControlKeyDown(e){switch(e.key){case"ArrowLeft":case"ArrowUp":this._focusNextPlaybackRateButton(e.target,!0);break;case"ArrowRight":case"ArrowDown":this._focusNextPlaybackRateButton(e.target)}}_focusNextPlaybackRateButton(e,t){const i=e,n=this._playbackRateButtons.indexOf(i),s=t?n-1:n+1;if(s<0||s>=this._playbackRateButtons.length)return;const a=this._playbackRateButtons[s];a.tabIndex=0,a.focus(),e&&(e.tabIndex=-1)}_getPopoverRequest(e){const t=e.target;return t&&t.isDescendant(this._previewContainer)?{box:t.boxInWindow(),show:e=>{let i;for(const[e,n]of this._previewMap)n.element===t.parentElement&&(i=e);if(console.assert(void 0!==i),!i)return Promise.resolve(!1);const n=i.screenshots();if(!n.length)return Promise.resolve(!1);let s;const a=new Promise((e=>{s=e}));return n[0].complete?r(n):n[0].onload=r.bind(null,n),a;function r(t){new G(t).show(e.contentElement),s(!0)}},hide:void 0}:null}_togglePauseAll(){this._allPaused=!this._allPaused,this._pauseButton&&this._pauseButton.setToggled(this._allPaused),this._setPlaybackRate(this._playbackRate),this._pauseButton&&this._pauseButton.setTitle(this._allPaused?F(I.resumeAll):F(I.pauseAll))}_setPlaybackRate(e){this._playbackRate=e;for(const e of b.TargetManager.instance().models(A))e.setPlaybackRate(this._allPaused?0:this._playbackRate);f.actionTaken(g.Action.AnimationsPlaybackRateChanged),this._scrubberPlayer&&(this._scrubberPlayer.playbackRate=this._effectivePlaybackRate()),this._updatePlaybackControls()}_updatePlaybackControls(){for(const e of this._playbackRateButtons){const t=this._playbackRate===H.get(e);e.classList.toggle("selected",t),e.tabIndex=t?0:-1}}_controlButtonToggle(){"play-outline"===this._controlState?this._togglePause(!1):"replay-outline"===this._controlState?this._replay():this._togglePause(!0)}_updateControlButton(){this._controlButton&&(this._controlButton.setEnabled(Boolean(this._selectedGroup)),this._selectedGroup&&this._selectedGroup.paused()?(this._controlState="play-outline",this._controlButton.setToggled(!0),this._controlButton.setTitle(F(I.playTimeline)),this._controlButton.setGlyph("largeicon-play-animation")):!this._scrubberPlayer||!this._scrubberPlayer.currentTime||this._scrubberPlayer.currentTime>=this.duration()?(this._controlState="replay-outline",this._controlButton.setToggled(!0),this._controlButton.setTitle(F(I.replayTimeline)),this._controlButton.setGlyph("largeicon-replay-animation")):(this._controlState="pause-outline",this._controlButton.setToggled(!1),this._controlButton.setTitle(F(I.pauseTimeline)),this._controlButton.setGlyph("largeicon-pause-animation")))}_effectivePlaybackRate(){return this._allPaused||this._selectedGroup&&this._selectedGroup.paused()?0:this._playbackRate}_togglePause(e){if(this._scrubberPlayer&&(this._scrubberPlayer.playbackRate=this._effectivePlaybackRate()),this._selectedGroup){this._selectedGroup.togglePause(e);const t=this._previewMap.get(this._selectedGroup);t&&t.element.classList.toggle("paused",e)}this._updateControlButton()}_replay(){this._selectedGroup&&(this._selectedGroup.seekTo(0),this._animateTime(0),this._updateControlButton())}duration(){return this._duration}setDuration(e){this._duration=e,this.scheduleRedraw()}_clearTimeline(){this._uiAnimations=[],this._nodesMap.clear(),this._animationsMap.clear(),this._animationsContainer.removeChildren(),this._duration=this._defaultDuration,this._timelineScrubber.classList.add("hidden"),this._selectedGroup=null,this._scrubberPlayer&&this._scrubberPlayer.cancel(),delete this._scrubberPlayer,this._currentTime.textContent="",this._updateControlButton()}_reset(){this._clearTimeline(),this._allPaused?this._togglePauseAll():this._setPlaybackRate(this._playbackRate);for(const e of this._groupBuffer)e.release();this._groupBuffer=[],this._previewMap.clear(),this._previewContainer.removeChildren(),this._popoverHelper.hidePopover(),this._renderGrid()}_animationGroupStarted(e){this._addAnimationGroup(e.data)}_addAnimationGroup(e){const t=this._previewMap.get(e);if(t)return void(this._selectedGroup===e?this._syncScrubber():t.replay());this._groupBuffer.sort((function(e,t){return e.startTime()===t.startTime()?0:e.startTime()>t.startTime()?1:-1}));const i=[],n=this.width()/50;for(;this._groupBuffer.length>n;){const e=this._groupBuffer.splice(this._groupBuffer[0]===this._selectedGroup?1:0,1);i.push(e[0])}for(const e of i){const t=this._previewMap.get(e);t&&(t.element.remove(),this._previewMap.delete(e),e.release())}const a=new Y(e);if(this._groupBuffer.push(e),this._previewMap.set(e,a),this._previewContainer.appendChild(a.element),a.removeButton().addEventListener("click",this._removeAnimationGroup.bind(this,e)),a.element.addEventListener("click",this._selectAnimationGroup.bind(this,e)),a.element.addEventListener("keydown",this._handleAnimationGroupKeyDown.bind(this,e)),s.setAccessibleName(a.element,F(I.animationPreviewS,{PH1:this._groupBuffer.indexOf(e)+1})),s.markAsOption(a.element),1===this._previewMap.size){const e=this._previewMap.get(this._groupBuffer[0]);e&&(e.element.tabIndex=0)}}_handleAnimationGroupKeyDown(e,t){switch(t.key){case" ":case"Enter":this._selectAnimationGroup(e);break;case"Backspace":case"Delete":this._removeAnimationGroup(e,t);break;case"ArrowLeft":case"ArrowUp":this._focusNextGroup(e,t.target,!0);break;case"ArrowRight":case"ArrowDown":this._focusNextGroup(e,t.target)}}_focusNextGroup(e,t,i){const n=this._groupBuffer.indexOf(e),s=i?n-1:n+1;if(s<0||s>=this._groupBuffer.length)return;const a=this._previewMap.get(this._groupBuffer[s]);a&&(a.element.tabIndex=0,a.element.focus()),t&&(t.tabIndex=-1)}_removeAnimationGroup(e,t){const i=this._groupBuffer.indexOf(e);u.removeElement(this._groupBuffer,e);const n=this._previewMap.get(e);n&&n.element.remove(),this._previewMap.delete(e),e.release(),t.consume(!0),this._selectedGroup===e&&(this._clearTimeline(),this._renderGrid());if(0===this._groupBuffer.length)return void this._clearButton.element.focus();const s=i>=this._groupBuffer.length?this._previewMap.get(this._groupBuffer[this._groupBuffer.length-1]):this._previewMap.get(this._groupBuffer[i]);s&&(s.element.tabIndex=0,s.element.focus())}_selectAnimationGroup(e){if(this._selectedGroup===e)return this._togglePause(!1),void this._replay();this._clearTimeline(),this._selectedGroup=e,this._previewMap.forEach((function(e,t){e.element.classList.toggle("selected",this._selectedGroup===t)}),this),this.setDuration(Math.max(500,e.finiteDuration()+100));for(const t of e.animations())this._addAnimation(t);this.scheduleRedraw(),this._timelineScrubber.classList.remove("hidden"),this._togglePause(!1),this._replay()}_addAnimation(e){let t=this._nodesMap.get(e.source().backendNodeId());t||(t=new V(e.source()),this._animationsContainer.appendChild(t.element),this._nodesMap.set(e.source().backendNodeId(),t));const i=t.createNewRow(),n=new Q(e,this,i);e.source().deferredNode().resolve(function(e){n.setNode(e),e&&t&&(t.nodeResolved(e),N.set(e,t))}.bind(this)),this._uiAnimations.push(n),this._animationsMap.set(e.id(),e)}_nodeRemoved(e){const t=e.data.node,i=N.get(t);i&&i.nodeRemoved()}_renderGrid(){const e=(this.width()+10).toString(),i=((this._cachedTimelineHeight||0)+30).toString();this._gridWrapper.style.width=e+"px",this._gridWrapper.style.height=i.toString()+"px",this._grid.setAttribute("width",e),this._grid.setAttribute("height",i.toString()),this._grid.setAttribute("shape-rendering","crispEdges"),this._grid.removeChildren();let n=void 0;for(let e=0;e<this.duration();e+=250){const i=t.createSVGChild(this._grid,"rect","animation-timeline-grid-line");i.setAttribute("x",(e*this.pixelMsRatio()+10).toString()),i.setAttribute("y","23"),i.setAttribute("height","100%"),i.setAttribute("width","1")}for(let e=0;e<this.duration();e+=250){const i=e*this.pixelMsRatio();if(void 0===n||i-n>50){n=i;const s=t.createSVGChild(this._grid,"text","animation-timeline-grid-label");s.textContent=Number.millisToString(e),s.setAttribute("x",(i+10).toString()),s.setAttribute("y","16")}}}scheduleRedraw(){this._renderQueue=[];for(const e of this._uiAnimations)this._renderQueue.push(e);this._redrawing||(this._redrawing=!0,this._renderGrid(),this._animationsContainer.window().requestAnimationFrame(this._render.bind(this)))}_render(e){for(;this._renderQueue.length&&(!e||window.performance.now()-e<50);){const e=this._renderQueue.shift();e&&e.redraw()}this._renderQueue.length?this._animationsContainer.window().requestAnimationFrame(this._render.bind(this)):delete this._redrawing}onResize(){this._cachedTimelineWidth=Math.max(0,this._animationsContainer.offsetWidth-this._timelineControlsWidth)||0,this._cachedTimelineHeight=this._animationsContainer.offsetHeight,this.scheduleRedraw(),this._scrubberPlayer&&this._syncScrubber(),delete this._gridOffsetLeft}width(){return this._cachedTimelineWidth||0}_resizeWindow(e){let t=!1;const i=e.source().duration()*Math.min(2,e.source().iterations()),n=e.source().delay()+i+e.source().endDelay();return n>this._duration&&(t=!0,this._duration=n+200),t}_syncScrubber(){this._selectedGroup&&this._selectedGroup.currentTimePromise().then(this._animateTime.bind(this)).then(this._updateControlButton.bind(this))}_animateTime(e){this._scrubberPlayer&&this._scrubberPlayer.cancel(),this._scrubberPlayer=this._timelineScrubber.animate([{transform:"translateX(0px)"},{transform:"translateX("+this.width()+"px)"}],{duration:this.duration(),fill:"forwards"}),this._scrubberPlayer.playbackRate=this._effectivePlaybackRate(),this._scrubberPlayer.onfinish=this._updateControlButton.bind(this),this._scrubberPlayer.currentTime=e,this.element.window().requestAnimationFrame(this._updateScrubber.bind(this))}pixelMsRatio(){return this.width()/this.duration()||0}_updateScrubber(e){this._scrubberPlayer&&(this._currentTime.textContent=Number.millisToString(this._scrubberPlayer.currentTime||0),"pending"===this._scrubberPlayer.playState.toString()||"running"===this._scrubberPlayer.playState?this.element.window().requestAnimationFrame(this._updateScrubber.bind(this)):"finished"===this._scrubberPlayer.playState&&(this._currentTime.textContent=""))}_repositionScrubber(e){if(!this._selectedGroup)return!1;this._gridOffsetLeft||(this._gridOffsetLeft=this._grid.totalOffsetLeft()+10);const{x:t}=e,i=Math.max(0,t-this._gridOffsetLeft)/this.pixelMsRatio();return this._selectedGroup.seekTo(i),this._togglePause(!0),this._animateTime(i),this._originalScrubberTime=i,this._originalMousePosition=t,!0}_scrubberDragStart(e){if(!this._scrubberPlayer||!this._selectedGroup)return!1;this._originalScrubberTime=this._scrubberPlayer.currentTime,this._timelineScrubber.classList.remove("animation-timeline-end"),this._scrubberPlayer.pause();const{x:t}=e;return this._originalMousePosition=t,this._togglePause(!0),!0}_scrubberDragMove(e){const{x:t}=e,i=t-(this._originalMousePosition||0),n=Math.max(0,Math.min((this._originalScrubberTime||0)+i/this.pixelMsRatio(),this.duration()));this._scrubberPlayer&&(this._scrubberPlayer.currentTime=n),this._currentTime.textContent=Number.millisToString(Math.round(n)),this._selectedGroup&&this._selectedGroup.seekTo(n)}_scrubberDragEnd(e){if(this._scrubberPlayer){const e=Math.max(0,this._scrubberPlayer.currentTime||0);this._scrubberPlayer.play(),this._scrubberPlayer.currentTime=e}this._currentTime.window().requestAnimationFrame(this._updateScrubber.bind(this))}}const U=[1,.25,.1];class V{constructor(e){this.element=document.createElement("div"),this.element.classList.add("animation-node-row"),this._description=this.element.createChild("div","animation-node-description"),this._description.tabIndex=0,this._timelineElement=this.element.createChild("div","animation-node-timeline"),s.markAsApplication(this._timelineElement)}nodeResolved(e){e?(this._node=e,this._nodeChanged(),l.Linkifier.linkify(e).then((e=>this._description.appendChild(e))),e.ownerDocument||this.nodeRemoved()):t.createTextChild(this._description,"<node>")}createNewRow(){return this._timelineElement.createChild("div","animation-timeline-row")}nodeRemoved(){this.element.classList.add("animation-node-removed"),this._node=null}_nodeChanged(){let e=!1;this._node&&(e=this._node===i.Context.instance().flavor(M.DOMNode)),this.element.classList.toggle("animation-node-selected",e)}}class j{constructor(e,t){this.steps=e,this.stepAtPosition=t}static parse(e){let t=e.match(/^steps\((\d+), (start|middle)\)$/);return t?new j(parseInt(t[1],10),t[2]):(t=e.match(/^steps\((\d+)\)$/),t?new j(parseInt(t[1],10),"end"):null)}}var q=Object.freeze({__proto__:null,UIStrings:I,AnimationTimeline:K,GlobalPlaybackRates:U,NodeUI:V,StepTimingFunction:j});const z={animationEndpointSlider:"Animation Endpoint slider",animationKeyframeSlider:"Animation Keyframe slider",sSlider:"{PH1} slider"},W=m.registerUIStrings("animation/AnimationUI.ts",z),X=m.getLocalizedString.bind(void 0,W);class Q{constructor(e,i,n){this._animation=e,this._timeline=i,this._parentElement=n;const s=this._animation.source().keyframesRule();s&&(this._keyframes=s.keyframes()),this._nameElement=n.createChild("div","animation-name"),this._nameElement.textContent=this._animation.name(),this._svg=t.createSVGChild(n,"svg","animation-ui"),this._svg.setAttribute("height",$.AnimationSVGHeight.toString()),this._svg.style.marginLeft="-"+$.AnimationMargin+"px",this._svg.addEventListener("contextmenu",this._onContextMenu.bind(this)),this._activeIntervalGroup=t.createSVGChild(this._svg,"g"),t.installDragHandle(this._activeIntervalGroup,this._mouseDown.bind(this,"AnimationDrag",null),this._mouseMove.bind(this),this._mouseUp.bind(this),"-webkit-grabbing","-webkit-grab"),Q.installDragHandleKeyboard(this._activeIntervalGroup,this._keydownMove.bind(this,"AnimationDrag",null)),this._cachedElements=[],this._movementInMs=0,this._keyboardMovementRateMs=50,this._color=Q.Color(this._animation)}static Color(e){const t=Array.from(J.keys()),i=t[p.hashCode(e.name()||e.id())%t.length],n=J.get(i);if(!n)throw new Error("Unable to locate color");return n.asString(d.Format.RGB)||""}static installDragHandleKeyboard(e,t){e.addEventListener("keydown",t,!1)}animation(){return this._animation}setNode(e){this._node=e}_createLine(e,i){const n=t.createSVGChild(e,"line",i);return n.setAttribute("x1",$.AnimationMargin.toString()),n.setAttribute("y1",$.AnimationHeight.toString()),n.setAttribute("y2",$.AnimationHeight.toString()),n.style.stroke=this._color,n}_drawAnimationLine(e,t){const i=this._cachedElements[e];i.animationLine||(i.animationLine=this._createLine(t,"animation-line")),i.animationLine&&i.animationLine.setAttribute("x2",(this._duration()*this._timeline.pixelMsRatio()+$.AnimationMargin).toFixed(2))}_drawDelayLine(e){this._delayLine&&this._endDelayLine||(this._delayLine=this._createLine(e,"animation-delay-line"),this._endDelayLine=this._createLine(e,"animation-delay-line"));const t=this._animation.source().fill();this._delayLine.classList.toggle("animation-fill","backwards"===t||"both"===t);const i=$.AnimationMargin;this._delayLine.setAttribute("x1",i.toString()),this._delayLine.setAttribute("x2",(this._delay()*this._timeline.pixelMsRatio()+i).toFixed(2));const n="forwards"===t||"both"===t;this._endDelayLine.classList.toggle("animation-fill",n);const s=Math.min(this._timeline.width(),(this._delay()+this._duration()*this._animation.source().iterations())*this._timeline.pixelMsRatio());this._endDelayLine.style.transform="translateX("+s.toFixed(2)+"px)",this._endDelayLine.setAttribute("x1",i.toString()),this._endDelayLine.setAttribute("x2",n?(this._timeline.width()-s+i).toFixed(2):(this._animation.source().endDelay()*this._timeline.pixelMsRatio()+i).toFixed(2))}_drawPoint(e,i,n,a,r){if(this._cachedElements[e].keyframePoints[a])return void this._cachedElements[e].keyframePoints[a].setAttribute("cx",n.toFixed(2));const o=t.createSVGChild(i,"circle",a<=0?"animation-endpoint":"animation-keyframe-point");if(o.setAttribute("cx",n.toFixed(2)),o.setAttribute("cy",$.AnimationHeight.toString()),o.style.stroke=this._color,o.setAttribute("r",($.AnimationMargin/2).toString()),o.tabIndex=0,s.setAccessibleName(o,X(a<=0?z.animationEndpointSlider:z.animationKeyframeSlider)),a<=0&&(o.style.fill=this._color),this._cachedElements[e].keyframePoints[a]=o,!r)return;let h;h=0===a?"StartEndpointMove":-1===a?"FinishEndpointMove":"KeyframeMove",t.installDragHandle(o,this._mouseDown.bind(this,h,a),this._mouseMove.bind(this),this._mouseUp.bind(this),"ew-resize"),Q.installDragHandleKeyboard(o,this._keydownMove.bind(this,h,a))}_renderKeyframe(e,i,n,a,r,h){function l(e,i,n){const s=t.createSVGChild(e,"line");s.setAttribute("x1",i.toString()),s.setAttribute("x2",i.toString()),s.setAttribute("y1",$.AnimationMargin.toString()),s.setAttribute("y2",$.AnimationHeight.toString()),s.style.stroke=n}const d=o.CubicBezier.parse(h),_=this._cachedElements[e].keyframeRender;if(!_[i]){const e=d?t.createSVGChild(n,"path","animation-keyframe"):t.createSVGChild(n,"g","animation-keyframe-step");_[i]=e}const m=_[i];if(m.tabIndex=0,s.setAccessibleName(m,X(z.sSlider,{PH1:this._animation.name()})),m.style.transform="translateX("+a.toFixed(2)+"px)","linear"===h){m.style.fill=this._color;const e=c.Height;m.setAttribute("d",["M",0,e,"L",0,5,"L",r.toFixed(2),5,"L",r.toFixed(2),e,"Z"].join(" "))}else if(d)m.style.fill=this._color,c.BezierUI.drawVelocityChart(d,m,r);else{const e=j.parse(h);m.removeChildren();const t={start:0,middle:.5,end:1};if(e){const i=t[e.stepAtPosition];for(let t=0;t<e.steps;t++)l(m,(t+i)*r/e.steps,this._color)}}}redraw(){const e=this._timeline.width()-$.AnimationMargin;if(this._svg.setAttribute("width",(e+2*$.AnimationMargin).toFixed(2)),this._activeIntervalGroup.style.transform="translateX("+(this._delay()*this._timeline.pixelMsRatio()).toFixed(2)+"px)",this._nameElement.style.transform="translateX("+(this._delay()*this._timeline.pixelMsRatio()+$.AnimationMargin).toFixed(2)+"px)",this._nameElement.style.width=(this._duration()*this._timeline.pixelMsRatio()).toFixed(2)+"px",this._drawDelayLine(this._svg),"CSSTransition"===this._animation.type())return void this._renderTransition();this._renderIteration(this._activeIntervalGroup,0),this._tailGroup||(this._tailGroup=t.createSVGChild(this._activeIntervalGroup,"g","animation-tail-iterations"));const i=this._duration()*this._timeline.pixelMsRatio();let n;for(n=1;n<this._animation.source().iterations()&&i*(n-1)<this._timeline.width();n++)this._renderIteration(this._tailGroup,n);for(;n<this._cachedElements.length;){const e=this._cachedElements.pop();e&&e.group&&e.group.remove()}}_renderTransition(){const e=this._activeIntervalGroup;this._cachedElements[0]||(this._cachedElements[0]={animationLine:null,keyframePoints:{},keyframeRender:{},group:null}),this._drawAnimationLine(0,e),this._renderKeyframe(0,0,e,$.AnimationMargin,this._duration()*this._timeline.pixelMsRatio(),this._animation.source().easing()),this._drawPoint(0,e,$.AnimationMargin,0,!0),this._drawPoint(0,e,this._duration()*this._timeline.pixelMsRatio()+$.AnimationMargin,-1,!0)}_renderIteration(e,i){this._cachedElements[i]||(this._cachedElements[i]={animationLine:null,keyframePoints:{},keyframeRender:{},group:t.createSVGChild(e,"g")});const n=this._cachedElements[i].group;if(n){if(n.style.transform="translateX("+(i*this._duration()*this._timeline.pixelMsRatio()).toFixed(2)+"px)",this._drawAnimationLine(i,n),this._keyframes&&this._keyframes.length>1)for(let e=0;e<this._keyframes.length-1;e++){const t=this._offset(e)*this._duration()*this._timeline.pixelMsRatio()+$.AnimationMargin,s=this._duration()*(this._offset(e+1)-this._offset(e))*this._timeline.pixelMsRatio();this._renderKeyframe(i,e,n,t,s,this._keyframes[e].easing()),(e||!e&&0===i)&&this._drawPoint(i,n,t,e,0===i)}this._drawPoint(i,n,this._duration()*this._timeline.pixelMsRatio()+$.AnimationMargin,-1,0===i)}}_delay(){let e=this._animation.source().delay();return"AnimationDrag"!==this._mouseEventType&&"StartEndpointMove"!==this._mouseEventType||(e+=this._movementInMs),Math.max(0,e)}_duration(){let e=this._animation.source().duration();return"FinishEndpointMove"===this._mouseEventType?e+=this._movementInMs:"StartEndpointMove"===this._mouseEventType&&(e-=Math.max(this._movementInMs,-this._animation.source().delay())),Math.max(0,e)}_offset(e){if(!this._keyframes)throw new Error("Unable to calculate offset; keyframes do not exist");let t=this._keyframes[e].offsetAsNumber();return"KeyframeMove"===this._mouseEventType&&e===this._keyframeMoved&&(console.assert(e>0&&e<this._keyframes.length-1,"First and last keyframe cannot be moved"),t+=this._movementInMs/this._animation.source().duration(),t=Math.max(t,this._keyframes[e-1].offsetAsNumber()),t=Math.min(t,this._keyframes[e+1].offsetAsNumber())),t}_mouseDown(e,t,i){const n=i;return 2!==n.buttons&&(!this._svg.enclosingNodeOrSelfWithClass("animation-node-removed")&&(this._mouseEventType=e,this._keyframeMoved=t,this._downMouseX=n.clientX,i.consume(!0),this._node&&_.reveal(this._node),!0))}_mouseMove(e){const t=e;this._setMovementAndRedraw((t.clientX-(this._downMouseX||0))/this._timeline.pixelMsRatio())}_setMovementAndRedraw(e){this._movementInMs=e,this._delay()+this._duration()>.8*this._timeline.duration()&&this._timeline.setDuration(1.2*this._timeline.duration()),this.redraw()}_mouseUp(e){const t=e;this._movementInMs=(t.clientX-(this._downMouseX||0))/this._timeline.pixelMsRatio(),"KeyframeMove"===this._mouseEventType?this._keyframes&&null!==this._keyframeMoved&&void 0!==this._keyframeMoved&&this._keyframes[this._keyframeMoved].setOffset(this._offset(this._keyframeMoved)):this._animation.setTiming(this._duration(),this._delay()),this._movementInMs=0,this.redraw(),delete this._mouseEventType,delete this._downMouseX,delete this._keyframeMoved}_keydownMove(e,t,i){const n=i;switch(this._mouseEventType=e,this._keyframeMoved=t,n.key){case"ArrowLeft":case"ArrowUp":this._movementInMs=-this._keyboardMovementRateMs;break;case"ArrowRight":case"ArrowDown":this._movementInMs=this._keyboardMovementRateMs;break;default:return}"KeyframeMove"===this._mouseEventType?this._keyframes&&null!==this._keyframeMoved&&this._keyframes[this._keyframeMoved].setOffset(this._offset(this._keyframeMoved)):this._animation.setTiming(this._duration(),this._delay()),this._setMovementAndRedraw(0),delete this._mouseEventType,delete this._keyframeMoved,i.consume(!0)}_onContextMenu(e){this._animation.remoteObjectPromise().then((function(t){if(!t)return;const i=new h.ContextMenu(e);i.appendApplicableItems(t),i.show()})),e.consume(!0)}}const $={AnimationHeight:26,AnimationSVGHeight:50,AnimationMargin:7,EndpointsClickRegionSize:10,GridCanvasHeight:40},J=new Map([["Purple",d.Color.parse("#9C27B0")],["Light Blue",d.Color.parse("#03A9F4")],["Deep Orange",d.Color.parse("#FF5722")],["Blue",d.Color.parse("#5677FC")],["Lime",d.Color.parse("#CDDC39")],["Blue Grey",d.Color.parse("#607D8B")],["Pink",d.Color.parse("#E91E63")],["Green",d.Color.parse("#0F9D58")],["Brown",d.Color.parse("#795548")],["Cyan",d.Color.parse("#00BCD4")]]);var Z=Object.freeze({__proto__:null,UIStrings:z,AnimationUI:Q,Options:$,Colors:J});class Y{constructor(e){this._model=e,this.element=document.createElement("div"),this.element.classList.add("animation-buffer-preview"),this.element.createChild("div","animation-paused fill"),this._removeButton=this.element.createChild("div","animation-remove-button"),this._removeButton.textContent="✕",this._replayOverlayElement=this.element.createChild("div","animation-buffer-preview-animation"),this._svg=t.createSVGChild(this.element,"svg"),this._svg.setAttribute("width","100%"),this._svg.setAttribute("preserveAspectRatio","none"),this._svg.setAttribute("height","100%"),this._viewBoxHeight=32,this._svg.setAttribute("viewBox","0 0 100 "+this._viewBoxHeight),this._svg.setAttribute("shape-rendering","crispEdges"),this._render()}_groupDuration(){let e=0;for(const t of this._model.animations()){const i=t.source().delay()+t.source().duration();i>e&&(e=i)}return e}removeButton(){return this._removeButton}replay(){this._replayOverlayElement.animate([{offset:0,width:"0%",opacity:1},{offset:.9,width:"100%",opacity:1},{offset:1,width:"100%",opacity:0}],{duration:200,easing:"cubic-bezier(0, 0, 0.2, 1)"})}_render(){this._svg.removeChildren();const e=Math.min(this._model.animations().length,10),i=100/Math.max(this._groupDuration(),750);for(let n=0;n<e;n++){const s=this._model.animations()[n].source(),a=t.createSVGChild(this._svg,"line");a.setAttribute("x1",String(s.delay()*i)),a.setAttribute("x2",String((s.delay()+s.duration())*i));const r=String(Math.floor(this._viewBoxHeight/Math.max(6,e)*n+1));a.setAttribute("y1",r),a.setAttribute("y2",r),a.style.stroke=Q.Color(this._model.animations()[n])}}}var ee=Object.freeze({__proto__:null,AnimationGroupPreviewUI:Y});export{ee as AnimationGroupPreviewUI,B as AnimationModel,L as AnimationScreenshotPopover,q as AnimationTimeline,Z as AnimationUI};

package/static/devtools/animation/animation_module.js

@@ -0,0 +1 @@
+import*as RootModule from'../root/root.js';RootModule.Runtime.cachedResources.set("animation/animationScreenshotPopover.css","/*\n * Copyright (c) 2015 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\nimg {\n  max-height: 300px;\n  border-radius: 2px;\n}\n\n.animation-progress {\n  position: absolute;\n  height: 2px;\n  bottom: 0;\n  left: 0;\n  background: var(--selection-bg-color);\n}\n\n/*# sourceURL=animation/animationScreenshotPopover.css */");RootModule.Runtime.cachedResources.set("animation/animationTimeline.css","/*\n * Copyright (c) 2015 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n:host {\n  overflow: hidden;\n}\n\n.animation-node-row {\n  width: 100%;\n  display: flex;\n  border-bottom: 1px dashed var(--color-details-hairline);\n}\n\n.animation-node-description {\n  width: 150px;\n  padding-left: 8px;\n  overflow: hidden;\n  position: relative;\n  transform-style: preserve-3d;\n  border-bottom: 1px solid var(--color-details-hairline);\n  margin-bottom: -1px;\n  background-color: var(--color-background-elevation-1);\n  display: flex;\n  align-items: center;\n  flex: 0 0 150px;\n}\n\n.animation-node-description > * {\n  flex: 0 0 auto;\n}\n\n.animation-timeline-row {\n  height: 32px;\n  position: relative;\n}\n\npath.animation-keyframe {\n  fill-opacity: 0.2;\n}\n\n.animation-node-selected path.animation-keyframe,\nsvg.animation-ui g:first-child:hover path.animation-keyframe {\n  fill-opacity: 0.4;\n}\n\nline.animation-line {\n  stroke-width: 2px;\n  stroke-linecap: round;\n  fill: none;\n}\n\nline.animation-delay-line {\n  stroke-width: 2px;\n  stroke-dasharray: 6, 4;\n}\n\nline.animation-delay-line.animation-fill {\n  stroke-dasharray: none;\n}\n\ncircle.animation-keyframe-point {\n  fill: var(--color-background);\n}\n\ncircle.animation-endpoint,\ncircle.animation-keyframe-point {\n  stroke-width: 2px;\n  transition: transform 100ms cubic-bezier(0, 0, 0.2, 1);\n  transform: scale(1);\n  transform-box: fill-box;\n  transform-origin: 50% 50%;\n}\n\ncircle.animation-endpoint:active,\ncircle.animation-keyframe-point:active {\n  transform: scale(1);\n}\n\n.animation-ui circle.animation-endpoint:hover,\n.animation-ui circle.animation-keyframe-point:hover {\n  transform: scale(1.2);\n}\n\n.animation-name {\n  position: absolute;\n  top: 8px;\n  color: var(--color-text-primary);\n  text-align: center;\n  margin-left: -8px;\n  white-space: nowrap;\n}\n\n.animation-timeline-toolbar-container {\n  display: flex;\n  background-color: var(--toolbar-bg-color);\n  border-bottom: var(--divider-border);\n  flex: 0 0 auto;\n}\n\n.animation-timeline-toolbar {\n  display: inline-block;\n}\n\n.animation-timeline-header {\n  height: 28px;\n  border-bottom: 1px solid var(--color-details-hairline);\n  flex-shrink: 0;\n  display: flex;\n}\n\n.animation-timeline-header::after {\n  content: '';\n  height: calc(100% - 48px - 28px);\n  position: absolute;\n  width: 150px;\n  left: 0;\n  margin-top: 28px;\n  background-color: var(--color-background-elevation-1);\n  z-index: 0;\n  border-right: 1px solid var(--color-details-hairline);\n}\n\n.animation-controls {\n  flex: 0 0 150px;\n  position: relative;\n  display: flex;\n  justify-content: flex-end;\n  padding-right: 8px;\n}\n\n.animation-timeline-current-time {\n  flex: 0 0 auto;\n  line-height: 28px;\n  margin-right: 5px;\n}\n\n.animation-grid-header {\n  flex: 1 0 auto;\n  cursor: text;\n}\n\n.animation-timeline-buffer,\n.animation-timeline-buffer-hint {\n  height: 48px;\n  flex: 0 0 auto;\n  border-bottom: 1px solid var(--color-details-hairline);\n  display: flex;\n  padding: 0 2px;\n}\n\n.animation-timeline-buffer:empty,\n.animation-timeline-buffer-hint {\n  display: none;\n}\n\n.animation-timeline-buffer:empty ~ .animation-timeline-buffer-hint {\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  z-index: 101;\n  display: flex;\n}\n\n.animation-time-overlay {\n  background-color: var(--color-text-primary);\n  opacity: 5%;\n  position: absolute;\n  height: 100%;\n  width: 100%;\n  z-index: -1;\n}\n\n.animation-timeline-end > .animation-time-overlay {\n  visibility: hidden;\n}\n\n.animation-scrubber {\n  opacity: 100%;\n  position: absolute;\n  left: 10px;\n  height: 100%;\n  width: 100%;\n  top: 28px;\n  border-left: 1px solid var(--color-syntax-1);\n  z-index: 2;\n  cursor: col-resize;\n}\n\n.animation-scrubber-line {\n  width: 11px;\n  background: linear-gradient(to right, transparent 5px, var(--color-syntax-1) 5px, var(--color-syntax-1) 6px, transparent 6px);\n  position: absolute;\n  top: -28px;\n  height: 28px;\n  left: -6px;\n  padding: 0 5px;\n  z-index: 3;\n}\n\n.animation-scrubber-head {\n  width: 7px;\n  height: 7px;\n  transform: rotate(45deg);\n  background: var(--color-syntax-1);\n  position: absolute;\n  left: 2px;\n  top: 1px;\n  z-index: 4;\n}\n\n.grid-overflow-wrapper {\n  position: absolute;\n  left: 140px;\n  top: 76px;\n  z-index: 1;\n  overflow: hidden;\n}\n\nsvg.animation-timeline-grid {\n  position: absolute;\n  left: 0;\n  top: 0;\n  right: 0;\n  bottom: 0;\n}\n\nrect.animation-timeline-grid-line {\n  fill: var(--color-background-elevation-2);\n}\n\n.animation-timeline-row > svg.animation-ui {\n  position: absolute;\n}\n\n.animation-node-timeline {\n  flex-grow: 1;\n}\n\n.animation-node-description > div {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  max-height: 100%;\n}\n\n.animation-node-removed {\n  filter: saturate(0);\n  cursor: not-allowed;\n}\n\nsvg.animation-ui g:first-child {\n  opacity: 100%;\n}\n\nsvg.animation-ui circle:focus-visible,\nsvg.animation-ui path:focus-visible {\n  outline: 2px solid -webkit-focus-ring-color;\n}\n\n.animation-tail-iterations {\n  opacity: 50%;\n}\n\n.animation-keyframe-step line {\n  stroke-width: 2;\n  stroke-opacity: 0.3;\n}\n\ntext.animation-timeline-grid-label {\n  font-size: 10px;\n  fill: var(--color-text-secondary);\n  text-anchor: middle;\n}\n\n.animation-timeline-rows,\n.animation-timeline-rows-hint {\n  flex-grow: 1;\n  overflow-y: auto;\n  z-index: 1;\n  overflow-x: hidden;\n}\n\n.animation-timeline-rows-hint {\n  display: none;\n}\n\n.animation-timeline-buffer:not(:empty) ~ .animation-timeline-rows:empty {\n  flex-grow: 0;\n}\n\n.animation-timeline-buffer:not(:empty) ~ .animation-timeline-rows:empty ~ .animation-timeline-rows-hint {\n  font-size: 14px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 150px;\n  padding: 10px;\n}\n\n.toolbar.animation-controls-toolbar {\n  flex: 0 0 auto;\n}\n\n.animation-node-row.animation-node-selected {\n  background-color: var(--color-background-elevation-1);\n}\n\n.animation-node-selected > .animation-node-description {\n  background-color: var(--color-background-elevation-2);\n}\n\n.animation-buffer-preview {\n  height: 40px;\n  margin: 4px 2px;\n  background-color: var(--toolbar-bg-color);\n  border: 1px solid transparent;\n  border-radius: 2px;\n  flex: 1 1;\n  padding: 4px;\n  max-width: 100px;\n  animation: newGroupAnim 200ms;\n  position: relative;\n}\n\n.animation-buffer-preview-animation {\n  width: 100%;\n  height: 100%;\n  border-radius: 2px 0 0 2px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  background: var(--color-background-elevation-2);\n  opacity: 0%;\n  border-right: 1px solid var(--color-details-hairline);\n  cursor: pointer;\n}\n\n.animation-buffer-preview:focus-visible {\n  outline: -webkit-focus-ring-color auto 5px;\n}\n\n.animation-buffer-preview:not(.selected):focus-visible,\n.animation-buffer-preview:not(.selected):hover {\n  background-color: var(--color-background-elevation-2);\n}\n\n.animation-buffer-preview.selected {\n  background-color: var(--selection-bg-color);\n}\n\n.animation-paused {\n  align-items: center;\n  justify-content: center;\n  background-color: hsl(0deg 0% 70% / 50%);\n  display: none;\n}\n\n.animation-paused::before,\n.animation-paused::after {\n  content: '';\n  background: var(--color-background);\n  width: 7px;\n  height: 20px;\n  border-radius: 2px;\n  margin: 2px;\n  border: 1px solid var(--color-details-hairline);\n}\n\n.animation-buffer-preview.paused .animation-paused {\n  display: flex;\n}\n\n.animation-buffer-preview > svg > line {\n  stroke-width: 1px;\n}\n\n.animation-buffer-preview.selected > svg > line {\n  stroke: var(--color-background) !important;\n}\n\n@keyframes newGroupAnim {\n  from {\n    clip-path: polygon(0% 0%, 0% 100%, 0% 100%, 0% 0%);\n  }\n\n  to {\n    clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%);\n  }\n}\n\n.animation-playback-rate-control {\n  margin: 4px 0 4px 2px;\n  display: flex;\n  width: 120px;\n}\n\n.animation-playback-rate-button {\n  border: 1px solid var(--color-details-hairline);\n  color: var(--color-text-primary);\n  display: inline-block;\n  margin-right: -1px;\n  padding: 1px 4px;\n  background: var(--color-background);\n  flex: 1 0 auto;\n  text-align: center;\n  cursor: pointer;\n}\n\n.animation-playback-rate-button:first-child {\n  border-radius: 4px 0 0 4px;\n}\n\n.animation-playback-rate-button:last-child {\n  border-radius: 0 4px 4px 0;\n}\n\n.animation-playback-rate-button.selected {\n  color: var(--color-background);\n  background-color: var(--selection-bg-color);\n  border-color: var(--selection-bg-color);\n  z-index: 1;\n}\n\n.animation-playback-rate-button.selected:first-child {\n  color: var(--selection-bg-color);\n  background-color: var(--color-background);\n}\n\n.animation-playback-rate-button.selected:focus-visible {\n  color: var(--color-text-primary);\n}\n\n.animation-playback-rate-button.selected:first-child:focus-visible,\n.animation-playback-rate-button:focus-visible {\n  background-color: var(--focus-bg-color);\n}\n\n.animation-playback-rate-button:not(.selected):hover {\n  background: var(--color-background-elevation-2);\n}\n\n.animation-remove-button {\n  position: absolute;\n  top: -3px;\n  right: -3px;\n  background: var(--color-text-secondary);\n  border-radius: 12px;\n  height: 16px;\n  width: 16px;\n  align-items: center;\n  font-size: 10px;\n  justify-content: center;\n  box-shadow: 0 1px 4px 0 var(--color-background-highlight);\n  z-index: 100;\n  display: none;\n  cursor: pointer;\n  font-weight: 700;\n  color: var(--color-background);\n}\n\n.animation-remove-button:hover {\n  background: var(--color-text-primary);\n}\n\n.animation-buffer-preview:hover .animation-remove-button {\n  display: flex;\n}\n\n@media (forced-colors: active) {\n  .animation-playback-rate-button.selected,\n  .animation-playback-rate-button.selected:first-child,\n  .animation-playback-rate-button.selected:first-child:focus-visible,\n  .animation-playback-rate-button:focus-visible {\n    forced-color-adjust: none;\n    color: HighlightText;\n    background-color: Highlight;\n  }\n\n  .animation-node-description:focus-visible {\n    background-color: var(--color-background);\n    forced-color-adjust: none;\n  }\n\n  .monospace {\n    forced-color-adjust: auto;\n  }\n}\n\n/*# sourceURL=animation/animationTimeline.css */");

package/static/devtools/application_test_runner/AppcacheTestRunner.js

@@ -0,0 +1,220 @@
+// Copyright 2017 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview using private properties isn't a Closure violation in tests.
+ */
+
+self.ApplicationTestRunner = self.ApplicationTestRunner || {};
+
+ApplicationTestRunner.createAndNavigateIFrame = function(url, callback) {
+  TestRunner.addSniffer(SDK.ResourceTreeModel.prototype, '_frameNavigated', frameNavigated);
+  TestRunner.evaluateInPageAnonymously('createAndNavigateIFrame(unescape(\'' + escape(url) + '\'))');
+
+  function frameNavigated(frame) {
+    callback(frame.id);
+  }
+};
+
+ApplicationTestRunner.navigateIFrame = function(frameId, url, callback) {
+  const frame = TestRunner.resourceTreeModel.frameForId(frameId);
+  TestRunner.evaluateInPageAnonymously(
+      'navigateIFrame(unescape(\'' + escape(frame.name) + '\'), unescape(\'' + escape(url) + '\'))');
+  TestRunner.addSniffer(SDK.ResourceTreeModel.prototype, '_frameNavigated', frameNavigated);
+
+  function frameNavigated(frame) {
+    callback(frame.id);
+  }
+};
+
+ApplicationTestRunner.removeIFrame = function(frameId, callback) {
+  const frame = TestRunner.resourceTreeModel.frameForId(frameId);
+  TestRunner.evaluateInPageAnonymously('removeIFrame(unescape(\'' + escape(frame.name) + '\'))');
+  TestRunner.addSniffer(SDK.ResourceTreeModel.prototype, '_frameDetached', frameDetached);
+
+  function frameDetached(frame) {
+    callback(frame.id);
+  }
+};
+
+ApplicationTestRunner.swapFrameCache = function(frameId) {
+  const frame = TestRunner.resourceTreeModel.frameForId(frameId);
+  TestRunner.evaluateInPageAnonymously('swapFrameCache(unescape(\'' + escape(frame.name) + '\'))');
+};
+
+ApplicationTestRunner.dumpApplicationCache = function() {
+  ApplicationTestRunner.dumpApplicationCacheTree();
+  ApplicationTestRunner.dumpApplicationCacheModel();
+  TestRunner.addResult('');
+};
+
+ApplicationTestRunner.dumpApplicationCacheTree = function() {
+  TestRunner.addResult('Dumping application cache tree:');
+  const applicationCacheTreeElement = UI.panels.resources._sidebar.applicationCacheListTreeElement;
+
+  if (!applicationCacheTreeElement.childCount()) {
+    TestRunner.addResult('    (empty)');
+    return;
+  }
+
+  for (let i = 0; i < applicationCacheTreeElement.childCount(); ++i) {
+    const manifestTreeElement = applicationCacheTreeElement.childAt(i);
+    TestRunner.addResult('    Manifest URL: ' + manifestTreeElement.manifestURL);
+
+    if (!manifestTreeElement.childCount()) {
+      TestRunner.addResult('    (no frames)');
+      continue;
+    }
+
+    for (let j = 0; j < manifestTreeElement.childCount(); ++j) {
+      const frameTreeElement = manifestTreeElement.childAt(j);
+      TestRunner.addResult('        Frame: ' + frameTreeElement.title);
+    }
+  }
+};
+
+ApplicationTestRunner.frameIdToString = function(frameId) {
+  if (!ApplicationTestRunner.framesByFrameId) {
+    ApplicationTestRunner.framesByFrameId = {};
+  }
+
+  let frame = TestRunner.resourceTreeModel.frameForId(frameId);
+
+  if (!frame) {
+    frame = ApplicationTestRunner.framesByFrameId[frameId];
+  }
+
+  ApplicationTestRunner.framesByFrameId[frameId] = frame;
+  return frame.name;
+};
+
+ApplicationTestRunner.applicationCacheStatusToString = function(status) {
+  const statusInformation = {};
+  statusInformation[applicationCache.UNCACHED] = 'UNCACHED';
+  statusInformation[applicationCache.IDLE] = 'IDLE';
+  statusInformation[applicationCache.CHECKING] = 'CHECKING';
+  statusInformation[applicationCache.DOWNLOADING] = 'DOWNLOADING';
+  statusInformation[applicationCache.UPDATEREADY] = 'UPDATEREADY';
+  statusInformation[applicationCache.OBSOLETE] = 'OBSOLETE';
+  return statusInformation[status] || statusInformation[applicationCache.UNCACHED];
+};
+
+ApplicationTestRunner.dumpApplicationCacheModel = function() {
+  TestRunner.addResult('Dumping application cache model:');
+  const model = UI.panels.resources._sidebar._applicationCacheModel;
+  const frameIds = [];
+
+  for (const frameId in model._manifestURLsByFrame) {
+    frameIds.push(frameId);
+  }
+
+  function compareFunc(a, b) {
+    return ApplicationTestRunner.frameIdToString(a).localeCompare(ApplicationTestRunner.frameIdToString(b));
+  }
+
+  frameIds.sort(compareFunc);
+
+  if (!frameIds.length) {
+    TestRunner.addResult('    (empty)');
+    return;
+  }
+
+  for (let i = 0; i < frameIds.length; ++i) {
+    const frameId = frameIds[i];
+    const manifestURL = model.frameManifestURL(frameId);
+    const status = model.frameManifestStatus(frameId);
+    TestRunner.addResult('    Frame: ' + ApplicationTestRunner.frameIdToString(frameId));
+    TestRunner.addResult('        manifest url: ' + manifestURL);
+    TestRunner.addResult('        status:       ' + ApplicationTestRunner.applicationCacheStatusToString(status));
+  }
+};
+
+ApplicationTestRunner.waitForFrameManifestURLAndStatus = function(frameId, manifestURL, status, callback) {
+  const frameManifestStatus = UI.panels.resources._sidebar._applicationCacheModel.frameManifestStatus(frameId);
+  const frameManifestURL = UI.panels.resources._sidebar._applicationCacheModel.frameManifestURL(frameId);
+
+  if (frameManifestStatus === status && frameManifestURL.indexOf(manifestURL) !== -1) {
+    callback();
+    return;
+  }
+
+  const handler =
+      ApplicationTestRunner.waitForFrameManifestURLAndStatus.bind(this, frameId, manifestURL, status, callback);
+  TestRunner.addSniffer(Resources.ApplicationCacheModel.prototype, '_frameManifestUpdated', handler);
+};
+
+ApplicationTestRunner.startApplicationCacheStatusesRecording = function() {
+  if (ApplicationTestRunner.applicationCacheStatusesRecords) {
+    ApplicationTestRunner.applicationCacheStatusesRecords = {};
+    return;
+  }
+
+  ApplicationTestRunner.applicationCacheStatusesRecords = {};
+
+  function addRecord(frameId, manifestURL, status) {
+    const record = {};
+    record.manifestURL = manifestURL;
+    record.status = status;
+
+    if (!ApplicationTestRunner.applicationCacheStatusesRecords[frameId]) {
+      ApplicationTestRunner.applicationCacheStatusesRecords[frameId] = [];
+    }
+
+    ApplicationTestRunner.applicationCacheStatusesRecords[frameId].push(record);
+
+    if (ApplicationTestRunner.awaitedFrameStatusEventsCount &&
+        ApplicationTestRunner.awaitedFrameStatusEventsCount[frameId]) {
+      ApplicationTestRunner.awaitedFrameStatusEventsCount[frameId].count--;
+
+      if (!ApplicationTestRunner.awaitedFrameStatusEventsCount[frameId].count) {
+        ApplicationTestRunner.awaitedFrameStatusEventsCount[frameId].callback();
+      }
+    }
+  }
+
+  TestRunner.addSniffer(Resources.ApplicationCacheModel.prototype, '_frameManifestUpdated', addRecord, true);
+};
+
+ApplicationTestRunner.ensureFrameStatusEventsReceived = function(frameId, count, callback) {
+  const records = ApplicationTestRunner.applicationCacheStatusesRecords[frameId] || [];
+  const eventsLeft = count - records.length;
+
+  if (!eventsLeft) {
+    callback();
+    return;
+  }
+
+  if (!ApplicationTestRunner.awaitedFrameStatusEventsCount) {
+    ApplicationTestRunner.awaitedFrameStatusEventsCount = {};
+  }
+
+  ApplicationTestRunner.awaitedFrameStatusEventsCount[frameId] = {count: eventsLeft, callback: callback};
+};
+
+TestRunner.deprecatedInitAsync(`
+  let framesCount = 0;
+
+  function createAndNavigateIFrame(url) {
+    let iframe = document.createElement('iframe');
+    iframe.src = url;
+    iframe.name = 'frame' + ++framesCount;
+    iframe.id = iframe.name;
+    document.body.appendChild(iframe);
+  }
+
+  function removeIFrame(name) {
+    let iframe = document.querySelector('#' + name);
+    iframe.parentElement.removeChild(iframe);
+  }
+
+  function navigateIFrame(name, url) {
+    let iframe = document.querySelector('#' + name);
+    iframe.src = url;
+  }
+
+  function swapFrameCache(name) {
+    let iframe = document.querySelector('#' + name);
+    iframe.contentWindow.applicationCache.swapCache();
+  }
+`);