@yuebai008/cli/dist/cli-server/client/front_end/panels/coverage/CoverageListView.js

Command line interface for rapid qg-minigame development

import*as Common from"../../core/common/common.js";import*as i18n from"../../core/i18n/i18n.js";import*as Platform from"../../core/platform/platform.js";import*as TextUtils from"../../models/text_utils/text_utils.js";import*as Workspace from"../../models/workspace/workspace.js";import*as DataGrid from"../../ui/legacy/components/data_grid/data_grid.js";import*as UI from"../../ui/legacy/legacy.js";import coverageListViewStyles from"./coverageListView.css.js";const UIStrings={css:"CSS",jsPerFunction:"JS (per function)",jsPerBlock:"JS (per block)",url:"URL",type:"Type",totalBytes:"Total Bytes",unusedBytes:"Unused Bytes",usageVisualization:"Usage Visualization",codeCoverage:"Code Coverage",jsCoverageWithPerFunction:"JS coverage with per function granularity: Once a function was executed, the whole function is marked as covered.",jsCoverageWithPerBlock:"JS coverage with per block granularity: Once a block of JavaScript was executed, that block is marked as covered.",sBytes:"{n, plural, =1 {# byte} other {# bytes}}",sBytesS:"{n, plural, =1 {# byte, {percentage}} other {# bytes, {percentage}}}",sBytesSBelongToFunctionsThatHave:"{PH1} bytes ({PH2}) belong to functions that have not (yet) been executed.",sBytesSBelongToBlocksOf:"{PH1} bytes ({PH2}) belong to blocks of JavaScript that have not (yet) been executed.",sBytesSBelongToFunctionsThatHaveExecuted:"{PH1} bytes ({PH2}) belong to functions that have executed at least once.",sBytesSBelongToBlocksOfJavascript:"{PH1} bytes ({PH2}) belong to blocks of JavaScript that have executed at least once.",sOfFileUnusedSOfFileUsed:"{PH1} % of file unused, {PH2} % of file used"},str_=i18n.i18n.registerUIStrings("panels/coverage/CoverageListView.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);export function coverageTypeToString(e){const t=[];return 1&e&&t.push(i18nString(UIStrings.css)),4&e?t.push(i18nString(UIStrings.jsPerFunction)):2&e&&t.push(i18nString(UIStrings.jsPerBlock)),t.join("+")}export class CoverageListView extends UI.Widget.VBox{nodeForCoverageInfo;isVisibleFilter;highlightRegExp;dataGrid;constructor(e){super(!0),this.nodeForCoverageInfo=new Map,this.isVisibleFilter=e,this.highlightRegExp=null;const t=[{id:"url",title:i18nString(UIStrings.url),width:"250px",weight:3,fixedWidth:!1,sortable:!0},{id:"type",title:i18nString(UIStrings.type),width:"45px",weight:1,fixedWidth:!0,sortable:!0},{id:"size",title:i18nString(UIStrings.totalBytes),width:"60px",fixedWidth:!0,sortable:!0,align:DataGrid.DataGrid.Align.Right,weight:1},{id:"unusedSize",title:i18nString(UIStrings.unusedBytes),width:"100px",fixedWidth:!0,sortable:!0,align:DataGrid.DataGrid.Align.Right,sort:DataGrid.DataGrid.Order.Descending,weight:1},{id:"bars",title:i18nString(UIStrings.usageVisualization),width:"250px",fixedWidth:!1,sortable:!0,weight:1}];this.dataGrid=new DataGrid.SortableDataGrid.SortableDataGrid({displayName:i18nString(UIStrings.codeCoverage),columns:t,editCallback:void 0,refreshCallback:void 0,deleteCallback:void 0}),this.dataGrid.setResizeMethod(DataGrid.DataGrid.ResizeMethod.Last),this.dataGrid.element.classList.add("flex-auto"),this.dataGrid.element.addEventListener("keydown",this.onKeyDown.bind(this),!1),this.dataGrid.addEventListener(DataGrid.DataGrid.Events.OpenedNode,this.onOpenedNode,this),this.dataGrid.addEventListener(DataGrid.DataGrid.Events.SortingChanged,this.sortingChanged,this);const i=this.dataGrid.asWidget();i.show(this.contentElement),this.setDefaultFocusedChild(i)}update(e){let t=!1;const i=e.reduce(((e,t)=>Math.max(e,t.size())),0),s=this.dataGrid.rootNode();for(const o of e){let e=this.nodeForCoverageInfo.get(o);e?this.isVisibleFilter(e.coverageInfo)&&(t=e.refreshIfNeeded(i)||t):(e=new GridNode(o,i),this.nodeForCoverageInfo.set(o,e),this.isVisibleFilter(e.coverageInfo)&&(s.appendChild(e),t=!0))}t&&this.sortingChanged()}reset(){this.nodeForCoverageInfo.clear(),this.dataGrid.rootNode().removeChildren()}updateFilterAndHighlight(e){this.highlightRegExp=e;let t=!1;for(const e of this.nodeForCoverageInfo.values()){const i=this.isVisibleFilter(e.coverageInfo),s=Boolean(e.parent);i&&e.setHighlight(this.highlightRegExp),i!==s&&(t=!0,i?this.dataGrid.rootNode().appendChild(e):e.remove())}t&&this.sortingChanged()}selectByUrl(e){for(const[t,i]of this.nodeForCoverageInfo.entries())if(t.url()===e){i.revealAndSelect();break}}onOpenedNode(){this.revealSourceForSelectedNode()}onKeyDown(e){"Enter"===e.key&&(e.consume(!0),this.revealSourceForSelectedNode())}async revealSourceForSelectedNode(){const e=this.dataGrid.selectedNode;if(!e)return;const t=e.coverageInfo,i=Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(t.url());i&&this.dataGrid.selectedNode===e&&Common.Revealer.reveal(i)}sortingChanged(){const e=this.dataGrid.sortColumnId();if(!e)return;const t=GridNode.sortFunctionForColumn(e);t&&this.dataGrid.sortNodes(t,!this.dataGrid.isSortOrderAscending())}wasShown(){super.wasShown(),this.registerCSSFiles([coverageListViewStyles])}}let percentageFormatter=null;function getPercentageFormatter(){return percentageFormatter||(percentageFormatter=new Intl.NumberFormat(i18n.DevToolsLocale.DevToolsLocale.instance().locale,{style:"percent",maximumFractionDigits:1})),percentageFormatter}export class GridNode extends DataGrid.SortableDataGrid.SortableDataGridNode{coverageInfo;lastUsedSize;url;maxSize;highlightRegExp;constructor(e,t){super(),this.coverageInfo=e,this.url=e.url(),this.maxSize=t,this.highlightRegExp=null}setHighlight(e){this.highlightRegExp!==e&&(this.highlightRegExp=e,this.refresh())}refreshIfNeeded(e){return(this.lastUsedSize!==this.coverageInfo.usedSize()||e!==this.maxSize)&&(this.lastUsedSize=this.coverageInfo.usedSize(),this.maxSize=e,this.refresh(),!0)}createCell(e){const t=this.createTD(e);switch(e){case"url":{UI.Tooltip.Tooltip.install(t,this.url);const i=t.createChild("div","url-outer"),s=i.createChild("div","url-prefix"),o=i.createChild("div","url-suffix"),r=/^(.*)(\/[^/]*)$/.exec(this.url);s.textContent=r?r[1]:this.url,o.textContent=r?r[2]:"",this.highlightRegExp&&this.highlight(i,this.url),this.setCellAccessibleName(this.url,t,e);break}case"type":t.textContent=coverageTypeToString(this.coverageInfo.type()),4&this.coverageInfo.type()?UI.Tooltip.Tooltip.install(t,i18nString(UIStrings.jsCoverageWithPerFunction)):2&this.coverageInfo.type()&&UI.Tooltip.Tooltip.install(t,i18nString(UIStrings.jsCoverageWithPerBlock));break;case"size":{t.createChild("span").textContent=Platform.NumberUtilities.withThousandsSeparator(this.coverageInfo.size()||0);const i=i18nString(UIStrings.sBytes,{n:this.coverageInfo.size()||0});this.setCellAccessibleName(i,t,e);break}case"unusedSize":{const i=this.coverageInfo.unusedSize()||0,s=t.createChild("span"),o=t.createChild("span","percent-value");s.textContent=Platform.NumberUtilities.withThousandsSeparator(i);const r=getPercentageFormatter().format(this.coverageInfo.unusedPercentage());o.textContent=r;const n=i18nString(UIStrings.sBytesS,{n:i,percentage:r});this.setCellAccessibleName(n,t,e);break}case"bars":{const i=t.createChild("div","bar-container"),s=getPercentageFormatter().format(this.coverageInfo.unusedPercentage()),o=getPercentageFormatter().format(this.coverageInfo.usedPercentage());if(this.coverageInfo.unusedSize()>0){const e=i.createChild("div","bar bar-unused-size");e.style.width=(this.coverageInfo.unusedSize()/this.maxSize*100||0)+"%",4&this.coverageInfo.type()?UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.sBytesSBelongToFunctionsThatHave,{PH1:this.coverageInfo.unusedSize(),PH2:s})):2&this.coverageInfo.type()&&UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.sBytesSBelongToBlocksOf,{PH1:this.coverageInfo.unusedSize(),PH2:s}))}if(this.coverageInfo.usedSize()>0){const e=i.createChild("div","bar bar-used-size");e.style.width=(this.coverageInfo.usedSize()/this.maxSize*100||0)+"%",4&this.coverageInfo.type()?UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.sBytesSBelongToFunctionsThatHaveExecuted,{PH1:this.coverageInfo.usedSize(),PH2:o})):2&this.coverageInfo.type()&&UI.Tooltip.Tooltip.install(e,i18nString(UIStrings.sBytesSBelongToBlocksOfJavascript,{PH1:this.coverageInfo.usedSize(),PH2:o}))}this.setCellAccessibleName(i18nString(UIStrings.sOfFileUnusedSOfFileUsed,{PH1:s,PH2:o}),t,e)}}return t}highlight(e,t){if(!this.highlightRegExp)return;const i=this.highlightRegExp.exec(t);if(!i||!i.length)return;const s=new TextUtils.TextRange.SourceRange(i.index,i[0].length);UI.UIUtils.highlightRangesWithStyleClass(e,[s],"filter-highlight")}static sortFunctionForColumn(e){const t=(e,t)=>e.url.localeCompare(t.url);switch(e){case"url":return t;case"type":return(e,i)=>{const s=coverageTypeToString(e.coverageInfo.type()),o=coverageTypeToString(i.coverageInfo.type());return s.localeCompare(o)||t(e,i)};case"size":return(e,i)=>e.coverageInfo.size()-i.coverageInfo.size()||t(e,i);case"bars":case"unusedSize":return(e,i)=>e.coverageInfo.unusedSize()-i.coverageInfo.unusedSize()||t(e,i);default:return console.assert(!1,"Unknown sort field: "+e),null}}}