@yuebai008/cli/dist/cli-server/client/front_end/panels/coverage/CoverageView.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 Platform from"../../core/platform/platform.js";import*as SDK from"../../core/sdk/sdk.js";import*as Bindings from"../../models/bindings/bindings.js";import*as UI from"../../ui/legacy/legacy.js";import{CoverageDecorationManager}from"./CoverageDecorationManager.js";import{CoverageListView}from"./CoverageListView.js";import coverageViewStyles from"./coverageView.css.js";import{CoverageModel,Events}from"./CoverageModel.js";const UIStrings={chooseCoverageGranularityPer:"Choose coverage granularity: Per function has low overhead, per block has significant overhead.",perFunction:"Per function",perBlock:"Per block",clearAll:"Clear all",export:"Export...",urlFilter:"URL filter",filterCoverageByType:"Filter coverage by type",all:"All",css:"CSS",javascript:"JavaScript",includeExtensionContentScripts:"Include extension content scripts",contentScripts:"Content scripts",clickTheReloadButtonSToReloadAnd:"Click the reload button {PH1} to reload and start capturing coverage.",clickTheRecordButtonSToStart:"Click the record button {PH1} to start capturing coverage.",bfcacheNoCapture:"Could not capture coverage info because the page was served from the back/forward cache.",activationNoCapture:"Could not capture coverage info because the page was prerendered in the background.",reloadPrompt:"Click the reload button {PH1} to reload and get coverage.",filteredSTotalS:"Filtered: {PH1}  Total: {PH2}",sOfSSUsedSoFarSUnused:"{PH1} of {PH2} ({PH3}%) used so far, {PH4} unused."},str_=i18n.i18n.registerUIStrings("panels/coverage/CoverageView.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);let coverageViewInstance,actionDelegateInstance;export class CoverageView extends UI.Widget.VBox{model;decorationManager;coverageTypeComboBox;coverageTypeComboBoxSetting;toggleRecordAction;toggleRecordButton;inlineReloadButton;startWithReloadButton;clearButton;saveButton;textFilterRegExp;filterInput;typeFilterValue;filterByTypeComboBox;showContentScriptsSetting;contentScriptsCheckbox;coverageResultsElement;landingPage;bfcacheReloadPromptPage;activationReloadPromptPage;listView;statusToolbarElement;statusMessageElement;constructor(){super(!0),this.model=null,this.decorationManager=null;const e=this.contentElement.createChild("div","coverage-toolbar-container"),t=new UI.Toolbar.Toolbar("coverage-toolbar",e);t.makeWrappable(!0),this.coverageTypeComboBox=new UI.Toolbar.ToolbarComboBox(this.onCoverageTypeComboBoxSelectionChanged.bind(this),i18nString(UIStrings.chooseCoverageGranularityPer));const o=[{label:i18nString(UIStrings.perFunction),value:6},{label:i18nString(UIStrings.perBlock),value:2}];for(const e of o)this.coverageTypeComboBox.addOption(this.coverageTypeComboBox.createOption(e.label,`${e.value}`));this.coverageTypeComboBoxSetting=Common.Settings.Settings.instance().createSetting("coverageViewCoverageType",0),this.coverageTypeComboBox.setSelectedIndex(this.coverageTypeComboBoxSetting.get()),this.coverageTypeComboBox.setEnabled(!0),t.appendToolbarItem(this.coverageTypeComboBox),this.toggleRecordAction=UI.ActionRegistry.ActionRegistry.instance().action("coverage.toggle-recording"),this.toggleRecordButton=UI.Toolbar.Toolbar.createActionButton(this.toggleRecordAction),t.appendToolbarItem(this.toggleRecordButton);const i=SDK.TargetManager.TargetManager.instance().primaryPageTarget(),a=i&&i.model(SDK.ResourceTreeModel.ResourceTreeModel);if(this.inlineReloadButton=null,a){const e=UI.ActionRegistry.ActionRegistry.instance().action("coverage.start-with-reload");this.startWithReloadButton=UI.Toolbar.Toolbar.createActionButton(e),t.appendToolbarItem(this.startWithReloadButton),this.toggleRecordButton.setEnabled(!1),this.toggleRecordButton.setVisible(!1)}this.clearButton=new UI.Toolbar.ToolbarButton(i18nString(UIStrings.clearAll),"clear"),this.clearButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click,this.clear.bind(this)),t.appendToolbarItem(this.clearButton),t.appendSeparator(),this.saveButton=new UI.Toolbar.ToolbarButton(i18nString(UIStrings.export),"download"),this.saveButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click,(e=>{this.exportReport()})),t.appendToolbarItem(this.saveButton),this.saveButton.setEnabled(!1),this.textFilterRegExp=null,t.appendSeparator(),this.filterInput=new UI.Toolbar.ToolbarInput(i18nString(UIStrings.urlFilter),"",.4,1),this.filterInput.setEnabled(!1),this.filterInput.addEventListener(UI.Toolbar.ToolbarInput.Event.TextChanged,this.onFilterChanged,this),t.appendToolbarItem(this.filterInput),t.appendSeparator(),this.typeFilterValue=null,this.filterByTypeComboBox=new UI.Toolbar.ToolbarComboBox(this.onFilterByTypeChanged.bind(this),i18nString(UIStrings.filterCoverageByType));const s=[{label:i18nString(UIStrings.all),value:""},{label:i18nString(UIStrings.css),value:1},{label:i18nString(UIStrings.javascript),value:6}];for(const e of s)this.filterByTypeComboBox.addOption(this.filterByTypeComboBox.createOption(e.label,`${e.value}`));this.filterByTypeComboBox.setSelectedIndex(0),this.filterByTypeComboBox.setEnabled(!1),t.appendToolbarItem(this.filterByTypeComboBox),t.appendSeparator(),this.showContentScriptsSetting=Common.Settings.Settings.instance().createSetting("showContentScripts",!1),this.showContentScriptsSetting.addChangeListener(this.onFilterChanged,this),this.contentScriptsCheckbox=new UI.Toolbar.ToolbarSettingCheckbox(this.showContentScriptsSetting,i18nString(UIStrings.includeExtensionContentScripts),i18nString(UIStrings.contentScripts)),this.contentScriptsCheckbox.setEnabled(!1),t.appendToolbarItem(this.contentScriptsCheckbox),this.coverageResultsElement=this.contentElement.createChild("div","coverage-results"),this.landingPage=this.buildLandingPage(),this.bfcacheReloadPromptPage=this.buildReloadPromptPage(i18nString(UIStrings.bfcacheNoCapture),"bfcache-page"),this.activationReloadPromptPage=this.buildReloadPromptPage(i18nString(UIStrings.activationNoCapture),"prerender-page"),this.listView=new CoverageListView(this.isVisible.bind(this,!1)),this.statusToolbarElement=this.contentElement.createChild("div","coverage-toolbar-summary"),this.statusMessageElement=this.statusToolbarElement.createChild("div","coverage-message"),this.landingPage.show(this.coverageResultsElement)}static instance(){return coverageViewInstance||(coverageViewInstance=new CoverageView),coverageViewInstance}static removeInstance(){coverageViewInstance=void 0}buildLandingPage(){const e=new UI.Widget.VBox;let t;if(this.startWithReloadButton)this.inlineReloadButton=UI.UIUtils.createInlineButton(UI.Toolbar.Toolbar.createActionButtonForId("coverage.start-with-reload")),t=i18n.i18n.getFormatLocalizedString(str_,UIStrings.clickTheReloadButtonSToReloadAnd,{PH1:this.inlineReloadButton});else{const e=UI.UIUtils.createInlineButton(UI.Toolbar.Toolbar.createActionButton(this.toggleRecordAction));t=i18n.i18n.getFormatLocalizedString(str_,UIStrings.clickTheRecordButtonSToStart,{PH1:e})}return t.classList.add("message"),e.contentElement.appendChild(t),e.element.classList.add("landing-page"),e}buildReloadPromptPage(e,t){const o=new UI.Widget.VBox,i=document.createElement("div");i.classList.add("message"),i.textContent=e,o.contentElement.appendChild(i),this.inlineReloadButton=UI.UIUtils.createInlineButton(UI.Toolbar.Toolbar.createActionButtonForId("coverage.reload"));const a=i18n.i18n.getFormatLocalizedString(str_,UIStrings.reloadPrompt,{PH1:this.inlineReloadButton});return a.classList.add("message"),o.contentElement.appendChild(a),o.element.classList.add(t),o}clear(){this.model&&this.model.reset(),this.reset()}reset(){this.decorationManager&&(this.decorationManager.dispose(),this.decorationManager=null),this.listView.reset(),this.listView.detach(),this.landingPage.show(this.coverageResultsElement),this.statusMessageElement.textContent="",this.filterInput.setEnabled(!1),this.filterByTypeComboBox.setEnabled(!1),this.contentScriptsCheckbox.setEnabled(!1),this.saveButton.setEnabled(!1)}toggleRecording(){!this.toggleRecordAction.toggled()?this.startRecording({reload:!1,jsCoveragePerBlock:this.isBlockCoverageSelected()}):this.stopRecording()}isBlockCoverageSelected(){const e=this.coverageTypeComboBox.selectedOption();return 2===Number(e?e.value:Number.NaN)}selectCoverageType(e){const t=e?1:0;this.coverageTypeComboBox.setSelectedIndex(t)}onCoverageTypeComboBoxSelectionChanged(){this.coverageTypeComboBoxSetting.set(this.coverageTypeComboBox.selectedIndex())}async ensureRecordingStarted(){this.toggleRecordAction.toggled()&&await this.stopRecording(),await this.startRecording({reload:!1,jsCoveragePerBlock:!1})}async startRecording(e){let t,o;this.startWithReloadButton&&this.startWithReloadButton.element.hasFocus()||this.inlineReloadButton&&this.inlineReloadButton.hasFocus()?o=!0:this.hasFocus()&&(t=!0),this.reset();const i=SDK.TargetManager.TargetManager.instance().primaryPageTarget();if(!i)return;const{reload:a,jsCoveragePerBlock:s}={reload:!1,jsCoveragePerBlock:!1,...e};if(this.model&&!a||(this.model=i.model(CoverageModel)),!this.model)return;Host.userMetrics.actionTaken(Host.UserMetrics.Action.CoverageStarted),s&&Host.userMetrics.actionTaken(Host.UserMetrics.Action.CoverageStartedPerBlock);if(!await this.model.start(Boolean(s)))return;this.selectCoverageType(Boolean(s)),this.model.addEventListener(Events.CoverageUpdated,this.onCoverageDataReceived,this);const n=i.model(SDK.ResourceTreeModel.ResourceTreeModel);SDK.TargetManager.TargetManager.instance().addModelListener(SDK.ResourceTreeModel.ResourceTreeModel,SDK.ResourceTreeModel.Events.PrimaryPageChanged,this.onPrimaryPageChanged,this),this.decorationManager=new CoverageDecorationManager(this.model),this.toggleRecordAction.setToggled(!0),this.clearButton.setEnabled(!1),this.startWithReloadButton&&(this.startWithReloadButton.setEnabled(!1),this.startWithReloadButton.setVisible(!1),this.toggleRecordButton.setEnabled(!0),this.toggleRecordButton.setVisible(!0),o&&this.toggleRecordButton.focus()),this.coverageTypeComboBox.setEnabled(!1),this.filterInput.setEnabled(!0),this.filterByTypeComboBox.setEnabled(!0),this.contentScriptsCheckbox.setEnabled(!0),this.landingPage.isShowing()&&this.landingPage.detach(),this.listView.show(this.coverageResultsElement),t&&!o&&this.listView.focus(),a&&n?n.reloadPage():this.model.startPolling()}onCoverageDataReceived(e){const t=e.data;this.updateViews(t)}async stopRecording(){SDK.TargetManager.TargetManager.instance().removeModelListener(SDK.ResourceTreeModel.ResourceTreeModel,SDK.ResourceTreeModel.Events.PrimaryPageChanged,this.onPrimaryPageChanged,this),this.hasFocus()&&this.listView.focus(),this.model&&(await this.model.stop(),this.model.removeEventListener(Events.CoverageUpdated,this.onCoverageDataReceived,this)),this.toggleRecordAction.setToggled(!1),this.coverageTypeComboBox.setEnabled(!0),this.startWithReloadButton&&(this.startWithReloadButton.setEnabled(!0),this.startWithReloadButton.setVisible(!0),this.toggleRecordButton.setEnabled(!1),this.toggleRecordButton.setVisible(!1)),this.clearButton.setEnabled(!0)}processBacklog(){this.model&&this.model.processJSBacklog()}async onPrimaryPageChanged(e){const t=e.data.frame,o=t.resourceTreeModel().target().model(CoverageModel);if(o){if(this.model!==o){this.model&&(await this.model.stop(),this.model.removeEventListener(Events.CoverageUpdated,this.onCoverageDataReceived,this)),this.model=o;if(!await this.model.start(this.isBlockCoverageSelected()))return;this.model.addEventListener(Events.CoverageUpdated,this.onCoverageDataReceived,this),this.decorationManager=new CoverageDecorationManager(this.model)}this.bfcacheReloadPromptPage.isShowing()&&(this.bfcacheReloadPromptPage.detach(),this.listView.show(this.coverageResultsElement)),this.activationReloadPromptPage.isShowing()&&(this.activationReloadPromptPage.detach(),this.listView.show(this.coverageResultsElement)),t.backForwardCacheDetails.restoredFromCache&&(this.listView.detach(),this.bfcacheReloadPromptPage.show(this.coverageResultsElement)),"Activation"===e.data.type&&(this.listView.detach(),this.activationReloadPromptPage.show(this.coverageResultsElement)),this.model.reset(),this.decorationManager&&this.decorationManager.reset(),this.listView.reset(),this.model.startPolling()}}updateViews(e){this.updateStats(),this.listView.update(this.model&&this.model.entries()||[]),this.saveButton.setEnabled(null!==this.model&&this.model.entries().length>0),this.decorationManager&&this.decorationManager.update(e)}updateStats(){const e={total:0,unused:0},t={total:0,unused:0};let o=!1;if(this.model)for(const i of this.model.entries())e.total+=i.size(),e.unused+=i.unusedSize(),this.isVisible(!1,i)?(t.total+=i.size(),t.unused+=i.unusedSize()):o=!0;function i({total:e,unused:t}){const o=e-t,i=e?Math.round(100*o/e):0;return i18nString(UIStrings.sOfSSUsedSoFarSUnused,{PH1:Platform.NumberUtilities.bytesToString(o),PH2:Platform.NumberUtilities.bytesToString(e),PH3:i,PH4:Platform.NumberUtilities.bytesToString(t)})}this.statusMessageElement.textContent=o?i18nString(UIStrings.filteredSTotalS,{PH1:i(t),PH2:i(e)}):i(e)}onFilterChanged(){if(!this.listView)return;const e=this.filterInput.value();this.textFilterRegExp=e?Platform.StringUtilities.createPlainTextSearchRegex(e,"i"):null,this.listView.updateFilterAndHighlight(this.textFilterRegExp),this.updateStats()}onFilterByTypeChanged(){if(!this.listView)return;Host.userMetrics.actionTaken(Host.UserMetrics.Action.CoverageReportFiltered);const e=this.filterByTypeComboBox.selectedOption(),t=e&&e.value;this.typeFilterValue=parseInt(t||"",10)||null,this.listView.updateFilterAndHighlight(this.textFilterRegExp),this.updateStats()}isVisible(e,t){const o=t.url();return!o.startsWith(CoverageView.EXTENSION_BINDINGS_URL_PREFIX)&&(!(t.isContentScript()&&!this.showContentScriptsSetting.get())&&(!(this.typeFilterValue&&!(t.type()&this.typeFilterValue))&&(e||!this.textFilterRegExp||this.textFilterRegExp.test(o))))}async exportReport(){const e=new Bindings.FileUtils.FileOutputStream,t=`Coverage-${Platform.DateUtilities.toISO8601Compact(new Date)}.json`;await e.open(t)&&this.model&&await this.model.exportReport(e)}selectCoverageItemByUrl(e){this.listView.selectByUrl(e)}static EXTENSION_BINDINGS_URL_PREFIX="extensions::";wasShown(){super.wasShown(),this.registerCSSFiles([coverageViewStyles])}}export class ActionDelegate{handleAction(e,t){const o="coverage";return UI.ViewManager.ViewManager.instance().showView(o,!1,!0).then((()=>{const e=UI.ViewManager.ViewManager.instance().view(o);return e&&e.widget()})).then((e=>this.innerHandleAction(e,t))),!0}static instance(e={forceNew:null}){const{forceNew:t}=e;return actionDelegateInstance&&!t||(actionDelegateInstance=new ActionDelegate),actionDelegateInstance}innerHandleAction(e,t){let o=null,i=null;switch(t){case"coverage.toggle-recording":e.toggleRecording();break;case"coverage.start-with-reload":e.startRecording({reload:!0,jsCoveragePerBlock:e.isBlockCoverageSelected()});break;case"coverage.reload":o=SDK.TargetManager.TargetManager.instance().primaryPageTarget(),o&&(i=o.model(SDK.ResourceTreeModel.ResourceTreeModel),i&&i.reloadPage());break;default:console.assert(!1,`Unknown action: ${t}`)}}}