Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 1 | // 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 | |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 5 | import * as Common from '../../core/common/common.js'; |
Tim van der Lippe | fe58ef2 | 2021-04-19 10:48:55 | [diff] [blame] | 6 | import * as Host from '../../core/host/host.js'; |
| 7 | import * as i18n from '../../core/i18n/i18n.js'; |
Jack Franklin | a75ae7c | 2021-05-11 13:22:54 | [diff] [blame] | 8 | import type * as Platform from '../../core/platform/platform.js'; |
Tim van der Lippe | fe58ef2 | 2021-04-19 10:48:55 | [diff] [blame] | 9 | import * as UI from '../../ui/legacy/legacy.js'; |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 10 | import * as NetworkForward from '../../panels/network/forward/forward.js'; |
Tim van der Lippe | 229a54f | 2021-05-14 16:59:05 | [diff] [blame] | 11 | import type * as Protocol from '../../generated/protocol.js'; |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 12 | import {AffectedItem, AffectedResourcesView} from './AffectedResourcesView.js'; |
Tim van der Lippe | bfbb58f | 2021-02-25 17:34:19 | [diff] [blame] | 13 | import type {AggregatedIssue} from './IssueAggregator.js'; |
Jack Franklin | a75ae7c | 2021-05-11 13:22:54 | [diff] [blame] | 14 | import type {IssueView} from './IssueView.js'; |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 15 | |
Simon Zünd | 6f95e84 | 2021-03-01 07:41:55 | [diff] [blame] | 16 | const UIStrings = { |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 17 | /** |
pradhuman1 | c51536c | 2021-03-16 07:53:47 | [diff] [blame] | 18 | *@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. |
| 19 | */ |
Wolfgang Beyer | 4083492 | 2021-05-10 08:34:22 | [diff] [blame] | 20 | nCookies: '{n, plural, =1 {# cookie} other {# cookies}}', |
pradhuman1 | c51536c | 2021-03-16 07:53:47 | [diff] [blame] | 21 | /** |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 22 | *@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. |
| 23 | */ |
| 24 | name: 'Name', |
| 25 | /** |
| 26 | *@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 |
| 27 | */ |
| 28 | domain: 'Domain', |
| 29 | /** |
| 30 | *@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 |
| 31 | */ |
| 32 | path: 'Path', |
Simon Zünd | 27aa364 | 2021-07-30 07:27:46 | [diff] [blame] | 33 | /** |
| 34 | *@description Label for the the number of affected `Set-Cookie` lines associated with a DevTools issue. `Set-Cookie` is a specific header line in an HTTP network request and consists of a single line of text. |
| 35 | */ |
| 36 | nRawCookieLines: '{n, plural, =1 {1 Raw `Set-Cookie` header} other {# Raw `Set-Cookie` headers}}', |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 37 | }; |
Tim van der Lippe | fe58ef2 | 2021-04-19 10:48:55 | [diff] [blame] | 38 | const str_ = i18n.i18n.registerUIStrings('panels/issues/AffectedCookiesView.ts', UIStrings); |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 39 | const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_); |
| 40 | |
| 41 | export class AffectedCookiesView extends AffectedResourcesView { |
| 42 | private issue: AggregatedIssue; |
| 43 | constructor(parent: IssueView, issue: AggregatedIssue) { |
pradhuman1 | 663bf9a | 2021-04-09 15:01:22 | [diff] [blame] | 44 | super(parent); |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 45 | this.issue = issue; |
| 46 | } |
| 47 | |
Wolfgang Beyer | 4083492 | 2021-05-10 08:34:22 | [diff] [blame] | 48 | protected getResourceNameWithCount(count: number): Platform.UIString.LocalizedString { |
pradhuman1 | c51536c | 2021-03-16 07:53:47 | [diff] [blame] | 49 | return i18nString(UIStrings.nCookies, {n: count}); |
| 50 | } |
| 51 | |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 52 | private appendAffectedCookies(cookies: Iterable<{cookie: Protocol.Audits.AffectedCookie, hasRequest: boolean}>): |
| 53 | void { |
| 54 | const header = document.createElement('tr'); |
| 55 | this.appendColumnTitle(header, i18nString(UIStrings.name)); |
| 56 | this.appendColumnTitle( |
| 57 | header, i18nString(UIStrings.domain) + ' & ' + i18nString(UIStrings.path), |
| 58 | 'affected-resource-cookie-info-header'); |
| 59 | |
| 60 | this.affectedResources.appendChild(header); |
| 61 | |
| 62 | let count = 0; |
| 63 | for (const cookie of cookies) { |
| 64 | count++; |
| 65 | this.appendAffectedCookie(cookie.cookie, cookie.hasRequest); |
| 66 | } |
| 67 | this.updateAffectedResourceCount(count); |
| 68 | } |
| 69 | |
| 70 | private appendAffectedCookie(cookie: Protocol.Audits.AffectedCookie, hasAssociatedRequest: boolean): void { |
| 71 | const element = document.createElement('tr'); |
| 72 | element.classList.add('affected-resource-cookie'); |
| 73 | const name = document.createElement('td'); |
| 74 | if (hasAssociatedRequest) { |
| 75 | name.appendChild(UI.UIUtils.createTextButton(cookie.name, () => { |
| 76 | Host.userMetrics.issuesPanelResourceOpened(this.issue.getCategory(), AffectedItem.Cookie); |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 77 | Common.Revealer.reveal(NetworkForward.UIFilter.UIRequestFilter.filters([ |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 78 | { |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 79 | filterType: NetworkForward.UIFilter.FilterType.CookieDomain, |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 80 | filterValue: cookie.domain, |
| 81 | }, |
| 82 | { |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 83 | filterType: NetworkForward.UIFilter.FilterType.CookieName, |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 84 | filterValue: cookie.name, |
| 85 | }, |
| 86 | { |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 87 | filterType: NetworkForward.UIFilter.FilterType.CookiePath, |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 88 | filterValue: cookie.path, |
| 89 | }, |
Sigurd Schneider | 3072258 | 2021-06-16 06:54:16 | [diff] [blame] | 90 | ])); |
Sigurd Schneider | a86d116 | 2021-02-16 12:20:29 | [diff] [blame] | 91 | }, 'link-style devtools-link')); |
| 92 | } else { |
| 93 | name.textContent = cookie.name; |
| 94 | } |
| 95 | element.appendChild(name); |
| 96 | this.appendIssueDetailCell(element, `${cookie.domain}${cookie.path}`, 'affected-resource-cookie-info'); |
| 97 | |
| 98 | this.affectedResources.appendChild(element); |
| 99 | } |
| 100 | |
| 101 | update(): void { |
| 102 | this.clear(); |
| 103 | this.appendAffectedCookies(this.issue.cookiesWithRequestIndicator()); |
| 104 | } |
| 105 | } |
Simon Zünd | 27aa364 | 2021-07-30 07:27:46 | [diff] [blame] | 106 | |
| 107 | export class AffectedRawCookieLinesView extends AffectedResourcesView { |
| 108 | private issue: AggregatedIssue; |
| 109 | constructor(parent: IssueView, issue: AggregatedIssue) { |
| 110 | super(parent); |
| 111 | this.issue = issue; |
| 112 | } |
| 113 | |
| 114 | protected override getResourceNameWithCount(count: number): Platform.UIString.LocalizedString { |
| 115 | return i18nString(UIStrings.nRawCookieLines, {n: count}); |
| 116 | } |
| 117 | |
| 118 | override update(): void { |
| 119 | this.clear(); |
| 120 | const rawCookieLines = this.issue.getRawCookieLines(); |
| 121 | for (const rawCookieLine of rawCookieLines) { |
| 122 | const row = document.createElement('tr'); |
| 123 | row.classList.add('affected-resource-directive'); |
| 124 | this.appendIssueDetailCell(row, rawCookieLine); |
| 125 | this.affectedResources.appendChild(row); |
| 126 | } |
| 127 | this.updateAffectedResourceCount(rawCookieLines.size); |
| 128 | } |
| 129 | } |