@yuebai008/cli/dist/cli-server/client/front_end/panels/issues/IssueView.js

Command line interface for rapid qg-minigame development

import*as Common from"../../core/common/common.js";import*as Host from"../../core/host/host.js";import*as i18n from"../../core/i18n/i18n.js";import*as IssuesManager from"../../models/issues_manager/issues_manager.js";import*as IconButton from"../../ui/components/icon_button/icon_button.js";import*as IssueCounter from"../../ui/components/issue_counter/issue_counter.js";import*as MarkdownView from"../../ui/components/markdown_view/markdown_view.js";import*as UI from"../../ui/legacy/legacy.js";import*as Adorners from"../../ui/components/adorners/adorners.js";import*as NetworkForward from"../../panels/network/forward/forward.js";import*as Components from"./components/components.js";import*as Root from"../../core/root/root.js";import{AffectedDirectivesView}from"./AffectedDirectivesView.js";import{AffectedBlockedByResponseView}from"./AffectedBlockedByResponseView.js";import{AffectedCookiesView,AffectedRawCookieLinesView}from"./AffectedCookiesView.js";import{AffectedDocumentsInQuirksModeView}from"./AffectedDocumentsInQuirksModeView.js";import{AffectedElementsView}from"./AffectedElementsView.js";import{AffectedElementsWithLowContrastView}from"./AffectedElementsWithLowContrastView.js";import{AffectedHeavyAdView}from"./AffectedHeavyAdView.js";import{AffectedResourcesView,extractShortPath}from"./AffectedResourcesView.js";import{AffectedSharedArrayBufferIssueDetailsView}from"./AffectedSharedArrayBufferIssueDetailsView.js";import{AffectedSourcesView}from"./AffectedSourcesView.js";import{AffectedTrackingSitesView}from"./AffectedTrackingSitesView.js";import{CorsIssueDetailsView}from"./CorsIssueDetailsView.js";import{GenericIssueDetailsView}from"./GenericIssueDetailsView.js";import{AttributionReportingIssueDetailsView}from"./AttributionReportingIssueDetailsView.js";const UIStrings={name:"Name",blocked:"blocked",nRequests:"{n, plural, =1 {# request} other {# requests}}",nResources:"{n, plural, =1 {# resource} other {# resources}}",restrictionStatus:"Restriction Status",warned:"Warned",affectedResources:"Affected Resources",learnMoreS:"Learn more: {PH1}",automaticallyUpgraded:"automatically upgraded",hideIssuesLikeThis:"Hide issues like this",unhideIssuesLikeThis:"Unhide issues like this"},str_=i18n.i18n.registerUIStrings("panels/issues/IssueView.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);class AffectedRequestsView extends AffectedResourcesView{#e(e){let s=0;for(const t of e){const e=document.createElement("tr");e.classList.add("affected-resource-request");const i=this.issue.getCategory();let n=issueTypeToNetworkHeaderMap.get(i)||NetworkForward.UIRequestLocation.UIRequestTabs.Headers;n===NetworkForward.UIRequestLocation.UIRequestTabs.Headers&&Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES)&&(n=NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent),e.appendChild(this.createRequestCell(t,{networkTab:n,additionalOnClickAction(){Host.userMetrics.issuesPanelResourceOpened(i,"Request")}})),this.affectedResources.appendChild(e),s++}this.updateAffectedResourceCount(s)}getResourceNameWithCount(e){return i18nString(UIStrings.nRequests,{n:e})}update(){this.clear();for(const e of this.issue.getBlockedByResponseDetails())return void this.updateAffectedResourceCount(0);this.issue.getCategory()!==IssuesManager.Issue.IssueCategory.MixedContent?this.#e(this.issue.requests()):this.updateAffectedResourceCount(0)}}const issueTypeToNetworkHeaderMap=new Map([[IssuesManager.Issue.IssueCategory.Cookie,NetworkForward.UIRequestLocation.UIRequestTabs.Cookies],[IssuesManager.Issue.IssueCategory.CrossOriginEmbedderPolicy,NetworkForward.UIRequestLocation.UIRequestTabs.Headers],[IssuesManager.Issue.IssueCategory.MixedContent,NetworkForward.UIRequestLocation.UIRequestTabs.Headers]]);class AffectedMixedContentView extends AffectedResourcesView{#s(e){const s=document.createElement("tr");this.appendColumnTitle(s,i18nString(UIStrings.name)),this.appendColumnTitle(s,i18nString(UIStrings.restrictionStatus)),this.affectedResources.appendChild(s);let t=0;for(const s of e){const e=s.getDetails();this.appendAffectedMixedContent(e),t++}this.updateAffectedResourceCount(t)}getResourceNameWithCount(e){return i18nString(UIStrings.nResources,{n:e})}appendAffectedMixedContent(e){const s=document.createElement("tr");if(s.classList.add("affected-resource-mixed-content"),e.request){let t=issueTypeToNetworkHeaderMap.get(this.issue.getCategory())||NetworkForward.UIRequestLocation.UIRequestTabs.Headers;t===NetworkForward.UIRequestLocation.UIRequestTabs.Headers&&Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.HEADER_OVERRIDES)&&(t=NetworkForward.UIRequestLocation.UIRequestTabs.HeadersComponent),s.appendChild(this.createRequestCell(e.request,{networkTab:t,additionalOnClickAction(){Host.userMetrics.issuesPanelResourceOpened(IssuesManager.Issue.IssueCategory.MixedContent,"Request")}}))}else{const t=extractShortPath(e.insecureURL);this.appendIssueDetailCell(s,t,"affected-resource-mixed-content-info").title=e.insecureURL}this.appendIssueDetailCell(s,AffectedMixedContentView.translateStatus(e.resolutionStatus),"affected-resource-mixed-content-info"),this.affectedResources.appendChild(s)}static translateStatus(e){switch(e){case"MixedContentBlocked":return i18nString(UIStrings.blocked);case"MixedContentAutomaticallyUpgraded":return i18nString(UIStrings.automaticallyUpgraded);case"MixedContentWarning":return i18nString(UIStrings.warned)}}update(){this.clear(),this.#s(this.issue.getMixedContentIssues())}}export class IssueView extends UI.TreeOutline.TreeElement{#t;#i;toggleOnClick;affectedResources;#n;#o;#r=null;#d;#a;#u=!0;#c;#l=!1;constructor(e,s){super(),this.#t=e,this.#i=s,this.#a=new Common.Throttler.Throttler(250),this.toggleOnClick=!0,this.listItemElement.classList.add("issue"),this.childrenListElement.classList.add("body"),this.childrenListElement.classList.add(IssueView.getBodyCSSClass(this.#t.getKind())),this.affectedResources=this.#f(),this.#n=[new AffectedCookiesView(this,this.#t),new AffectedElementsView(this,this.#t),new AffectedRequestsView(this,this.#t),new AffectedMixedContentView(this,this.#t),new AffectedSourcesView(this,this.#t),new AffectedHeavyAdView(this,this.#t),new AffectedDirectivesView(this,this.#t),new AffectedBlockedByResponseView(this,this.#t),new AffectedSharedArrayBufferIssueDetailsView(this,this.#t),new AffectedElementsWithLowContrastView(this,this.#t),new CorsIssueDetailsView(this,this.#t),new GenericIssueDetailsView(this,this.#t),new AffectedDocumentsInQuirksModeView(this,this.#t),new AttributionReportingIssueDetailsView(this,this.#t),new AffectedRawCookieLinesView(this,this.#t),new AffectedTrackingSitesView(this,this.#t)],this.#c=new Components.HideIssuesMenu.HideIssuesMenu,this.#o=null,this.#d=!1}setIssue(e){this.#t!==e&&(this.#u=!0),this.#t=e,this.#n.forEach((s=>s.setIssue(e)))}static getBodyCSSClass(e){switch(e){case IssuesManager.Issue.IssueKind.BreakingChange:return"issue-kind-breaking-change";case IssuesManager.Issue.IssueKind.PageError:return"issue-kind-page-error";case IssuesManager.Issue.IssueKind.Improvement:return"issue-kind-improvement"}}getIssueTitle(){return this.#i.title}onattach(){this.#l?this.update():this.createContent()}createContent(){this.#h(),this.#p(),this.appendChild(this.affectedResources);const e=[];for(const s of this.#n)this.appendAffectedResource(s),s.update(),s.isEmpty()||e.push(s);this.#I(e),this.#m(),this.updateAffectedResourceVisibility(),this.#l=!0}appendAffectedResource(e){this.affectedResources.appendChild(e)}#I(e){for(let s=0;s<e.length;s++){const t=e[s].listItemElement;UI.ARIAUtils.setPositionInSet(t,s+1),UI.ARIAUtils.setSetSize(t,e.length)}}#h(){const e=document.createElement("div");e.classList.add("header"),this.#r=new IconButton.Icon.Icon,this.#r.classList.add("leading-issue-icon"),this.#o=document.createElement("span");const s=new Adorners.Adorner.Adorner;s.data={name:"countWrapper",content:this.#o},s.classList.add("aggregated-issues-count"),e.appendChild(this.#r),e.appendChild(s);const t=document.createElement("div");t.classList.add("title"),t.textContent=this.#i.title,e.appendChild(t),this.#c&&e.appendChild(this.#c),this.#w(),this.listItemElement.appendChild(e)}onexpand(){if(Host.userMetrics.issuesPanelIssueExpanded(this.#t.getCategory()),this.#u&&this.#g(),!this.#d){this.#d=!0;for(const e of this.#n)e.expandIfOneResource()}}#w(){if(this.#r){const e=this.#t.getKind();this.#r.data=IssueCounter.IssueCounter.getIssueKindIconData(e),this.#r.title=IssuesManager.Issue.getIssueKindDescription(e)}if(this.#o&&(this.#o.textContent=`${this.#t.getAggregatedIssuesCount()}`),this.listItemElement.classList.toggle("hidden-issue",this.#t.isHidden()),this.#c){const e={menuItemLabel:this.#t.isHidden()?i18nString(UIStrings.unhideIssuesLikeThis):i18nString(UIStrings.hideIssuesLikeThis),menuItemAction:()=>{const e=IssuesManager.IssuesManager.getHideIssueByCodeSetting(),s=e.get();s[this.#t.code()]=this.#t.isHidden()?"Unhidden":"Hidden",e.set(s)}};this.#c.data=e}}updateAffectedResourceVisibility(){const e=this.#n.every((e=>e.isEmpty()));this.affectedResources.hidden=e}#f(){const e=new UI.TreeOutline.TreeElement;return e.setCollapsible(!1),e.setExpandable(!0),e.expand(),e.selectable=!1,e.listItemElement.classList.add("affected-resources-label"),e.listItemElement.textContent=i18nString(UIStrings.affectedResources),e.childrenListElement.classList.add("affected-resources"),UI.ARIAUtils.setPositionInSet(e.listItemElement,2),UI.ARIAUtils.setSetSize(e.listItemElement,0===this.#i.links.length?2:3),e}#p(){const e=new UI.TreeOutline.TreeElement;e.setCollapsible(!1),e.selectable=!1;const s=new MarkdownView.MarkdownView.MarkdownView;s.data={tokens:this.#i.markdown},e.listItemElement.appendChild(s),UI.ARIAUtils.setPositionInSet(e.listItemElement,1),UI.ARIAUtils.setSetSize(e.listItemElement,0===this.#i.links.length?2:3),this.appendChild(e)}#m(){if(0===this.#i.links.length)return;const e=new UI.TreeOutline.TreeElement;e.setCollapsible(!1),e.listItemElement.classList.add("link-wrapper"),UI.ARIAUtils.setPositionInSet(e.listItemElement,3),UI.ARIAUtils.setSetSize(e.listItemElement,3);const s=e.listItemElement.createChild("ul","link-list");for(const e of this.#i.links){const t=UI.Fragment.html`<x-link class="link devtools-link" tabindex="0" href=${e.link}>${i18nString(UIStrings.learnMoreS,{PH1:e.linkTitle})}</x-link>`,i=new IconButton.Icon.Icon;i.data={iconName:"open-externally",color:"var(--icon-link)",width:"16px",height:"16px"},i.classList.add("link-icon"),t.prepend(i),t.addEventListener("x-link-invoke",(()=>{Host.userMetrics.issuesPanelResourceOpened(this.#t.getCategory(),"LearnMore")}));s.createChild("li").appendChild(t)}this.appendChild(e)}#g(){this.expanded&&(this.#n.forEach((e=>e.update())),this.updateAffectedResourceVisibility()),this.#u=!this.expanded,this.#w()}update(){this.#a.schedule((async()=>this.#g()))}clear(){this.#n.forEach((e=>e.clear()))}getIssueKind(){return this.#t.getKind()}isForHiddenIssue(){return this.#t.isHidden()}toggle(e){e||void 0===e&&!this.expanded?this.expand():this.collapse()}}