blob: 24e40e4a833d89ccfac2fbde7e10157a46a4bf5f [file] [log] [blame]
Sigurd Schneidera86d1162021-02-16 12:20:291// Copyright 2021 The Chromium Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
Tim van der Lippefe58ef22021-04-19 10:48:555import * as Host from '../../core/host/host.js';
6import * as i18n from '../../core/i18n/i18n.js';
Jack Franklina75ae7c2021-05-11 13:22:547import type * as Platform from '../../core/platform/platform.js';
Tim van der Lippefe58ef22021-04-19 10:48:558import * as UI from '../../ui/legacy/legacy.js';
9import * as Network from '../network/network.js';
Tim van der Lippe229a54f2021-05-14 16:59:0510import type * as Protocol from '../../generated/protocol.js';
Sigurd Schneidera86d1162021-02-16 12:20:2911
12import {AffectedItem, AffectedResourcesView} from './AffectedResourcesView.js';
Tim van der Lippeaa1ed7a2021-03-31 14:38:2713
Tim van der Lippebfbb58f2021-02-25 17:34:1914import type {AggregatedIssue} from './IssueAggregator.js';
Jack Franklina75ae7c2021-05-11 13:22:5415import type {IssueView} from './IssueView.js';
Sigurd Schneidera86d1162021-02-16 12:20:2916
Simon Zünd6f95e842021-03-01 07:41:5517const UIStrings = {
Sigurd Schneidera86d1162021-02-16 12:20:2918 /**
pradhuman1c51536c2021-03-16 07:53:4719 *@description Noun, singular or plural. Label for the kind and number of affected resources associated with a DevTools issue. A cookie is a small piece of data that a server sends to the user's web browser. See https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies.
20 */
Wolfgang Beyer40834922021-05-10 08:34:2221 nCookies: '{n, plural, =1 {# cookie} other {# cookies}}',
pradhuman1c51536c2021-03-16 07:53:4722 /**
Sigurd Schneidera86d1162021-02-16 12:20:2923 *@description Noun, singular. Label for a column in a table which lists cookies in the affected resources section of a DevTools issue. Each cookie has a name.
24 */
25 name: 'Name',
26 /**
27 *@description Noun, singular. Label for a column in a table which lists cookies in the affected resources section of a DevTools issue. Cookies may have a 'Domain' attribute: https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies.#define_where_cookies_are_sent
28 */
29 domain: 'Domain',
30 /**
31 *@description Noun, singular. Label for a column in a table which lists cookies in the affected resources section of a DevTools issue. Cookies may have a 'Path' attribute: https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies.#define_where_cookies_are_sent
32 */
33 path: 'Path',
34};
Tim van der Lippefe58ef22021-04-19 10:48:5535const str_ = i18n.i18n.registerUIStrings('panels/issues/AffectedCookiesView.ts', UIStrings);
Sigurd Schneidera86d1162021-02-16 12:20:2936const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
37
38export class AffectedCookiesView extends AffectedResourcesView {
39 private issue: AggregatedIssue;
40 constructor(parent: IssueView, issue: AggregatedIssue) {
pradhuman1663bf9a2021-04-09 15:01:2241 super(parent);
Sigurd Schneidera86d1162021-02-16 12:20:2942 this.issue = issue;
43 }
44
Wolfgang Beyer40834922021-05-10 08:34:2245 protected getResourceNameWithCount(count: number): Platform.UIString.LocalizedString {
pradhuman1c51536c2021-03-16 07:53:4746 return i18nString(UIStrings.nCookies, {n: count});
47 }
48
Sigurd Schneidera86d1162021-02-16 12:20:2949 private appendAffectedCookies(cookies: Iterable<{cookie: Protocol.Audits.AffectedCookie, hasRequest: boolean}>):
50 void {
51 const header = document.createElement('tr');
52 this.appendColumnTitle(header, i18nString(UIStrings.name));
53 this.appendColumnTitle(
54 header, i18nString(UIStrings.domain) + ' & ' + i18nString(UIStrings.path),
55 'affected-resource-cookie-info-header');
56
57 this.affectedResources.appendChild(header);
58
59 let count = 0;
60 for (const cookie of cookies) {
61 count++;
62 this.appendAffectedCookie(cookie.cookie, cookie.hasRequest);
63 }
64 this.updateAffectedResourceCount(count);
65 }
66
67 private appendAffectedCookie(cookie: Protocol.Audits.AffectedCookie, hasAssociatedRequest: boolean): void {
68 const element = document.createElement('tr');
69 element.classList.add('affected-resource-cookie');
70 const name = document.createElement('td');
71 if (hasAssociatedRequest) {
72 name.appendChild(UI.UIUtils.createTextButton(cookie.name, () => {
73 Host.userMetrics.issuesPanelResourceOpened(this.issue.getCategory(), AffectedItem.Cookie);
74 Network.NetworkPanel.NetworkPanel.revealAndFilter([
75 {
Simon Zünd92f35f52021-04-22 06:00:0776 filterType: Network.NetworkLogView.FilterType.CookieDomain,
Sigurd Schneidera86d1162021-02-16 12:20:2977 filterValue: cookie.domain,
78 },
79 {
Simon Zünd92f35f52021-04-22 06:00:0780 filterType: Network.NetworkLogView.FilterType.CookieName,
Sigurd Schneidera86d1162021-02-16 12:20:2981 filterValue: cookie.name,
82 },
83 {
Simon Zünd92f35f52021-04-22 06:00:0784 filterType: Network.NetworkLogView.FilterType.CookiePath,
Sigurd Schneidera86d1162021-02-16 12:20:2985 filterValue: cookie.path,
86 },
87 ]);
88 }, 'link-style devtools-link'));
89 } else {
90 name.textContent = cookie.name;
91 }
92 element.appendChild(name);
93 this.appendIssueDetailCell(element, `${cookie.domain}${cookie.path}`, 'affected-resource-cookie-info');
94
95 this.affectedResources.appendChild(element);
96 }
97
98 update(): void {
99 this.clear();
100 this.appendAffectedCookies(this.issue.cookiesWithRequestIndicator());
101 }
102}