zzos/react-native-devtools-frontend
1
0
Fork 0
mirror of https://github.com/react/react-native-devtools-frontend.git synced 2026-09-30 17:27:22 +08:00
Code Issues Packages Projects Releases Wiki Activity
6,677 Commits 43 Branches 79 Tags
bbdf7342fee4e6ff7425b6646475fa586bbc8e2d
Commit Graph
15 Commits
Author SHA1 Message Date
Changhao Han bb4af12377 Complete ARIA tree support to Computed pane 
This CL fixes two issues:
1. The traditional list of Computed styles could not be navigated via
ARIA tree keyboard navigations, due to recent componentization changes.
2. The grouped list was not ARIA-tree-navigatable either.

Bug: chromium:1125511, chromium:1125958
Change-Id: I2fd29ccf7e85019615d5a9fe7fab7647a44c02e9
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2403320
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Commit-Queue: Changhao Han <changhaohan@chromium.org>
 2020-09-11 09:06:46 +00:00
Changhao Han 0a98cc54ea Implements grouped Computed styles in the Computed tab 
Design doc: https://goo.gle/devtools-computed-styles

Screencast: https://imgur.com/a/n8Y7jXH

Updated screencast for expanding by default: https://imgur.com/a/0CUnlch

Bug: chromium:1096230, chromium:1084673, chromium:1106251
Change-Id: Ib6f22de5f96cb7e35fe60730c186cbde7d2905fe
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2360377
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Changhao Han <changhaohan@chromium.org>
 2020-08-21 21:30:00 +00:00
Changhao Han d2454323cb TS-componentize Computed tab's style property and style trace elements 
This also helps future work, for example, Computed style grouping,
to be TS-componentized as well.

Bug: chromium:1106251, chromium:1096230
Change-Id: I2f8a977f4e3f701905354cb4edb15702cb8cd2a3
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2336723
Commit-Queue: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
 2020-08-11 13:52:51 +00:00
Changhao Han 097956ebb5 Improve rendering performance in the Computed Styles pane 
Currently the Computed Styles pane renders several hundreds of computed
styles in a single cycle, which means creating, appending, layout-out,
rendering, and painting hundreds of heavily styled <li> items that
contains widgets and children. This can create a visual lag ranging
from ~100ms to ~1s. This CL breaks down these operations into smaller
batches, and queues them using browser's requestIdleCallback to provide
an instant rendering feedback.

tracing before: https://chromedevtools.github.io/timeline-viewer/?loadTimelineFromURL=https://gist.githubusercontent.com/hanselfmu/424153ea140df049800e716031882238/raw/c62f1561cf4f56c1c5c869325015f3d99ab65637/computed_tab_perf_before.json
tracing after: https://chromedevtools.github.io/timeline-viewer/?loadTimelineFromURL=https://gist.github.com/hanselfmu/5fdc43d3ae878aed82e79ff3af3c1ed6/raw/7d5095dfde0236eccafe53ec0fb22356e303afb9/computed_tab_perf_after.json

Bug: chromium:1100148, chromium:1106251, chromium:1093263
Change-Id: Id0acbf91542280b026fdb67e28097bdb445606ea
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2308547
Commit-Queue: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-07-22 12:30:40 +00:00
Changhao Han cea89153fa Fix typos and use Set for lookup in ComputedStyleWidget 
This CL fixes some nits inside ComputedStyleWidget to pave the way for
upcoming Computed pane grouping prototype.

Bug: chromium:1096230
Change-Id: If6dd078b8a4887a4f6b7e8a2d2fe562d117074a7
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2282813
Auto-Submit: Changhao Han <changhaohan@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-07-07 04:46:42 +00:00
Sigurd Schneider 46f8ecc40d Fix stylelint-config-standard issues in elements/computedStyleWidgetTree.css 
R=mathias@chromium.org

Bug: chromium:1083142
Change-Id: I5a532788f0127d8dffddc829d8685f53b2e05b78
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2264118
Commit-Queue: Sigurd Schneider <sigurds@chromium.org>
Auto-Submit: Sigurd Schneider <sigurds@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-06-26 09:00:45 +00:00
Mathias Bynens ca9fa2d73f Consistently format CSS color and opacity values 
- Prefer the modern comma-free CSS color function syntax over the
  legacy syntax. [1]
- Explicitly use the `deg` suffix for angle values in colors, to
  clarify the range.
- Explicitly use the `%` suffix for percentages instead of formatting
  the value as a number, again to clarify the range.

[1]: https://twitter.com/mathias/status/1253242715304857601
[2]: https://goo.gle/devtools-css-color

Bug: chromium:1083142
Fixed: chromium:1073885
Change-Id: I8e1582a2dee3553a61df88564051ea84c2011d76
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2209091
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Mathias Bynens <mathias@chromium.org>
 2020-05-19 16:50:26 +00:00
