Migrate to private class members in panels/application/components/
[email protected]
Bug: 1222126
Change-Id: I29412817250baa5bf809adc43d6867a185d21ed0
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3341605
Reviewed-by: Simon Zünd <[email protected]>
Commit-Queue: Tim Van der Lippe <[email protected]>
diff --git a/front_end/panels/application/components/BackForwardCacheView.ts b/front_end/panels/application/components/BackForwardCacheView.ts
index 74cd23a..3086b19 100644
--- a/front_end/panels/application/components/BackForwardCacheView.ts
+++ b/front_end/panels/application/components/BackForwardCacheView.ts
@@ -107,30 +107,30 @@
}
export class BackForwardCacheViewWrapper extends UI.ThrottledWidget.ThrottledWidget {
- private readonly bfcacheView = new BackForwardCacheView();
+ readonly #bfcacheView = new BackForwardCacheView();
constructor() {
super(true, 1000);
- this.getMainResourceTreeModel()?.addEventListener(
+ this.#getMainResourceTreeModel()?.addEventListener(
SDK.ResourceTreeModel.Events.MainFrameNavigated, this.update, this);
- this.getMainResourceTreeModel()?.addEventListener(
+ this.#getMainResourceTreeModel()?.addEventListener(
SDK.ResourceTreeModel.Events.BackForwardCacheDetailsUpdated, this.update, this);
this.contentElement.classList.add('overflow-auto');
- this.contentElement.appendChild(this.bfcacheView);
+ this.contentElement.appendChild(this.#bfcacheView);
this.update();
}
async doUpdate(): Promise<void> {
- this.bfcacheView.data = {frame: this.getMainFrame()};
+ this.#bfcacheView.data = {frame: this.#getMainFrame()};
}
- private getMainResourceTreeModel(): SDK.ResourceTreeModel.ResourceTreeModel|null {
+ #getMainResourceTreeModel(): SDK.ResourceTreeModel.ResourceTreeModel|null {
const mainTarget = SDK.TargetManager.TargetManager.instance().mainTarget();
return mainTarget?.model(SDK.ResourceTreeModel.ResourceTreeModel) || null;
}
- private getMainFrame(): SDK.ResourceTreeModel.ResourceTreeFrame|null {
- return this.getMainResourceTreeModel()?.mainFrame || null;
+ #getMainFrame(): SDK.ResourceTreeModel.ResourceTreeFrame|null {
+ return this.#getMainResourceTreeModel()?.mainFrame || null;
}
}
@@ -152,10 +152,10 @@
set data(data: BackForwardCacheViewData) {
this.#frame = data.frame;
- this.render();
+ this.#render();
}
- private async render(): Promise<void> {
+ async #render(): Promise<void> {
await coordinator.write('BackForwardCacheView render', () => {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
@@ -163,27 +163,27 @@
<${ReportView.ReportView.Report.litTagName} .data=${
{reportTitle: i18nString(UIStrings.backForwardCacheTitle)} as ReportView.ReportView.ReportData
}>
- ${this.renderMainFrameInformation()}
+ ${this.#renderMainFrameInformation()}
</${ReportView.ReportView.Report.litTagName}>
`, this.#shadow, {host: this});
// clang-format on
});
}
- private renderBackForwardCacheTestResult(): void {
+ #renderBackForwardCacheTestResult(): void {
SDK.TargetManager.TargetManager.instance().removeModelListener(
SDK.ResourceTreeModel.ResourceTreeModel, SDK.ResourceTreeModel.Events.FrameNavigated,
- this.renderBackForwardCacheTestResult, this);
+ this.#renderBackForwardCacheTestResult, this);
this.#screenStatus = ScreenStatusType.Result;
- this.render();
+ this.#render();
}
- private async goBackOneHistoryEntry(): Promise<void> {
+ async #goBackOneHistoryEntry(): Promise<void> {
SDK.TargetManager.TargetManager.instance().removeModelListener(
SDK.ResourceTreeModel.ResourceTreeModel, SDK.ResourceTreeModel.Events.FrameNavigated,
- this.goBackOneHistoryEntry, this);
+ this.#goBackOneHistoryEntry, this);
this.#screenStatus = ScreenStatusType.Running;
- this.render();
+ this.#render();
const mainTarget = SDK.TargetManager.TargetManager.instance().mainTarget();
if (!mainTarget) {
return;
@@ -198,11 +198,11 @@
}
SDK.TargetManager.TargetManager.instance().addModelListener(
SDK.ResourceTreeModel.ResourceTreeModel, SDK.ResourceTreeModel.Events.FrameNavigated,
- this.renderBackForwardCacheTestResult, this);
+ this.#renderBackForwardCacheTestResult, this);
resourceTreeModel.navigateToHistoryEntry(historyResults.entries[historyResults.currentIndex - 1]);
}
- private async navigateAwayAndBack(): Promise<void> {
+ async #navigateAwayAndBack(): Promise<void> {
// Checking BFCache Compatibility
const mainTarget = SDK.TargetManager.TargetManager.instance().mainTarget();
@@ -215,7 +215,7 @@
// This event is removed by inside of goBackOneHistoryEntry().
SDK.TargetManager.TargetManager.instance().addModelListener(
SDK.ResourceTreeModel.ResourceTreeModel, SDK.ResourceTreeModel.Events.FrameNavigated,
- this.goBackOneHistoryEntry, this);
+ this.#goBackOneHistoryEntry, this);
// We can know whether the current page can use BFCache
// as the browser navigates to another unrelated page and goes back to the current page.
@@ -225,7 +225,7 @@
}
}
- private renderMainFrameInformation(): LitHtml.TemplateResult {
+ #renderMainFrameInformation(): LitHtml.TemplateResult {
if (!this.#frame) {
// clang-format off
return LitHtml.html`
@@ -241,7 +241,7 @@
const isDisabled = this.#screenStatus === ScreenStatusType.Running;
// clang-format off
return LitHtml.html`
- ${this.renderBackForwardCacheStatus(this.#frame.backForwardCacheDetails.restoredFromCache)}
+ ${this.#renderBackForwardCacheStatus(this.#frame.backForwardCacheDetails.restoredFromCache)}
<div class='url'>
<div class='url-key'>
${i18nString(UIStrings.url)}
@@ -255,7 +255,7 @@
.disabled=${isDisabled}
.spinner=${isDisabled}
.variant=${Buttons.Button.Variant.PRIMARY}
- @click=${this.navigateAwayAndBack}>
+ @click=${this.#navigateAwayAndBack}>
${isDisabled ? LitHtml.html`
${i18nString(UIStrings.runningTest)}`:`
${i18nString(UIStrings.runTest)}
@@ -264,7 +264,7 @@
</${ReportView.ReportView.ReportSection.litTagName}>
<${ReportView.ReportView.ReportSectionDivider.litTagName}>
</${ReportView.ReportView.ReportSectionDivider.litTagName}>
- ${this.maybeRenderExplanations(this.#frame.backForwardCacheDetails.explanations)}
+ ${this.#maybeRenderExplanations(this.#frame.backForwardCacheDetails.explanations)}
<${ReportView.ReportView.ReportSection.litTagName}>
<x-link href="https://web.dev/bfcache/" class="link">
${i18nString(UIStrings.learnMore)}
@@ -274,7 +274,7 @@
// clang-format on
}
- private renderBackForwardCacheStatus(status: boolean|undefined): LitHtml.TemplateResult {
+ #renderBackForwardCacheStatus(status: boolean|undefined): LitHtml.TemplateResult {
switch (status) {
case true:
// clang-format off
@@ -320,8 +320,8 @@
// clang-format on
}
- private maybeRenderExplanations(explanations: Protocol.Page.BackForwardCacheNotRestoredExplanation[]):
- LitHtml.TemplateResult|{} {
+ #maybeRenderExplanations(explanations: Protocol.Page.BackForwardCacheNotRestoredExplanation[]): LitHtml.TemplateResult
+ |{} {
if (explanations.length === 0) {
return LitHtml.nothing;
}
@@ -336,14 +336,14 @@
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
return LitHtml.html`
- ${this.renderExplanations(i18nString(UIStrings.pageSupportNeeded), i18nString(UIStrings.pageSupportNeededExplanation), pageSupportNeeded)}
- ${this.renderExplanations(i18nString(UIStrings.supportPending), i18nString(UIStrings.supportPendingExplanation), supportPending)}
- ${this.renderExplanations(i18nString(UIStrings.circumstantial), i18nString(UIStrings.circumstantialExplanation), circumstantial)}
+ ${this.#renderExplanations(i18nString(UIStrings.pageSupportNeeded), i18nString(UIStrings.pageSupportNeededExplanation), pageSupportNeeded)}
+ ${this.#renderExplanations(i18nString(UIStrings.supportPending), i18nString(UIStrings.supportPendingExplanation), supportPending)}
+ ${this.#renderExplanations(i18nString(UIStrings.circumstantial), i18nString(UIStrings.circumstantialExplanation), circumstantial)}
`;
// clang-format on
}
- private renderExplanations(
+ #renderExplanations(
category: Platform.UIString.LocalizedString, explainerText: Platform.UIString.LocalizedString,
explanations: Protocol.Page.BackForwardCacheNotRestoredExplanation[]): LitHtml.TemplateResult {
// Disabled until https://crbug.com/1079231 is fixed.
@@ -362,13 +362,13 @@
</${IconButton.Icon.Icon.litTagName}>
</div>
</${ReportView.ReportView.ReportSectionHeader.litTagName}>
- ${explanations.map(explanation => this.renderReason(explanation))}
+ ${explanations.map(explanation => this.#renderReason(explanation))}
` : LitHtml.nothing}
`;
// clang-format on
}
- private renderReason(explanation: Protocol.Page.BackForwardCacheNotRestoredExplanation): LitHtml.TemplateResult {
+ #renderReason(explanation: Protocol.Page.BackForwardCacheNotRestoredExplanation): LitHtml.TemplateResult {
// clang-format off
return LitHtml.html`
<${ReportView.ReportView.ReportSection.litTagName}>
diff --git a/front_end/panels/application/components/EndpointsGrid.ts b/front_end/panels/application/components/EndpointsGrid.ts
index b964552..74249ed 100644
--- a/front_end/panels/application/components/EndpointsGrid.ts
+++ b/front_end/panels/application/components/EndpointsGrid.ts
@@ -30,20 +30,20 @@
export class EndpointsGrid extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-endpoints-grid`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private endpoints: Map<string, Protocol.Network.ReportingApiEndpoint[]> = new Map();
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #endpoints: Map<string, Protocol.Network.ReportingApiEndpoint[]> = new Map();
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [reportingApiGridStyles];
- this.render();
+ this.#shadow.adoptedStyleSheets = [reportingApiGridStyles];
+ this.#render();
}
set data(data: EndpointsGridData) {
- this.endpoints = data.endpoints;
- this.render();
+ this.#endpoints = data.endpoints;
+ this.#render();
}
- private render(): void {
+ #render(): void {
const endpointsGridData: DataGrid.DataGridController.DataGridControllerData = {
columns: [
{
@@ -68,7 +68,7 @@
visible: true,
},
],
- rows: this.buildReportRows(),
+ rows: this.#buildReportRows(),
};
// Disabled until https://crbug.com/1079231 is fixed.
@@ -76,7 +76,7 @@
render(html`
<div class="reporting-container">
<div class="reporting-header">${i18n.i18n.lockedString('Endpoints')}</div>
- ${this.endpoints.size > 0 ? html`
+ ${this.#endpoints.size > 0 ? html`
<${DataGrid.DataGridController.DataGridController.litTagName} .data=${
endpointsGridData as DataGrid.DataGridController.DataGridControllerData}>
</${DataGrid.DataGridController.DataGridController.litTagName}>
@@ -86,12 +86,12 @@
</div>
`}
</div>
- `, this.shadow);
+ `, this.#shadow);
// clang-format on
}
- private buildReportRows(): DataGrid.DataGridUtils.Row[] {
- return Array.from(this.endpoints)
+ #buildReportRows(): DataGrid.DataGridUtils.Row[] {
+ return Array.from(this.#endpoints)
.map(([origin, endpointArray]) => endpointArray.map(endpoint => {
return {
cells: [
diff --git a/front_end/panels/application/components/FrameDetailsView.ts b/front_end/panels/application/components/FrameDetailsView.ts
index 96473e4..b51bc3a 100644
--- a/front_end/panels/application/components/FrameDetailsView.ts
+++ b/front_end/panels/application/components/FrameDetailsView.ts
@@ -240,19 +240,19 @@
const str_ = i18n.i18n.registerUIStrings('panels/application/components/FrameDetailsView.ts', UIStrings);
const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
export class FrameDetailsView extends UI.ThrottledWidget.ThrottledWidget {
- private readonly reportView = new FrameDetailsReportView();
- private readonly frame: SDK.ResourceTreeModel.ResourceTreeFrame;
+ readonly #reportView = new FrameDetailsReportView();
+ readonly #frame: SDK.ResourceTreeModel.ResourceTreeFrame;
constructor(frame: SDK.ResourceTreeModel.ResourceTreeFrame) {
super();
- this.frame = frame;
+ this.#frame = frame;
this.contentElement.classList.add('overflow-auto');
- this.contentElement.appendChild(this.reportView);
+ this.contentElement.appendChild(this.#reportView);
this.update();
}
async doUpdate(): Promise<void> {
- this.reportView.data = {frame: this.frame};
+ this.#reportView.data = {frame: this.#frame};
}
}
@@ -264,67 +264,67 @@
export class FrameDetailsReportView extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-frame-details-view`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private frame?: SDK.ResourceTreeModel.ResourceTreeFrame;
- private protocolMonitorExperimentEnabled = false;
- private permissionsPolicies: Promise<Protocol.Page.PermissionsPolicyFeatureState[]|null>|null = null;
- private permissionsPolicySectionData: PermissionsPolicySectionData = {policies: [], showDetails: false};
- private originTrialTreeView: OriginTrialTreeView = new OriginTrialTreeView();
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #frame?: SDK.ResourceTreeModel.ResourceTreeFrame;
+ #protocolMonitorExperimentEnabled = false;
+ #permissionsPolicies: Promise<Protocol.Page.PermissionsPolicyFeatureState[]|null>|null = null;
+ #permissionsPolicySectionData: PermissionsPolicySectionData = {policies: [], showDetails: false};
+ #originTrialTreeView: OriginTrialTreeView = new OriginTrialTreeView();
connectedCallback(): void {
- this.protocolMonitorExperimentEnabled = Root.Runtime.experiments.isEnabled('protocolMonitor');
- this.shadow.adoptedStyleSheets = [frameDetailsReportViewStyles];
+ this.#protocolMonitorExperimentEnabled = Root.Runtime.experiments.isEnabled('protocolMonitor');
+ this.#shadow.adoptedStyleSheets = [frameDetailsReportViewStyles];
}
set data(data: FrameDetailsReportViewData) {
- this.frame = data.frame;
- if (!this.permissionsPolicies && this.frame) {
- this.permissionsPolicies = this.frame.getPermissionsPolicyState();
+ this.#frame = data.frame;
+ if (!this.#permissionsPolicies && this.#frame) {
+ this.#permissionsPolicies = this.#frame.getPermissionsPolicyState();
}
- this.render();
+ this.#render();
}
- private async render(): Promise<void> {
+ async #render(): Promise<void> {
await coordinator.write('FrameDetailsView render', () => {
- if (!this.frame) {
+ if (!this.#frame) {
return;
}
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
LitHtml.render(LitHtml.html`
- <${ReportView.ReportView.Report.litTagName} .data=${{reportTitle: this.frame.displayName()} as ReportView.ReportView.ReportData}>
- ${this.renderDocumentSection()}
- ${this.renderIsolationSection()}
- ${this.renderApiAvailabilitySection()}
- ${this.renderOriginTrial()}
- ${LitHtml.Directives.until(this.permissionsPolicies?.then(policies => {
- this.permissionsPolicySectionData.policies = policies || [];
+ <${ReportView.ReportView.Report.litTagName} .data=${{reportTitle: this.#frame.displayName()} as ReportView.ReportView.ReportData}>
+ ${this.#renderDocumentSection()}
+ ${this.#renderIsolationSection()}
+ ${this.#renderApiAvailabilitySection()}
+ ${this.#renderOriginTrial()}
+ ${LitHtml.Directives.until(this.#permissionsPolicies?.then(policies => {
+ this.#permissionsPolicySectionData.policies = policies || [];
return LitHtml.html`
<${PermissionsPolicySection.litTagName}
- .data=${this.permissionsPolicySectionData as PermissionsPolicySectionData}
+ .data=${this.#permissionsPolicySectionData as PermissionsPolicySectionData}
>
</${PermissionsPolicySection.litTagName}>
`;
}), LitHtml.nothing)}
- ${this.protocolMonitorExperimentEnabled ? this.renderAdditionalInfoSection() : LitHtml.nothing}
+ ${this.#protocolMonitorExperimentEnabled ? this.#renderAdditionalInfoSection() : LitHtml.nothing}
</${ReportView.ReportView.Report.litTagName}>
- `, this.shadow, {host: this});
+ `, this.#shadow, {host: this});
// clang-format on
});
}
- private renderOriginTrial(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #renderOriginTrial(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
- this.originTrialTreeView.classList.add('span-cols');
+ this.#originTrialTreeView.classList.add('span-cols');
- const frame = this.frame;
+ const frame = this.#frame;
const refreshOriginTrials: () => void = () => {
frame.getOriginTrials().then(trials => {
- this.originTrialTreeView.data = {trials} as OriginTrialTreeViewData;
+ this.#originTrialTreeView.data = {trials} as OriginTrialTreeViewData;
});
};
refreshOriginTrials();
@@ -343,14 +343,14 @@
} as IconButton.IconButton.IconButtonData}>
</${IconButton.IconButton.IconButton.litTagName}>
</${ReportView.ReportView.ReportSectionHeader.litTagName}>
- ${this.originTrialTreeView}
+ ${this.#originTrialTreeView}
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
`;
}
- private renderDocumentSection(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #renderDocumentSection(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
@@ -361,26 +361,26 @@
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
<div class="inline-items">
- ${this.maybeRenderSourcesLinkForURL()}
- ${this.maybeRenderNetworkLinkForURL()}
- <div class="text-ellipsis" title=${this.frame.url}>${this.frame.url}</div>
+ ${this.#maybeRenderSourcesLinkForURL()}
+ ${this.#maybeRenderNetworkLinkForURL()}
+ <div class="text-ellipsis" title=${this.#frame.url}>${this.#frame.url}</div>
</div>
</${ReportView.ReportView.ReportValue.litTagName}>
- ${this.maybeRenderUnreachableURL()}
- ${this.maybeRenderOrigin()}
- ${LitHtml.Directives.until(this.renderOwnerElement(), LitHtml.nothing)}
- ${this.maybeRenderCreationStacktrace()}
- ${this.maybeRenderAdStatus()}
+ ${this.#maybeRenderUnreachableURL()}
+ ${this.#maybeRenderOrigin()}
+ ${LitHtml.Directives.until(this.#renderOwnerElement(), LitHtml.nothing)}
+ ${this.#maybeRenderCreationStacktrace()}
+ ${this.#maybeRenderAdStatus()}
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
`;
}
- private maybeRenderSourcesLinkForURL(): LitHtml.TemplateResult|{} {
- if (!this.frame || this.frame.unreachableUrl()) {
+ #maybeRenderSourcesLinkForURL(): LitHtml.TemplateResult|{} {
+ if (!this.#frame || this.#frame.unreachableUrl()) {
return LitHtml.nothing;
}
- const sourceCode = this.uiSourceCodeForFrame(this.frame);
+ const sourceCode = this.#uiSourceCodeForFrame(this.#frame);
return renderIconLink(
'sources_panel_icon',
i18nString(UIStrings.clickToRevealInSourcesPanel),
@@ -388,9 +388,9 @@
);
}
- private maybeRenderNetworkLinkForURL(): LitHtml.TemplateResult|{} {
- if (this.frame) {
- const resource = this.frame.resourceForURL(this.frame.url);
+ #maybeRenderNetworkLinkForURL(): LitHtml.TemplateResult|{} {
+ if (this.#frame) {
+ const resource = this.#frame.resourceForURL(this.#frame.url);
if (resource && resource.request) {
const request = resource.request;
return renderIconLink(
@@ -404,8 +404,7 @@
return LitHtml.nothing;
}
- private uiSourceCodeForFrame(frame: SDK.ResourceTreeModel.ResourceTreeFrame): Workspace.UISourceCode.UISourceCode
- |null {
+ #uiSourceCodeForFrame(frame: SDK.ResourceTreeModel.ResourceTreeFrame): Workspace.UISourceCode.UISourceCode|null {
for (const project of Workspace.Workspace.WorkspaceImpl.instance().projects()) {
const projectTarget = Bindings.NetworkProject.NetworkProject.getTargetForProject(project);
if (projectTarget && projectTarget === frame.resourceTreeModel().target()) {
@@ -418,8 +417,8 @@
return null;
}
- private maybeRenderUnreachableURL(): LitHtml.TemplateResult|{} {
- if (!this.frame || !this.frame.unreachableUrl()) {
+ #maybeRenderUnreachableURL(): LitHtml.TemplateResult|{} {
+ if (!this.#frame || !this.#frame.unreachableUrl()) {
return LitHtml.nothing;
}
return LitHtml.html`
@@ -427,16 +426,16 @@
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
<div class="inline-items">
- ${this.renderNetworkLinkForUnreachableURL()}
- <div class="text-ellipsis" title=${this.frame.unreachableUrl()}>${this.frame.unreachableUrl()}</div>
+ ${this.#renderNetworkLinkForUnreachableURL()}
+ <div class="text-ellipsis" title=${this.#frame.unreachableUrl()}>${this.#frame.unreachableUrl()}</div>
</div>
</${ReportView.ReportView.ReportValue.litTagName}>
`;
}
- private renderNetworkLinkForUnreachableURL(): LitHtml.TemplateResult|{} {
- if (this.frame) {
- const unreachableUrl = Common.ParsedURL.ParsedURL.fromString(this.frame.unreachableUrl());
+ #renderNetworkLinkForUnreachableURL(): LitHtml.TemplateResult|{} {
+ if (this.#frame) {
+ const unreachableUrl = Common.ParsedURL.ParsedURL.fromString(this.#frame.unreachableUrl());
if (unreachableUrl) {
return renderIconLink(
'network_panel_icon',
@@ -460,22 +459,22 @@
return LitHtml.nothing;
}
- private maybeRenderOrigin(): LitHtml.TemplateResult|{} {
- if (this.frame && this.frame.securityOrigin && this.frame.securityOrigin !== '://') {
+ #maybeRenderOrigin(): LitHtml.TemplateResult|{} {
+ if (this.#frame && this.#frame.securityOrigin && this.#frame.securityOrigin !== '://') {
return LitHtml.html`
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.origin)}</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
- <div class="text-ellipsis" title=${this.frame.securityOrigin}>${this.frame.securityOrigin}</div>
+ <div class="text-ellipsis" title=${this.#frame.securityOrigin}>${this.#frame.securityOrigin}</div>
</${ReportView.ReportView.ReportValue.litTagName}>
`;
}
return LitHtml.nothing;
}
- private async renderOwnerElement(): Promise<LitHtml.TemplateResult|{}> {
- if (this.frame) {
- const linkTargetDOMNode = await this.frame.getOwnerDOMNodeOrDocument();
+ async #renderOwnerElement(): Promise<LitHtml.TemplateResult|{}> {
+ if (this.#frame) {
+ const linkTargetDOMNode = await this.#frame.getOwnerDOMNodeOrDocument();
if (linkTargetDOMNode) {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
@@ -483,7 +482,7 @@
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.ownerElement)}</${ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName} class="without-min-width">
<button class="link" role="link" tabindex=0 title=${i18nString(UIStrings.clickToRevealInElementsPanel)}
- @mouseenter=${(): Promise<void>|undefined => this.frame?.highlight()}
+ @mouseenter=${(): Promise<void>|undefined => this.#frame?.highlight()}
@mouseleave=${(): void => SDK.OverlayModel.OverlayModel.hideDOMNodeHighlight()}
@click=${(): Promise<void> => Common.Revealer.reveal(linkTargetDOMNode)}
>
@@ -503,8 +502,8 @@
return LitHtml.nothing;
}
- private maybeRenderCreationStacktrace(): LitHtml.TemplateResult|{} {
- const creationStackTraceData = this.frame?.getCreationStackTraceData();
+ #maybeRenderCreationStacktrace(): LitHtml.TemplateResult|{} {
+ const creationStackTraceData = this.#frame?.getCreationStackTraceData();
if (creationStackTraceData && creationStackTraceData.creationStackTrace) {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
@@ -513,7 +512,7 @@
i18nString(UIStrings.creationStackTrace)}</${ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
<${StackTrace.litTagName} .data=${{
- frame: this.frame,
+ frame: this.#frame,
buildStackTraceRows: Components.JSPresentationUtils.buildStackTraceRows,
} as StackTraceData}>
</${StackTrace.litTagName}>
@@ -524,7 +523,7 @@
return LitHtml.nothing;
}
- private getAdFrameTypeStrings(type: Protocol.Page.AdFrameType.Child|Protocol.Page.AdFrameType.Root):
+ #getAdFrameTypeStrings(type: Protocol.Page.AdFrameType.Child|Protocol.Page.AdFrameType.Root):
{value: Platform.UIString.LocalizedString, description: Platform.UIString.LocalizedString} {
switch (type) {
case Protocol.Page.AdFrameType.Child:
@@ -534,8 +533,7 @@
}
}
- private getAdFrameExplanationString(explanation: Protocol.Page.AdFrameExplanation):
- Platform.UIString.LocalizedString {
+ #getAdFrameExplanationString(explanation: Protocol.Page.AdFrameExplanation): Platform.UIString.LocalizedString {
switch (explanation) {
case Protocol.Page.AdFrameExplanation.CreatedByAdScript:
return i18nString(UIStrings.createdByAdScriptExplanation);
@@ -546,18 +544,18 @@
}
}
- private maybeRenderAdStatus(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #maybeRenderAdStatus(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
- const adFrameType = this.frame.adFrameType();
+ const adFrameType = this.#frame.adFrameType();
if (adFrameType === Protocol.Page.AdFrameType.None) {
return LitHtml.nothing;
}
- const typeStrings = this.getAdFrameTypeStrings(adFrameType);
+ const typeStrings = this.#getAdFrameTypeStrings(adFrameType);
const rows = [LitHtml.html`<div title=${typeStrings.description}>${typeStrings.value}</div>`];
- for (const explanation of this.frame.adFrameStatus()?.explanations || []) {
- rows.push(LitHtml.html`<div>${this.getAdFrameExplanationString(explanation)}</div>`);
+ for (const explanation of this.#frame.adFrameStatus()?.explanations || []) {
+ rows.push(LitHtml.html`<div>${this.#getAdFrameExplanationString(explanation)}</div>`);
}
return LitHtml.html`
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.adStatus)}</${
@@ -569,8 +567,8 @@
`;
}
- private renderIsolationSection(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #renderIsolationSection(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
return LitHtml.html`
@@ -579,30 +577,30 @@
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.secureContext)}</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
- ${this.frame.isSecureContext() ? i18nString(UIStrings.yes) : i18nString(UIStrings.no)}\xA0${
- this.maybeRenderSecureContextExplanation()}
+ ${this.#frame.isSecureContext() ? i18nString(UIStrings.yes) : i18nString(UIStrings.no)}\xA0${
+ this.#maybeRenderSecureContextExplanation()}
</${ReportView.ReportView.ReportValue.litTagName}>
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.crossoriginIsolated)}</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
- ${this.frame.isCrossOriginIsolated() ? i18nString(UIStrings.yes) : i18nString(UIStrings.no)}
+ ${this.#frame.isCrossOriginIsolated() ? i18nString(UIStrings.yes) : i18nString(UIStrings.no)}
</${ReportView.ReportView.ReportValue.litTagName}>
- ${LitHtml.Directives.until(this.maybeRenderCoopCoepStatus(), LitHtml.nothing)}
+ ${LitHtml.Directives.until(this.#maybeRenderCoopCoepStatus(), LitHtml.nothing)}
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
`;
}
- private maybeRenderSecureContextExplanation(): LitHtml.TemplateResult|{} {
- const explanation = this.getSecureContextExplanation();
+ #maybeRenderSecureContextExplanation(): LitHtml.TemplateResult|{} {
+ const explanation = this.#getSecureContextExplanation();
if (explanation) {
return LitHtml.html`<span class="inline-comment">${explanation}</span>`;
}
return LitHtml.nothing;
}
- private getSecureContextExplanation(): Platform.UIString.LocalizedString|null {
- switch (this.frame?.getSecureContextType()) {
+ #getSecureContextExplanation(): Platform.UIString.LocalizedString|null {
+ switch (this.#frame?.getSecureContextType()) {
case Protocol.Page.SecureContextType.Secure:
return null;
case Protocol.Page.SecureContextType.SecureLocalhost:
@@ -615,18 +613,18 @@
return null;
}
- private async maybeRenderCoopCoepStatus(): Promise<LitHtml.TemplateResult|{}> {
- if (this.frame) {
- const model = this.frame.resourceTreeModel().target().model(SDK.NetworkManager.NetworkManager);
- const info = model && await model.getSecurityIsolationStatus(this.frame.id);
+ async #maybeRenderCoopCoepStatus(): Promise<LitHtml.TemplateResult|{}> {
+ if (this.#frame) {
+ const model = this.#frame.resourceTreeModel().target().model(SDK.NetworkManager.NetworkManager);
+ const info = model && await model.getSecurityIsolationStatus(this.#frame.id);
if (info) {
return LitHtml.html`
${
- this.maybeRenderCrossOriginStatus(
+ this.#maybeRenderCrossOriginStatus(
info.coep, i18n.i18n.lockedString('Cross-Origin Embedder Policy (COEP)'),
Protocol.Network.CrossOriginEmbedderPolicyValue.None)}
${
- this.maybeRenderCrossOriginStatus(
+ this.#maybeRenderCrossOriginStatus(
info.coop, i18n.i18n.lockedString('Cross-Origin Opener Policy (COOP)'),
Protocol.Network.CrossOriginOpenerPolicyValue.UnsafeNone)}
`;
@@ -635,7 +633,7 @@
return LitHtml.nothing;
}
- private maybeRenderCrossOriginStatus(
+ #maybeRenderCrossOriginStatus(
info: Protocol.Network.CrossOriginEmbedderPolicyStatus|Protocol.Network.CrossOriginOpenerPolicyStatus|undefined,
policyName: string,
noneValue: Protocol.Network.CrossOriginEmbedderPolicyValue|
@@ -658,8 +656,8 @@
`;
}
- private renderApiAvailabilitySection(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #renderApiAvailabilitySection(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
@@ -670,16 +668,16 @@
${i18nString(UIStrings.availabilityOfCertainApisDepends)}
<x-link href="https://web.dev/why-coop-coep/" class="link">${i18nString(UIStrings.learnMore)}</x-link>
</div>
- ${this.renderSharedArrayBufferAvailability()}
- ${this.renderMeasureMemoryAvailability()}
+ ${this.#renderSharedArrayBufferAvailability()}
+ ${this.#renderMeasureMemoryAvailability()}
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
`;
}
- private renderSharedArrayBufferAvailability(): LitHtml.TemplateResult|{} {
- if (this.frame) {
- const features = this.frame.getGatedAPIFeatures();
+ #renderSharedArrayBufferAvailability(): LitHtml.TemplateResult|{} {
+ if (this.#frame) {
+ const features = this.#frame.getGatedAPIFeatures();
if (features) {
const sabAvailable = features.includes(Protocol.Page.GatedAPIFeatures.SharedArrayBuffers);
const sabTransferAvailable =
@@ -719,7 +717,7 @@
<${ReportView.ReportView.ReportKey.litTagName}>SharedArrayBuffers</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName} title=${tooltipText}>
- ${availabilityText}\xA0${renderHint(this.frame)}
+ ${availabilityText}\xA0${renderHint(this.#frame)}
</${ReportView.ReportView.ReportValue.litTagName}>
`;
}
@@ -727,9 +725,9 @@
return LitHtml.nothing;
}
- private renderMeasureMemoryAvailability(): LitHtml.TemplateResult|{} {
- if (this.frame) {
- const measureMemoryAvailable = this.frame.isCrossOriginIsolated();
+ #renderMeasureMemoryAvailability(): LitHtml.TemplateResult|{} {
+ if (this.#frame) {
+ const measureMemoryAvailable = this.#frame.isCrossOriginIsolated();
const availabilityText =
measureMemoryAvailable ? i18nString(UIStrings.available) : i18nString(UIStrings.unavailable);
const tooltipText = measureMemoryAvailable ? i18nString(UIStrings.thePerformanceAPI) :
@@ -747,8 +745,8 @@
return LitHtml.nothing;
}
- private renderAdditionalInfoSection(): LitHtml.TemplateResult|{} {
- if (!this.frame) {
+ #renderAdditionalInfoSection(): LitHtml.TemplateResult|{} {
+ if (!this.#frame) {
return LitHtml.nothing;
}
@@ -759,7 +757,7 @@
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.frameId)}</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
- <div class="text-ellipsis" title=${this.frame.id}>${this.frame.id}</div>
+ <div class="text-ellipsis" title=${this.#frame.id}>${this.#frame.id}</div>
</${ReportView.ReportView.ReportValue.litTagName}>
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
diff --git a/front_end/panels/application/components/OriginTrialTreeView.ts b/front_end/panels/application/components/OriginTrialTreeView.ts
index c144782..af5d11a 100644
--- a/front_end/panels/application/components/OriginTrialTreeView.ts
+++ b/front_end/panels/application/components/OriginTrialTreeView.ts
@@ -71,31 +71,31 @@
export class Badge extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-origin-trial-tree-view-badge`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private adorner = new Adorners.Adorner.Adorner();
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #adorner = new Adorners.Adorner.Adorner();
set data(data: BadgeData) {
- this.render(data);
+ this.#render(data);
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [badgeStyles];
+ this.#shadow.adoptedStyleSheets = [badgeStyles];
}
- private render(data: BadgeData): void {
+ #render(data: BadgeData): void {
const adornerContent = document.createElement('span');
adornerContent.textContent = data.badgeContent;
- this.adorner.data = {
+ this.#adorner.data = {
name: 'badge',
content: adornerContent,
};
- this.adorner.classList.add(`badge-${data.style}`);
+ this.#adorner.classList.add(`badge-${data.style}`);
LitHtml.render(
LitHtml.html`
- ${this.adorner}
+ ${this.#adorner}
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
}
}
@@ -210,73 +210,73 @@
export class OriginTrialTokenRows extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-origin-trial-token-rows`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private tokenWithStatus: Protocol.Page.OriginTrialTokenWithStatus|null = null;
- private parsedTokenDetails: TokenField[] = [];
- private dateFormatter: Intl.DateTimeFormat = new Intl.DateTimeFormat(
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #tokenWithStatus: Protocol.Page.OriginTrialTokenWithStatus|null = null;
+ #parsedTokenDetails: TokenField[] = [];
+ #dateFormatter: Intl.DateTimeFormat = new Intl.DateTimeFormat(
i18n.DevToolsLocale.DevToolsLocale.instance().locale,
{dateStyle: 'long', timeStyle: 'long'},
);
set data(data: OriginTrialTokenRowsData) {
- this.tokenWithStatus = data.node.treeNodeData as Protocol.Page.OriginTrialTokenWithStatus;
- this.setTokenFields();
+ this.#tokenWithStatus = data.node.treeNodeData as Protocol.Page.OriginTrialTokenWithStatus;
+ this.#setTokenFields();
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [originTrialTokenRowsStyles];
- this.render();
+ this.#shadow.adoptedStyleSheets = [originTrialTokenRowsStyles];
+ this.#render();
}
- private renderTokenField = (fieldValue: string, hasError?: boolean): LitHtml.TemplateResult => LitHtml.html`
+ #renderTokenField = (fieldValue: string, hasError?: boolean): LitHtml.TemplateResult => LitHtml.html`
<div class=${LitHtml.Directives.ifDefined(hasError ? 'error-text' : undefined)}>
${fieldValue}
</div>`;
- private setTokenFields(): void {
- if (!this.tokenWithStatus?.parsedToken) {
+ #setTokenFields(): void {
+ if (!this.#tokenWithStatus?.parsedToken) {
return;
}
- this.parsedTokenDetails = [
+ this.#parsedTokenDetails = [
{
name: i18nString(UIStrings.origin),
- value: this.renderTokenField(
- this.tokenWithStatus.parsedToken.origin,
- this.tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.WrongOrigin),
+ value: this.#renderTokenField(
+ this.#tokenWithStatus.parsedToken.origin,
+ this.#tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.WrongOrigin),
},
{
name: i18nString(UIStrings.expiryTime),
- value: this.renderTokenField(
- this.dateFormatter.format(this.tokenWithStatus.parsedToken.expiryTime * 1000),
- this.tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.Expired),
+ value: this.#renderTokenField(
+ this.#dateFormatter.format(this.#tokenWithStatus.parsedToken.expiryTime * 1000),
+ this.#tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.Expired),
},
{
name: i18nString(UIStrings.usageRestriction),
- value: this.renderTokenField(this.tokenWithStatus.parsedToken.usageRestriction),
+ value: this.#renderTokenField(this.#tokenWithStatus.parsedToken.usageRestriction),
},
{
name: i18nString(UIStrings.isThirdParty),
- value: this.renderTokenField(this.tokenWithStatus.parsedToken.isThirdParty.toString()),
+ value: this.#renderTokenField(this.#tokenWithStatus.parsedToken.isThirdParty.toString()),
},
{
name: i18nString(UIStrings.matchSubDomains),
- value: this.renderTokenField(this.tokenWithStatus.parsedToken.matchSubDomains.toString()),
+ value: this.#renderTokenField(this.#tokenWithStatus.parsedToken.matchSubDomains.toString()),
},
];
- if (this.tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.UnknownTrial) {
- this.parsedTokenDetails = [
+ if (this.#tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.UnknownTrial) {
+ this.#parsedTokenDetails = [
{
name: i18nString(UIStrings.trialName),
- value: this.renderTokenField(this.tokenWithStatus.parsedToken.trialName),
+ value: this.#renderTokenField(this.#tokenWithStatus.parsedToken.trialName),
},
- ...this.parsedTokenDetails,
+ ...this.#parsedTokenDetails,
];
}
}
- private render(): void {
- if (!this.tokenWithStatus) {
+ #render(): void {
+ if (!this.#tokenWithStatus) {
return;
}
@@ -285,11 +285,11 @@
name: i18nString(UIStrings.status),
value: LitHtml.html`
<${Badge.litTagName} .data=${{
- badgeContent: this.tokenWithStatus.status,
- style: this.tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.Success ? 'success' : 'error',
+ badgeContent: this.#tokenWithStatus.status,
+ style: this.#tokenWithStatus.status === Protocol.Page.OriginTrialTokenStatus.Success ? 'success' : 'error',
} as BadgeData}></${Badge.litTagName}>`,
},
- ...this.parsedTokenDetails,
+ ...this.#parsedTokenDetails,
];
const tokenDetailRows = tokenDetails.map((field: TokenField): LitHtml.TemplateResult => {
@@ -305,7 +305,7 @@
${tokenDetailRows}
</div>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
}
}
@@ -317,17 +317,17 @@
export class OriginTrialTreeView extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-origin-trial-tree-view`;
- private readonly shadow = this.attachShadow({mode: 'open'});
+ readonly #shadow = this.attachShadow({mode: 'open'});
set data(data: OriginTrialTreeViewData) {
- this.render(data.trials);
+ this.#render(data.trials);
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [originTrialTreeViewStyles];
+ this.#shadow.adoptedStyleSheets = [originTrialTreeViewStyles];
}
- private render(trials: Protocol.Page.OriginTrial[]): void {
+ #render(trials: Protocol.Page.OriginTrial[]): void {
if (!trials.length) {
return;
}
@@ -340,7 +340,7 @@
} as TreeOutline.TreeOutline.TreeOutlineData<OriginTrialTreeNodeData>}>
</${TreeOutline.TreeOutline.TreeOutline.litTagName}>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
}
}
diff --git a/front_end/panels/application/components/PermissionsPolicySection.ts b/front_end/panels/application/components/PermissionsPolicySection.ts
index df43e92..3ec201f 100644
--- a/front_end/panels/application/components/PermissionsPolicySection.ts
+++ b/front_end/panels/application/components/PermissionsPolicySection.ts
@@ -84,25 +84,25 @@
export class PermissionsPolicySection extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-permissions-policy-section`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private permissionsPolicySectionData: PermissionsPolicySectionData = {policies: [], showDetails: false};
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #permissionsPolicySectionData: PermissionsPolicySectionData = {policies: [], showDetails: false};
set data(data: PermissionsPolicySectionData) {
- this.permissionsPolicySectionData = data;
- this.render();
+ this.#permissionsPolicySectionData = data;
+ this.#render();
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [permissionsPolicySectionStyles];
+ this.#shadow.adoptedStyleSheets = [permissionsPolicySectionStyles];
}
- private toggleShowPermissionsDisallowedDetails(): void {
- this.permissionsPolicySectionData.showDetails = !this.permissionsPolicySectionData.showDetails;
- this.render();
+ #toggleShowPermissionsDisallowedDetails(): void {
+ this.#permissionsPolicySectionData.showDetails = !this.#permissionsPolicySectionData.showDetails;
+ this.#render();
}
- private renderAllowed(): LitHtml.TemplateResult|{} {
- const allowed = this.permissionsPolicySectionData.policies.filter(p => p.allowed).map(p => p.feature).sort();
+ #renderAllowed(): LitHtml.TemplateResult|{} {
+ const allowed = this.#permissionsPolicySectionData.policies.filter(p => p.allowed).map(p => p.feature).sort();
if (!allowed.length) {
return LitHtml.nothing;
}
@@ -115,19 +115,19 @@
`;
}
- private async renderDisallowed(): Promise<LitHtml.TemplateResult|{}> {
- const disallowed = this.permissionsPolicySectionData.policies.filter(p => !p.allowed)
+ async #renderDisallowed(): Promise<LitHtml.TemplateResult|{}> {
+ const disallowed = this.#permissionsPolicySectionData.policies.filter(p => !p.allowed)
.sort((a, b) => a.feature.localeCompare(b.feature));
if (!disallowed.length) {
return LitHtml.nothing;
}
- if (!this.permissionsPolicySectionData.showDetails) {
+ if (!this.#permissionsPolicySectionData.showDetails) {
return LitHtml.html`
<${ReportView.ReportView.ReportKey.litTagName}>${i18nString(UIStrings.disabledFeatures)}</${
ReportView.ReportView.ReportKey.litTagName}>
<${ReportView.ReportView.ReportValue.litTagName}>
${disallowed.map(p => p.feature).join(', ')}
- <button class="link" @click=${(): void => this.toggleShowPermissionsDisallowedDetails()}>
+ <button class="link" @click=${(): void => this.#toggleShowPermissionsDisallowedDetails()}>
${i18nString(UIStrings.showDetails)}
</button>
</${ReportView.ReportView.ReportValue.litTagName}>
@@ -198,7 +198,7 @@
<${ReportView.ReportView.ReportValue.litTagName} class="policies-list">
${featureRows}
<div class="permissions-row">
- <button class="link" @click=${(): void => this.toggleShowPermissionsDisallowedDetails()}>
+ <button class="link" @click=${(): void => this.#toggleShowPermissionsDisallowedDetails()}>
${i18nString(UIStrings.hideDetails)}
</button>
</div>
@@ -206,7 +206,7 @@
`;
}
- private async render(): Promise<void> {
+ async #render(): Promise<void> {
await coordinator.write('PermissionsPolicySection render', () => {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
@@ -214,12 +214,12 @@
LitHtml.html`
<${ReportView.ReportView.ReportSectionHeader.litTagName}>${i18n.i18n.lockedString('Permissions Policy')}</${
ReportView.ReportView.ReportSectionHeader.litTagName}>
- ${this.renderAllowed()}
- ${LitHtml.Directives.until(this.renderDisallowed(), LitHtml.nothing)}
+ ${this.#renderAllowed()}
+ ${LitHtml.Directives.until(this.#renderDisallowed(), LitHtml.nothing)}
<${ReportView.ReportView.ReportSectionDivider.litTagName}></${
ReportView.ReportView.ReportSectionDivider.litTagName}>
`,
- this.shadow, {host: this},
+ this.#shadow, {host: this},
);
// clang-format on
});
diff --git a/front_end/panels/application/components/ReportsGrid.ts b/front_end/panels/application/components/ReportsGrid.ts
index eca4fe7..437d6b6 100644
--- a/front_end/panels/application/components/ReportsGrid.ts
+++ b/front_end/panels/application/components/ReportsGrid.ts
@@ -27,14 +27,14 @@
export class ReportsGridStatusHeader extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-reports-grid-status-header`;
- private readonly shadow = this.attachShadow({mode: 'open'});
+ readonly #shadow = this.attachShadow({mode: 'open'});
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [reportingApiGridStyles];
- this.render();
+ this.#shadow.adoptedStyleSheets = [reportingApiGridStyles];
+ this.#render();
}
- private render(): void {
+ #render(): void {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
render(html`
@@ -47,7 +47,7 @@
height: '16px',
} as IconButton.Icon.IconData}></${IconButton.Icon.Icon.litTagName}>
</x-link>
- `, this.shadow, {host: this});
+ `, this.#shadow, {host: this});
// clang-format on
}
}
@@ -59,22 +59,22 @@
export class ReportsGrid extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-reports-grid`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private reports: Protocol.Network.ReportingApiReport[] = [];
- private protocolMonitorExperimentEnabled = false;
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #reports: Protocol.Network.ReportingApiReport[] = [];
+ #protocolMonitorExperimentEnabled = false;
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [reportingApiGridStyles];
- this.protocolMonitorExperimentEnabled = Root.Runtime.experiments.isEnabled('protocolMonitor');
- this.render();
+ this.#shadow.adoptedStyleSheets = [reportingApiGridStyles];
+ this.#protocolMonitorExperimentEnabled = Root.Runtime.experiments.isEnabled('protocolMonitor');
+ this.#render();
}
set data(data: ReportsGridData) {
- this.reports = data.reports;
- this.render();
+ this.#reports = data.reports;
+ this.#render();
}
- private render(): void {
+ #render(): void {
const reportsGridData: DataGrid.DataGridController.DataGridControllerData = {
columns: [
{
@@ -123,10 +123,10 @@
visible: true,
},
],
- rows: this.buildReportRows(),
+ rows: this.#buildReportRows(),
};
- if (this.protocolMonitorExperimentEnabled) {
+ if (this.#protocolMonitorExperimentEnabled) {
reportsGridData.columns.unshift(
{id: 'id', title: 'ID', widthWeighting: 30, hideable: false, visible: true},
);
@@ -137,7 +137,7 @@
render(html`
<div class="reporting-container">
<div class="reporting-header">${i18n.i18n.lockedString('Reports')}</div>
- ${this.reports.length > 0 ? html`
+ ${this.#reports.length > 0 ? html`
<${DataGrid.DataGridController.DataGridController.litTagName} .data=${
reportsGridData as DataGrid.DataGridController.DataGridControllerData}>
</${DataGrid.DataGridController.DataGridController.litTagName}>
@@ -147,22 +147,22 @@
</div>
`}
</div>
- `, this.shadow, {host: this});
+ `, this.#shadow, {host: this});
// clang-format on
}
- private buildReportRows(): DataGrid.DataGridUtils.Row[] {
- return this.reports.map(report => ({
- cells: [
- {columnId: 'id', value: report.id},
- {columnId: 'url', value: report.initiatorUrl},
- {columnId: 'type', value: report.type},
- {columnId: 'status', value: report.status},
- {columnId: 'destination', value: report.destination},
- {columnId: 'timestamp', value: new Date(report.timestamp * 1000).toLocaleString()},
- {columnId: 'body', value: JSON.stringify(report.body)},
- ],
- }));
+ #buildReportRows(): DataGrid.DataGridUtils.Row[] {
+ return this.#reports.map(report => ({
+ cells: [
+ {columnId: 'id', value: report.id},
+ {columnId: 'url', value: report.initiatorUrl},
+ {columnId: 'type', value: report.type},
+ {columnId: 'status', value: report.status},
+ {columnId: 'destination', value: report.destination},
+ {columnId: 'timestamp', value: new Date(report.timestamp * 1000).toLocaleString()},
+ {columnId: 'body', value: JSON.stringify(report.body)},
+ ],
+ }));
}
}
diff --git a/front_end/panels/application/components/StackTrace.ts b/front_end/panels/application/components/StackTrace.ts
index d5f946d..f5e42ae 100644
--- a/front_end/panels/application/components/StackTrace.ts
+++ b/front_end/panels/application/components/StackTrace.ts
@@ -44,38 +44,38 @@
export class StackTraceRow extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-stack-trace-row`;
- private readonly shadow = this.attachShadow({mode: 'open'});
+ readonly #shadow = this.attachShadow({mode: 'open'});
- private stackTraceRowItem: Components.JSPresentationUtils.StackTraceRegularRow|null = null;
+ #stackTraceRowItem: Components.JSPresentationUtils.StackTraceRegularRow|null = null;
set data(data: StackTraceRowData) {
- this.stackTraceRowItem = data.stackTraceRowItem;
- this.render();
+ this.#stackTraceRowItem = data.stackTraceRowItem;
+ this.#render();
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [stackTraceRowStyles];
+ this.#shadow.adoptedStyleSheets = [stackTraceRowStyles];
}
- private render(): void {
- if (!this.stackTraceRowItem) {
+ #render(): void {
+ if (!this.#stackTraceRowItem) {
return;
}
LitHtml.render(
LitHtml.html`
<div class="stack-trace-row">
- <div class="stack-trace-function-name text-ellipsis" title=${this.stackTraceRowItem.functionName}>
- ${this.stackTraceRowItem.functionName}
+ <div class="stack-trace-function-name text-ellipsis" title=${this.#stackTraceRowItem.functionName}>
+ ${this.#stackTraceRowItem.functionName}
</div>
<div class="stack-trace-source-location">
${
- this.stackTraceRowItem.link ?
- LitHtml.html`<div class="text-ellipsis">\xA0@\xA0${this.stackTraceRowItem.link}</div>` :
+ this.#stackTraceRowItem.link ?
+ LitHtml.html`<div class="text-ellipsis">\xA0@\xA0${this.#stackTraceRowItem.link}</div>` :
LitHtml.nothing}
</div>
</div>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
}
}
@@ -86,75 +86,76 @@
export class StackTraceLinkButton extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-stack-trace-link-button`;
- private readonly shadow = this.attachShadow({mode: 'open'});
+ readonly #shadow = this.attachShadow({mode: 'open'});
- private onShowAllClick: () => void = () => {};
- private hiddenCallFramesCount: number|null = null;
+ #onShowAllClick: () => void = () => {};
+ #hiddenCallFramesCount: number|null = null;
set data(data: StackTraceLinkButtonData) {
- this.onShowAllClick = data.onShowAllClick;
- this.hiddenCallFramesCount = data.hiddenCallFramesCount;
- this.render();
+ this.#onShowAllClick = data.onShowAllClick;
+ this.#hiddenCallFramesCount = data.hiddenCallFramesCount;
+ this.#render();
}
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [stackTraceLinkButtonStyles];
+ this.#shadow.adoptedStyleSheets = [stackTraceLinkButtonStyles];
}
- private render(): void {
- if (!this.hiddenCallFramesCount) {
+ #render(): void {
+ if (!this.#hiddenCallFramesCount) {
return;
}
LitHtml.render(
LitHtml.html`
<div class="stack-trace-row">
- <button class="link" @click=${(): void => this.onShowAllClick()}>
+ <button class="link" @click=${(): void => this.#onShowAllClick()}>
${i18nString(UIStrings.showSMoreFrames, {
- n: this.hiddenCallFramesCount,
+ n: this.#hiddenCallFramesCount,
})}
</button>
</div>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
}
}
export class StackTrace extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-resources-stack-trace`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private readonly linkifier = new Components.Linkifier.Linkifier();
- private stackTraceRows: (Components.JSPresentationUtils.StackTraceRegularRow|
- Components.JSPresentationUtils.StackTraceAsyncRow)[] = [];
- private showHidden = false;
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ readonly #linkifier = new Components.Linkifier.Linkifier();
+ #stackTraceRows: (Components.JSPresentationUtils.StackTraceRegularRow|
+ Components.JSPresentationUtils.StackTraceAsyncRow)[] = [];
+ #showHidden = false;
set data(data: StackTraceData) {
const frame = data.frame;
const {creationStackTrace, creationStackTraceTarget} = frame.getCreationStackTraceData();
if (creationStackTrace) {
- this.stackTraceRows = data.buildStackTraceRows(
- creationStackTrace, creationStackTraceTarget, this.linkifier, true, this.onStackTraceRowsUpdated.bind(this));
+ this.#stackTraceRows = data.buildStackTraceRows(
+ creationStackTrace, creationStackTraceTarget, this.#linkifier, true,
+ this.#onStackTraceRowsUpdated.bind(this));
}
- this.render();
+ this.#render();
}
- private onStackTraceRowsUpdated(stackTraceRows: (Components.JSPresentationUtils.StackTraceRegularRow|
- Components.JSPresentationUtils.StackTraceAsyncRow)[]): void {
- this.stackTraceRows = stackTraceRows;
- this.render();
+ #onStackTraceRowsUpdated(stackTraceRows: (Components.JSPresentationUtils.StackTraceRegularRow|
+ Components.JSPresentationUtils.StackTraceAsyncRow)[]): void {
+ this.#stackTraceRows = stackTraceRows;
+ this.#render();
}
- private onShowAllClick(): void {
- this.showHidden = true;
- this.render();
+ #onShowAllClick(): void {
+ this.#showHidden = true;
+ this.#render();
}
createRowTemplates(): LitHtml.TemplateResult[] {
const expandableRows = [];
let hiddenCallFramesCount = 0;
- for (const item of this.stackTraceRows) {
- if (this.showHidden || (!item.ignoreListHide && !item.rowCountHide)) {
+ for (const item of this.#stackTraceRows) {
+ if (this.#showHidden || (!item.ignoreListHide && !item.rowCountHide)) {
if ('functionName' in item) {
expandableRows.push(LitHtml.html`
<${StackTraceRow.litTagName} data-stack-trace-row .data=${{
@@ -167,7 +168,7 @@
`);
}
}
- if (!this.showHidden && 'functionName' in item && (item.ignoreListHide || item.rowCountHide)) {
+ if (!this.#showHidden && 'functionName' in item && (item.ignoreListHide || item.rowCountHide)) {
hiddenCallFramesCount++;
}
}
@@ -175,7 +176,7 @@
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
expandableRows.push(LitHtml.html`
- <${StackTraceLinkButton.litTagName} data-stack-trace-row .data=${{onShowAllClick: this.onShowAllClick.bind(this), hiddenCallFramesCount: hiddenCallFramesCount} as StackTraceLinkButtonData}></${StackTraceLinkButton.litTagName}>
+ <${StackTraceLinkButton.litTagName} data-stack-trace-row .data=${{onShowAllClick: this.#onShowAllClick.bind(this), hiddenCallFramesCount: hiddenCallFramesCount} as StackTraceLinkButtonData}></${StackTraceLinkButton.litTagName}>
`);
// clang-format on
}
@@ -183,15 +184,15 @@
return expandableRows;
}
- private render(): void {
- if (!this.stackTraceRows.length) {
+ #render(): void {
+ if (!this.#stackTraceRows.length) {
// Disabled until https://crbug.com/1079231 is fixed.
// clang-format off
LitHtml.render(
LitHtml.html`
<span>${i18nString(UIStrings.cannotRenderStackTrace)}</span>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
return;
}
const expandableRows = this.createRowTemplates();
@@ -202,7 +203,7 @@
} as ExpandableList.ExpandableList.ExpandableListData}>
</${ExpandableList.ExpandableList.ExpandableList.litTagName}>
`,
- this.shadow, {host: this});
+ this.#shadow, {host: this});
// clang-format on
}
}
diff --git a/front_end/panels/application/components/TrustTokensView.ts b/front_end/panels/application/components/TrustTokensView.ts
index 7761f14..221ad61 100644
--- a/front_end/panels/application/components/TrustTokensView.ts
+++ b/front_end/panels/application/components/TrustTokensView.ts
@@ -48,22 +48,22 @@
class TrustTokensDeleteButton extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-trust-tokens-delete-button`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private issuer: DataGrid.DataGridUtils.CellValue|null = null;
- private deleteClickHandler: (issuerOrigin: string) => void = () => {};
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #issuer: DataGrid.DataGridUtils.CellValue|null = null;
+ #deleteClickHandler: (issuerOrigin: string) => void = () => {};
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [trustTokensViewDeleteButtonStyles];
+ this.#shadow.adoptedStyleSheets = [trustTokensViewDeleteButtonStyles];
}
set data(data: TrustTokensDeleteButtonData) {
- this.issuer = data.issuer;
- this.deleteClickHandler = data.deleteClickHandler;
- this.render();
+ this.#issuer = data.issuer;
+ this.#deleteClickHandler = data.deleteClickHandler;
+ this.#render();
}
- private render(): void {
- if (!this.issuer) {
+ #render(): void {
+ if (!this.#issuer) {
return;
}
// clang-format off
@@ -71,14 +71,14 @@
<!-- Wrap the button in a container, otherwise we can't center it inside the column. -->
<span class="button-container">
<button class="delete-button"
- title=${i18nString(UIStrings.deleteTrustTokens, {PH1: this.issuer as string})}
- @click=${(): void => this.deleteClickHandler(this.issuer as string)}>
+ title=${i18nString(UIStrings.deleteTrustTokens, {PH1: this.#issuer as string})}
+ @click=${(): void => this.#deleteClickHandler(this.#issuer as string)}>
<${IconButton.Icon.Icon.litTagName} .data=${
{iconName: 'trash_bin_icon', color: 'var(--color-text-secondary)', width: '9px', height: '14px'} as
IconButton.Icon.IconWithName}>
</${IconButton.Icon.Icon.litTagName}>
</button>
- </span>`, this.shadow, {host: this});
+ </span>`, this.#shadow, {host: this});
// clang-format on
}
}
@@ -90,22 +90,22 @@
export class TrustTokensView extends HTMLElement {
static readonly litTagName = LitHtml.literal`devtools-trust-tokens-storage-view`;
- private readonly shadow = this.attachShadow({mode: 'open'});
- private tokens: Protocol.Storage.TrustTokens[] = [];
- private deleteClickHandler: (issuerOrigin: string) => void = () => {};
+ readonly #shadow = this.attachShadow({mode: 'open'});
+ #tokens: Protocol.Storage.TrustTokens[] = [];
+ #deleteClickHandler: (issuerOrigin: string) => void = () => {};
connectedCallback(): void {
- this.shadow.adoptedStyleSheets = [trustTokensViewStyles];
- this.render();
+ this.#shadow.adoptedStyleSheets = [trustTokensViewStyles];
+ this.#render();
}
set data(data: TrustTokensViewData) {
- this.tokens = data.tokens;
- this.deleteClickHandler = data.deleteClickHandler;
- this.render();
+ this.#tokens = data.tokens;
+ this.#deleteClickHandler = data.deleteClickHandler;
+ this.#render();
}
- private render(): void {
+ #render(): void {
// clang-format off
LitHtml.render(LitHtml.html`
<div>
@@ -116,14 +116,14 @@
{iconName: 'ic_info_black_18dp', color: 'var(--color-link)', width: '14px'} as
IconButton.Icon.IconWithName}>
</${IconButton.Icon.Icon.litTagName}>
- ${this.renderGridOrNoDataMessage()}
+ ${this.#renderGridOrNoDataMessage()}
</div>
- `, this.shadow, {host: this});
+ `, this.#shadow, {host: this});
// clang-format on
}
- private renderGridOrNoDataMessage(): LitHtml.TemplateResult {
- if (this.tokens.length === 0) {
+ #renderGridOrNoDataMessage(): LitHtml.TemplateResult {
+ if (this.#tokens.length === 0) {
return LitHtml.html`<div class="no-tt-message">${i18nString(UIStrings.noTrustTokensStored)}</div>`;
}
@@ -154,7 +154,7 @@
sortable: false,
},
],
- rows: this.buildRowsFromTokens(),
+ rows: this.#buildRowsFromTokens(),
initialSort: {
columnId: 'issuer',
direction: DataGrid.DataGridUtils.SortDirection.ASC,
@@ -168,14 +168,14 @@
`;
}
- private buildRowsFromTokens(): DataGrid.DataGridUtils.Row[] {
- const tokens = this.tokens.filter(token => token.count > 0);
+ #buildRowsFromTokens(): DataGrid.DataGridUtils.Row[] {
+ const tokens = this.#tokens.filter(token => token.count > 0);
return tokens.map(token => ({
cells: [
{
columnId: 'delete-button',
value: removeTrailingSlash(token.issuerOrigin),
- renderer: this.deleteButtonRendererForDataGridCell.bind(this),
+ renderer: this.#deleteButtonRendererForDataGridCell.bind(this),
},
{columnId: 'issuer', value: removeTrailingSlash(token.issuerOrigin)},
{columnId: 'count', value: token.count},
@@ -183,10 +183,10 @@
}));
}
- private deleteButtonRendererForDataGridCell(issuer: DataGrid.DataGridUtils.CellValue): LitHtml.TemplateResult {
+ #deleteButtonRendererForDataGridCell(issuer: DataGrid.DataGridUtils.CellValue): LitHtml.TemplateResult {
// clang-format off
return LitHtml.html`<${TrustTokensDeleteButton.litTagName}
- .data=${{issuer, deleteClickHandler: this.deleteClickHandler} as TrustTokensDeleteButtonData}
+ .data=${{issuer, deleteClickHandler: this.#deleteClickHandler} as TrustTokensDeleteButtonData}
></${TrustTokensDeleteButton.litTagName}>`;
// clang-format on
}
