This CL adds the ability to create header overrides from the list of
network requests in the network panel via the context menu.
If a local folder for storing local overrides has already been
configured beforehand, the context menu takes the user straight to the
'.headers' file where header overrides are to be specified. If
overrides have not been configured before, the user has to name a
local folder for storing overrides first.
Video: https://i.imgur.com/kLGlOtL.mp4
Bug: 1297533
Change-Id: I8b31fe41d922e1662da68320fcc188c596c0a058
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3542245
Reviewed-by: Danil Somsikov <dsv@chromium.org>
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
This change converts the separate <table> that was used for the
DataGrid's header row into a <thead> section in the data table. This
results in a single <table> element which is easier for screen reader
users to navigate.
The header has CSS position:sticky so that it remains in view when
scrolling through long data sets. To get the cleaner DOM structure,
and ensure scrolling continued to work, I had to set the whole table
to overflow-y: overlay. This means that the scrollbar now extends up
into the header row which is a visual change from before. See before
and after screenshots below.
I looked into setting the overflow property on the
<tbody> element instead, but this would only make the <tbody>
scrollable if the <tbody>'s display was set to 'block'. Doing that
keeps the scrollbar out of the header area as before, but it breaks
the overall table layout and prevents the cells from using the
widths defined in <colgroup>, which means the resizer UI doesn't work.
This could potentially be fixed with more work in the typescript, but
its not clear this would be worth the effort. The change I'm sharing
here trades the small visual regression for an accessibility win with
as little code churn as possible.
Before:
https://imgur.com/a/9ffDg3J
After:
https://imgur.com/a/iPcnaw7
Bug: 1316147
Change-Id: I30638eb512cdf91e9e5b6383bee8eb1289527311
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3586197
Reviewed-by: Michael Liao <michael.liao@microsoft.com>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Brandon Walderman <brwalder@microsoft.com>
When filling the iframe that's showing the preview for html requests, we
encode the html contents as a data-url and also set the sandbox property
on the frame. This avoids remaking the request from within devtools.
It's still possible for the iframe to spawn some requests. With this CL
we prevent requests by setting the csp for the iframe.
Bug: 833147
Change-Id: Id77321465c91fd68e5d6c6c3681e48b39cb32d14
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3557989
Reviewed-by: Danil Somsikov <dsv@chromium.org>
Commit-Queue: Philip Pfaffe <pfaffe@chromium.org>
1) When no overrides folder is specified, `NetworkPersistenceManager`'s
`projectInternal` is `null`. Handle this case.
2) When overrides are not enabled (but a folder is specified), allow to
retrieve the correct path for a '.headers' file.
Bug: 1297533
Change-Id: Ic21413ef91bda42e68149cf011cb4c5d50f96f31
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3542247
Reviewed-by: Danil Somsikov <dsv@chromium.org>
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
These changes rename SameSiteCookieIssue to CookieIssue. A follow-up
CL will make the file name change. It rolls the browser_protocol.pdl
from Chromium to DevTools frontend. Removes the compatibility changes
introduced in [1].
DISABLE_THIRD_PARTY_CHECK=changes required due to renaming
[1]: https://crrev.com/c/3478766
Bug: 1254192
Change-Id: I45b86611edfa469238f7f30bf0006556e8f07fd2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3499339
Reviewed-by: Danil Somsikov <dsv@chromium.org>
Commit-Queue: Juba Borgohain <chromiumjuba@gmail.com>
The contents of the network request timing panel are recreated any time
the network panel start or end time boundaries change. If there is a
service worker respondWith dropdown open, then it appears to close
because the whole view (including the dropdown) is recreated. On sites
with lots of traffic where the boundary changes frequently, this makes
it difficult to keep the dropdown open.
Before: https://imgur.com/a/kXmgv8C
Since the timing panel only depends on the minimum time boundary, I've
updated the RequestTimingView to cache the previous value and only do a
refresh if the minimum boundary has changed since the last boundary
update.
I've verified that this fixes the bug and that the dropdown stays
open now.
Bug: 1298953
Change-Id: I2b4fa2e9b344d9beac5fd08df95c2b355216560f
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3475081
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Brandon Walderman <brwalder@microsoft.com>
DevTools UI should behave like browser UI. Therefore interactive UI
elements should not need to change the mouse cursor to a hand with
pointing finger.
In particular, this CL removes `cursor: pointer` for
- toolbar icons
- buttons
- panel tabs (vertical and horizontal)
- issues hint icon
- computed styles
- Trust token delete button
- adorners
- data grid header for sorting
- code folding marker in CodeMirror
- animation previews
- DOM tree guttor '...' menu
- elements bread crumbs overflow buttons
- color blocks in CSS Overview
- device preset bars
- devices list items
- network request header and payload views
- Media panel
- delete buttons for watch expression and event listeners
Bug: 1291516
Change-Id: I182c43a43b94de31d1d8f2db4cd7831e82c535bb
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3447411
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Commit-Queue: Yang Guo <yangguo@chromium.org>
The click event only fires for elements that receive both a mousedown
and a mouseup event. Since DataGrid elements in the Network panel get
replaced every time a message is received on WebSockets, the click
event doesn't get fired if you click before a message and release after
the message. To fix this we'll listen for the mousedown event instead.
This has the added benefit that the request panel becomes visible
sooner, making it feel more responsive.
Fixed: 1222382
Change-Id: Ia44c47a90b4822530081caf63aec682e9f32186c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3293092
Reviewed-by: Simon Zünd <szuend@chromium.org>
Commit-Queue: Simon Zünd <szuend@chromium.org>
To remove the module.json file in perf_ui, we need to migrate the
resources to the new `generate_css` template. However, perf_ui is a bit
special, in that it doesn't properly use the widget structure. As such,
it sometimes injects CSS in places where there is no clear shadowRoot
available. Therefore, it is not possible to migrate to CSSStyleSheet in
combination with adoptedStylesheets.
As a workaround (to unblock the module.json removal), we augment
`generate_css` to add legacy file generation. All remaining resources in
DevTools will migrate to these `.css.legacy.js` files. That's because
these resources either are special (perf_ui) or are used in the
`device_mode_emulation_frame` which can't use `CSSStyleSheet` itself.
The files export an object, rather than a plain string. That's because
we need to be able to distinguish what string is referencing a CSS file
path and which strings contain the actual CSS styles. By using an
object, we can remain using the `typeof` check for string in the legacy
CSS infrastructure and otherwise destructure the object.
After this, we can remove perf_ui from the module.json structure and
properly bundle+minify the CSS resources.
R=jacktfranklin@chromium.org
Bug: 1190991, 1127902
Change-Id: I7523333e8025ae5fe5ed74b99b4e45907ff9ad97
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3275787
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Previously, we’d create a regular expression based on the user’s
search query without escaping any characters that might have special
meaning within regular expression patterns. This meant that Search
was effectively broken for queries containing `(`, `.`, and other
common characters.
Fixed: chromium:1267196
Change-Id: If4fb37e87f792ba0231263781d3df6aabb99b965
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3263403
Reviewed-by: Yang Guo <yangguo@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
These modules contain CSS files that are about to be (partially)
removed with the CodeMirror 6 upgrade. To avoid merge conflicts and
breakages, let's make them autostart for now. This allows us to
clean up and remove numerous other module.json files, which were
blocked on just these two. In a future Chrome release, we will
remove the legacy text_editor altogether, at which we can remove
all these files.
R=szuend@chromium.org
Bug: 1127902
Change-Id: Ib44927067931f40a0212f4e0209815d736025000
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3253018
Reviewed-by: Simon Zünd <szuend@chromium.org>
Commit-Queue: Simon Zünd <szuend@chromium.org>
Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org>
Wolfgang Beyer