Mathias Bynens b0c1f4bce2 Fix stylelint-config-standard violations 
Bug: chromium:1083142
Change-Id: I5ea4cc5d0f83e52856383ba37a47472e33eb19a2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2204113
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Changhao Han <changhaohan@chromium.org>
Auto-Submit: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
 2020-05-15 17:05:27 +00:00
Kalon Hinds 9790091ab7 High contrast support for Application panel 
This patch adds high contrast support to the application panel by
attributing the correct link text color for clickable devtool links as
well as fixing tree-outline icon behavior on hover and selection.

Before: https://i.imgur.com/2Nr9RUs.gif
After: https://i.imgur.com/o6DKpC1.gif

Bug: 1048378
Change-Id: I2f7e27134af0d6d88308722946a7aa5a3b55a676
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2044000
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Kalon Hinds <kahinds@microsoft.com>
 2020-02-10 18:17:20 +00:00
Kham Udom 047cb6914a Fixed high contrast in Elements panels. 
Update the DOM tree panel by fixing missing expanded glyph, removed the
borders, set by the system. The borders should only be visible,
when elements are hovered or selected.

Made sure all the panels, Style, Computed, Event Listeners,
DOM Breakpoints, Properties, and Accessibility, have a hover state,
if there is one, in Default mode. Otherwise, all panels
should be navigable, with keyboard.

Before: https://imgur.com/a/XaXWvFW
After: https://imgur.com/a/1lBV1Br

Update:1
Addressed comments to move styles to a central location,
removed unnecessary use of forced-colors and !important
and unused rule sets.

Update:2
Address change to use border color, more refactoring work
to remove unnecessary !important, more work on centralizing
styles

Bug: 1048378

Change-Id: I6942eb46d6c741fdea3f062ac61ead7c6e9d1bbc
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2007930
Commit-Queue: Kham Udom <khamu@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-02-04 18:57:20 +00:00
Erik Luo cedf2be6db Revert "DevTools: prepare Computed sidebar for groups" 
This reverts commit 2d8ad76070a840ce3821f3d28e55cd952f7640c0.

Reason for revert: Grouping would break alphabetical sort, which is controversial.

Original change's description:
> DevTools: prepare Computed sidebar for groups
> 
> Computed sidebar
> - Removes even/odd striping
> - Extracts a function to build a property's TreeElement
> 
> Bug: 929536
> Change-Id: I727cf1efa5ac65277a046b52575f35102323c38f
> Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1548446
> Reviewed-by: Joey Arhar <jarhar@chromium.org>
> Commit-Queue: Erik Luo <luoe@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#648029}

TBR=luoe@chromium.org,jarhar@chromium.org

# Not skipping CQ checks because original CL landed > 1 day ago.

Bug: 929536
Change-Id: Icec233a91c07b2b864830df6419690911070101a
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1565380
Reviewed-by: Erik Luo <luoe@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#650149}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 37893dee61d4f8d4a23c0d23bd36dbd4ef6d893c
 2019-04-12 00:59:26 +00:00
Erik Luo 247064ee0f DevTools: prepare Computed sidebar for groups 
Computed sidebar
- Removes even/odd striping
- Extracts a function to build a property's TreeElement

Bug: 929536
Change-Id: I727cf1efa5ac65277a046b52575f35102323c38f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1548446
Reviewed-by: Joey Arhar <jarhar@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#648029}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 2d8ad76070a840ce3821f3d28e55cd952f7640c0
 2019-04-05 01:44:27 +00:00
Erik Luo 08e147b821 DevTools: use 2 rows for narrow Computed sidebar layouts 
Screenshot: https://imgur.com/a/E0g35gC

Bug: 899235
Change-Id: I90c643e48cfb8a7519627cd1446e04da19d09950
Reviewed-on: https://chromium-review.googlesource.com/c/1418502
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#631077}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: de362015ae467b05c3a90b54cfed8c6534776f20
 2019-02-12 03:27:11 +00:00
Erik Luo f6956bc49e DevTools: remove flex from Computed widget for copyability 
Bug: 899235
Change-Id: Ifb75bcd27cf74e95e4b30511f72d367a349d762b
Reviewed-on: https://chromium-review.googlesource.com/c/1418372
Commit-Queue: Erik Luo <luoe@chromium.org>
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#630264}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 61ecd6b7214a945d4831e686b461acc8b8e885a2
 2019-02-08 10:24:46 +00:00
Blink Reformat 4c46d0969f The Great Blink mv for source files, part 2. 
Move and rename files.

NOAUTOREVERT=true
NOPRESUBMIT=true
NOTREECHECKS=true
Bug: 768828
TBR=darin@chromium.org
NOTRY=true

Change-Id: I66d3b155808bc5bdbf237b80208e1e552bcf7f28
Reviewed-on: https://chromium-review.googlesource.com/1001153
Reviewed-by: Blink Reformat <blink-reformat@chromium.org>
Commit-Queue: Blink Reformat <blink-reformat@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#549061}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 0aee4434a4dba42a42abaea9bfbc0cd196a63bc1
 2018-04-07 15:32:37 +00:00