zzos/react-native-devtools-frontend
1
0
Fork 0
mirror of https://github.com/react/react-native-devtools-frontend.git synced 2026-10-10 05:35:05 +08:00
Code Issues Packages Projects Releases Wiki Activity
7,706 Commits 45 Branches 79 Tags
fdf2a0cecd0116bc13e2c838b485e59cd6bfbc46
Commit Graph
50 Commits
Author SHA1 Message Date
Jack Franklin 49a9481a74 Lint color usage in background and border-* properties. 
The list of CSS properties we check for colors wasn't thorough and
didn't include `border-left/right/top/bottom` or `background` on its
own. This CL fixes that and disables the rule for any current
violations.

Bug: 1152736
Change-Id: Ic732d653fdfab0462a04dc891bcece1f44e5d471
No-Presubmit: true
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2676157
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Commit-Queue: Paul Lewis <aerotwist@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
 2021-02-05 15:39:39 +00:00
Jack Franklin 8064d3ba7a Lint against non-theme-color variables 
This CL turns on the use_theme_colors stylelint rule which enforces that
any colors use variables defined in our codebase.

There are many, many violations, unsurprisingly (about 1500), so for now
I have disabled every single violation. The goal of the dark mode
migration will be in part to remove all violations of this rule.

Additionally, new code going forwards should adhere to the rule and not
add the comment to disable the warning.

Bug: 1152736
Change-Id: I51372724ea51485daef3d4f75b7d3f60a7c8016f
No-Presubmit: true
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2671323
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
 2021-02-03 11:02:09 +00:00
Jack Franklin 0d88cbb6fd Ban named-colors in our CSS 
Used
https://css-tricks.com/snippets/css/named-colors-and-hex-equivalents/ as
the reference and did a bunch of find and replaces. Should be no visible
changes; have checked by running DevTools locally and looking for
anything that looks off.

Note that system colors (e.g. HighlightText) are still permitted.

Fixed: chromium:1171775
Bug: chromium:1104187
Change-Id: I99c281886822deb5a5292ac8691a4f2f9e026428
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2656243
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2021-02-01 09:33:45 +00:00
Jack Franklin fd9dfaa5e7 [Dark mode] replace #fff background-color 
This CL searches for CSS that matches:

- background: #fff
- background: #ffffff
- background: #white
- background-color: #fff
- background-color: #ffffff
- background-color: #white

And replaces the declaration with var(--color-background) from the new
set of color variables.

Bug: 1152736
Change-Id: Ia0575ccfa4e23c92fd4f83e6c911236dbb893fea
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2577559
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
 2021-01-11 16:18:06 +00:00
Jack Franklin cac69b4441 [Dark mode]: generate dark styles for cmdevtools.css 
Uses the new script to generate the dark mode styles for cmdevtools so save us
manually processing it. Tested by clicking around the sources panel in light and
dark mode and verifying that things look as expected.

Also fixed some bugs in the generator script to ensure we generate the
right selectors.

Bug: 1152736
Change-Id: If3491651be116033be7248e695ceab1de5f3fc5c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2593129
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
 2021-01-11 16:10:06 +00:00
Tim van der Lippe 7e68fd36d6 Update CodeMirror to 5.59.1 
This brings in the fix for handling astral characters:
https://github.com/codemirror/CodeMirror/commit/37d7b2efceb192c94811a13b2b7b3eec4b786608

R=mathias@chromium.org

Fixed: 1161083
Change-Id: Ida6ec4c02d8f11359a5e0a44eb803138cd778d08
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2613215
Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2021-01-07 10:06:41 +00:00
Alfonso Castaño 8c42bf00df Make Issue Message in Source Tab link to Issues tab 
Design-doc: https://docs.google.com/document/d/1TgMAUsruc_xAPAseG96H0-NHRT_PiXciedD58hgq1e4/
Bug: chromium:1150883
Change-Id: Ibe320de74ff726f5d649007e7c7b298a50892301
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2562353
Commit-Queue: Simon Zünd <szuend@chromium.org>
Reviewed-by: Simon Zünd <szuend@chromium.org>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
 2020-12-21 11:33:15 +00:00
Alfonso Castaño 3a28946876 [Frontend] Show Issue next to corresponding line in Source Tab 
This CL contains the changes related with displaying the messages.

Design-doc: https://docs.google.com/document/d/1TgMAUsruc_xAPAseG96H0-NHRT_PiXciedD58hgq1e4/
Screenshot: https://i.imgur.com/2iOUMqK.png
Bug: chromium:1150883
Change-Id: I1ec91ead2d102e397b5d0f18f9f96c10f91230ce
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2567969
Commit-Queue: Alfonso Castaño <alcastano@google.com>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-12-11 11:19:27 +00:00
Alfonso Castaño ff2d4dc7d0 Refactor UISourceCodeFrame to use Icon component 
Now it should be possible to add any icon of any size even if it is not in the spritesheet.

Screenshot: https://i.imgur.com/BwjiD5b.png
Bug: chromium:1150883
Change-Id: I0e017b48c29b4ece8374c0797992e29b68541a98
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2555061
Commit-Queue: Alfonso Castaño <alcastano@google.com>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-11-30 11:01:58 +00:00
Mathias Bynens dab0f8bdff Move some custom cm CSS to text_editor instead 
Although `front_end/cm/codemirror.css` contains some DevTools-specific
tweaks, we should generally treat it like a rolled-in upstream
dependency. This patch moves some of its custom tweaks to
`front_end/text_editor/cmdevtools.css` instead.

Bug: chromium:1076825
Change-Id: Ie4c0cad9d0917186bde57b2027254998198e69d5
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2474656
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
 2020-10-15 10:43:13 +00:00
Mathias Bynens e4de6b3c30 Reland “Enable property-no-vendor-prefix stylelint check” 
This patch drops unnecessary -webkit- prefixes in CSS and enables
a lint check to enforce that prevent such properties from being
added in the future. Note that the use of vendor-prefixed CSS
properties is still accepted in cases where there is no standardized
and browser-supported alternative.

TBR=changhaohan@chromium.org

No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug: chromium:1104187
Change-Id: Ibf36fe5a3802b5f3ac663b7ac873a4758e0fda14
Fixed: chromium:1031475
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297386
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297393
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Auto-Submit: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-07-14 14:47:38 +00:00
Tim van der Lippe 2efbb1b802 Revert "Enable property-no-vendor-prefix stylelint check" 
This reverts commit 190803bad8.

Reason for revert: This breaks the icons in DevTools, which leaves gray backgrounds behind.

Original change's description:
> Enable property-no-vendor-prefix stylelint check
> 
> This patch drops unnecessary -webkit- prefixes in CSS and enables
> a lint check to enforce that prevent such properties from being
> added in the future. Note that the use of vendor-prefixed CSS
> properties is still accepted in cases where there is no standardized
> and browser-supported alternative.
> 
> Bug: chromium:1104187
> Change-Id: I29ae93d5a760c4f5037f20663754f448b5083235
> Fixed: chromium:1031475
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297386
> Reviewed-by: Changhao Han <changhaohan@chromium.org>
> Commit-Queue: Mathias Bynens <mathias@chromium.org>

TBR=mathias@chromium.org,changhaohan@chromium.org

Change-Id: I5fe13b7afd8b71180163c7419092cc6a758903b6
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug: chromium:1104187
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297391
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
 2020-07-14 14:24:29 +00:00
Mathias Bynens 190803bad8 Enable property-no-vendor-prefix stylelint check 
This patch drops unnecessary -webkit- prefixes in CSS and enables
a lint check to enforce that prevent such properties from being
added in the future. Note that the use of vendor-prefixed CSS
properties is still accepted in cases where there is no standardized
and browser-supported alternative.

Bug: chromium:1104187
Change-Id: I29ae93d5a760c4f5037f20663754f448b5083235
Fixed: chromium:1031475
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2297386
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
 2020-07-14 13:23:06 +00:00
Mathias Bynens 4dfebef8e1 Fix stylelint-config-standard issues in text_editor/cmdevtools.css 
Bug: chromium:1083142
Change-Id: I152489cdf3080fb15aa656481d9e4d0837911a2c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2287515
Auto-Submit: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Commit-Queue: Changhao Han <changhaohan@chromium.org>
 2020-07-08 11:29:26 +00:00
Wolfgang Beyer a7ffdc451a Revert "Styling for 'deactivate breakpoints'-button" 
This reverts commit 82f58f7d38.

Reason for revert: error during rebase, changes unrelated css.

Original change's description:
> Styling for 'deactivate breakpoints'-button
> 
> Screenshots:
> https://i.imgur.com/ouDvQWx.png
> https://i.imgur.com/ib9vPcy.png
> 
> Bug: chromium:1041830
> Change-Id: I13914f35d3d4ff1ab21633acc444f42e6d35a11a
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2263393
> Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
> Reviewed-by: Mathias Bynens <mathias@chromium.org>

TBR=mathias@chromium.org,wolfi@chromium.org,petermueller@chromium.org

Change-Id: I50bd7afdd79d9f79cb609722bf3ce6259c731f08
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug: chromium:1041830
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2266574
Reviewed-by: Wolfgang Beyer <wolfi@chromium.org>
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
 2020-06-25 12:57:44 +00:00
Wolfgang Beyer 82f58f7d38 Styling for 'deactivate breakpoints'-button 
Screenshots:
https://i.imgur.com/ouDvQWx.png
https://i.imgur.com/ib9vPcy.png

Bug: chromium:1041830
Change-Id: I13914f35d3d4ff1ab21633acc444f42e6d35a11a
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2263393
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-06-25 10:11:42 +00:00
Wolfgang Beyer 464172eeb4 Redesign breakpoints to use flags and icons 
This updates the styling of breakpoints to a design based on flags
with icons. Different breakpoint types can be identified by shape and
color. The design works with both light and dark themes and takes
accessibility considerations into account.

Design doc:
https://docs.google.com/document/d/1ohMw34GC9_E9niHmw8_WWD1h4_iRT6LOCOqzGQEWQIQ/

Screenshots:
https://i.imgur.com/Ec0s6di.png
https://i.imgur.com/ohKpb2y.png

Bug: chromium:1041830
Change-Id: I1f84c4eb56a68de5061015efff1c89149360a247
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2260674
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-06-25 09:01:22 +00:00
Mathias Bynens 38562ddf8f Fix autofixable CSS lint issues 
Bug: chromium:1083142
Change-Id: Icaaeebcdaf1e3cfc2fe2a75bf2aa5e814d0794a3
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2249665
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
 2020-06-17 11:17:07 +00:00
Wolfgang Beyer 12e579fd19 Remove breakpoint gutter 
The changes to the breakpoint design introduced in
https://crrev.com/c/2078851 added an additional gutter to the
CodeMirror element for displaying source code. An empty <div> was
created on every single source code line to ensure that the right-
click menu was working correctly.

For large source files the creation of thousands of divs caused
performance issues, especially when opening source files with a
breakpoint already set.

This CL removes the breakpoint gutter without impacting the UI.
This solves the problem with large files having very long load
times.

Screenshots: https://i.imgur.com/QgK7L72.png,
https://i.imgur.com/MiJ2FJy.png

Fixed: chromium:1087411, chromium:1090658
Change-Id: I7b06a2a0a30dc5a44d620f01e45c063eb92d17c5
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2230530
Reviewed-by: Eric Leese <leese@chromium.org>
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
 2020-06-08 08:03:55 +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
Wolfgang Beyer dbe5d73f7b Add background color to gutter for breakpoints 
Add a background color to the linenumber gutter when setting a break-
point. This makes it easier to see at first glance for which line a
breakpoint was set.

Screenshots:
https://imgur.com/8Ev4eXV
https://imgur.com/H3ipmUt

Bug: chromium:1041830
Change-Id: I326a53b83b417ff928875da3cf3a0f4a00fdd027
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2194870
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-05-12 11:53:44 +00:00
Peter Müller d55a20bb8c Adds larger breakpoint icons to the debugging mode. 
Screenshots: https://imgur.com/a/JqiGMXw

Related to https://bugs.chromium.org/p/chromium/issues/detail?id=1041830&q=breakpoint&can=2

Change-Id: Ia9ac4905457da51b13b9459475cdfd814a772b2a
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2193579
Reviewed-by: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Simon Zünd <szuend@chromium.org>
Commit-Queue: Simon Zünd <szuend@chromium.org>
 2020-05-12 09:32:18 +00:00
Z Duong Nguyen-Huu 4890aa6fee [wasm] Disallow setting breakpoints on unbreakable lines in WAT 
Toggle non-breakable Wasm Disassembly lines to class of
'cm-non-breakable-line'.
Disallow to put breakpoint in non-breakable WAT as well.

Change-Id: Ib4fbb1cb7728a43790c719a9b12e248cab8bc163
Bug: chromium:1043033
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2160000
Commit-Queue: Benedikt Meurer <bmeurer@chromium.org>
Reviewed-by: Kim-Anh Tran <kimanh@chromium.org>
Reviewed-by: Eric Leese <leese@chromium.org>
 2020-05-07 17:05:49 +00:00
Eric Leese bdb35569f7 Reland "Show unbound breakpoints as disabled" 
This is a reland of ca63eb417e

Original change's description:
> Show unbound breakpoints as disabled
>
> We need the UI to distinguish between a successfully bound breakpoint
> and one that has not been bound. This change makes unbound breakpoints
> look like disabled breakpoints, though that could be changed to a
> different icon in the future.
>
> This change also eliminates a race condition in some tests by waiting
> for a breakpoint to be bound after setting it.
>
> Fixed: chromium:1063864, chromium:1064581
> Change-Id: Id181a19efd7f9939a1555368b9367aaa22af0fd2
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2128131
> Commit-Queue: Eric Leese <leese@chromium.org>
> Reviewed-by: Simon Zünd <szuend@chromium.org>
> Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>

Change-Id: I02c4ce21a617f797862fb8f5ec996ef2e45c20ca
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2132227
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Eric Leese <leese@chromium.org>
 2020-04-03 16:34:23 +00:00
Paul Lewis aa978561a3 Revert "Show unbound breakpoints as disabled" 
This reverts commit ca63eb417e.

Reason for revert: These tests are causing timeouts on bots

Original change's description:
> Show unbound breakpoints as disabled
> 
> We need the UI to distinguish between a successfully bound breakpoint
> and one that has not been bound. This change makes unbound breakpoints
> look like disabled breakpoints, though that could be changed to a
> different icon in the future.
> 
> This change also eliminates a race condition in some tests by waiting
> for a breakpoint to be bound after setting it.
> 
> Fixed: chromium:1063864, chromium:1064581
> Change-Id: Id181a19efd7f9939a1555368b9367aaa22af0fd2
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2128131
> Commit-Queue: Eric Leese <leese@chromium.org>
> Reviewed-by: Simon Zünd <szuend@chromium.org>
> Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>

TBR=aerotwist@chromium.org,szuend@chromium.org,tvanderlippe@chromium.org,leese@chromium.org,mathiasb@google.com

Change-Id: I52ba7d595f526f6beee9469193a262bbbb424839
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2132226
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Commit-Queue: Paul Lewis <aerotwist@chromium.org>
 2020-04-01 12:26:39 +00:00
Eric Leese ca63eb417e Show unbound breakpoints as disabled 
We need the UI to distinguish between a successfully bound breakpoint
and one that has not been bound. This change makes unbound breakpoints
look like disabled breakpoints, though that could be changed to a
different icon in the future.

This change also eliminates a race condition in some tests by waiting
for a breakpoint to be bound after setting it.

Fixed: chromium:1063864, chromium:1064581
Change-Id: Id181a19efd7f9939a1555368b9367aaa22af0fd2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2128131
Commit-Queue: Eric Leese <leese@chromium.org>
Reviewed-by: Simon Zünd <szuend@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
 2020-04-01 11:09:09 +00:00
Wolfgang Beyer 98b339fb3c New icons for breakpoints 
Previously conditional breakpoints and logpoints looked exactly the
same. This CL adds the ability to differentiate between these two types
while adding new svg icons for all types of breakpoints and inline
breakpoints.

Screenshot: https://imgur.com/HJep0W7
Design Doc: https://docs.google.com/document/d/1Qb1Z82ZVr-WZY0qSqI6UI7DiEP0g3kn7cW_ZeCBC3mM

Fixed: chromium:1041830
Fixed: chromium:1054747
Change-Id: If4ee8ac987c513dec1a4406f913b428c1713016b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2078851
Commit-Queue: Wolfgang Beyer <wolfi@chromium.org>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
 2020-03-16 14:44:56 +00:00
Kham Udom 0bf716dac1 High contrast for Sources navigator panel and filter widget 
The patch fixes the navigator tree and the filter list widget, adding
hover and focus color values. There are also small fixes to the soft
context menu, the tab over flow button and change the text prompt
foreground color to be the disabled color.

update:
Add transparent border to set border color for high contrast


Before: https://imgur.com/a/UvVdlCM
After: https://imgur.com/a/mMXrlLs

Bug: 1048378
Change-Id: Ib775144f6a798ccaabc7ac9d3083eb01c9250c3d
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2055896
Commit-Queue: Kham Udom <khamu@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-02-14 17:08:13 +00:00
Mathias Bynens 9680e2e8b0 Drop -webkit-user-select in favor of user-select 
Bug: chromium:1031475
Change-Id: Ibbf222135c97e79ae3be816216fec9675d643952
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/1953613
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>
 2019-12-06 10:31:53 +00:00
Brian Cui cc7d75fa50 DevTools: Remove unused CodeMirror line number border rule 
This change fixes a bug where a misplaced blue bar appears in the middle
of the debugger when paused at a line.

The blue bar was intended to add color to the line gutter when paused on
that line. However, the "chevron" icon that appears on the line number
overlays the gutter border, so the rule has no visual effect even when
positioned correctly.

Thus, this change removes the CSS rule entirely as it is presently
positioned incorrectly, and has no effect when positioned correctly.

Before: https://i.imgur.com/cGluk3C.png
Positioned "correctly": https://i.imgur.com/xJzup61.png
After: https://i.imgur.com/RgpRIU1.png

Bug: 1005964
Change-Id: I701f6defca6a35dce2cedaccdc8ddf829598c4fc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1815853
Auto-Submit: Brian Cui <brcui@microsoft.com>
Reviewed-by: Yang Guo <yangguo@chromium.org>
Reviewed-by: Mandy Chen <mandy.chen@microsoft.com>
Commit-Queue: Brian Cui <brcui@microsoft.com>
Cr-Original-Commit-Position: refs/heads/master@{#699389}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 3983131837da45e1712f17c6cfa1f89eff2bc629
 2019-09-24 17:11:11 +00:00
Benedikt Meurer a62d7f895a [devtools] Improve code coverage color selection. 
The color selection for code coverage (red+green) is not ideal for
developers that are impacted by color blindness. This changes the
colors to a brighter red and some blueish green that, a combination
that is known to work well enough for people impacted by different
kinds of color blindness.

https://pbs.twimg.com/media/EEU9fCzUUAItz4n?format=jpg shows an
example of how these two colors look like now.

Bug: chromium:1003671
Change-Id: I9c3e08fb350a6086624d63f44e069813c618588e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1801762
Auto-Submit: Benedikt Meurer <bmeurer@chromium.org>
Commit-Queue: Yang Guo <yangguo@chromium.org>
Reviewed-by: Yang Guo <yangguo@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#696727}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 71d06de626d5e15fae7534df8fe0bb1613838aa7
 2019-09-16 08:00:24 +00:00
Sigurd Schneider 68721308ab [devtools] Fix coverage gutter display 
The element with the color collapsed to zero width,
because its only content was a whitespace character
that got collapsed. I replaced it with a zero-width
whitespace, this way the element gets the right width
from CSS.

Bug: chromium:996774
Change-Id: Ie6322196c7575b0c1b2c402b97bb2928f62ed114
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1774631
Reviewed-by: Yang Guo <yangguo@chromium.org>
Reviewed-by: Andrey Kosyakov <caseq@chromium.org>
Commit-Queue: Andrey Kosyakov <caseq@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#691623}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: e5f87144df35ad4b18414681d414a12e9d715e6f
 2019-08-29 14:20:53 +00:00
Junyi Xiao 0ccf6db244 Devtools: a11y fixes for Memory heap profiler 
Accessibility testing revealed the following issues within the tool:
1. no focus indicator on javascript VM instances list

This change:
changes current selected/hover and adds selected but inactive color to match treeoutline in Element

Bug: 963183

Workflow gif: https://imgur.com/a/lHNTOP7

Change-Id: Iaed79d7166bf70011711be548ba66c65a57922da
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1678946
Commit-Queue: Junyi Xiao <juxiao@microsoft.com>
Reviewed-by: Alexei Filippov <alph@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#690483}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 522709bc5b3158fdaef516f391d382d7321e505f
 2019-08-26 20:26:47 +00:00
Anubha Mathur 2224290046 DevTools: Fix accessibility issues in Sources Tool - Navigator Pane and Editor pane 
Fixed the following accessibility issues in Sources Panel navigator pane and editor pane:

- Problem: No way to access nodes under FileSystem and Overrides panes in the Navigator view using keyboard
  Fix: Fixed by autoselecting the first node in these trees, so when you tab into the div containing the tree, some node is selected, and you can use keyboard to navigate through them

- Problem: Color contrast issue with lineNumbers in the editor
  Fix: Replace rgb(128, 128, 128) with equivalent hsl(0, 0, 50.2) and make it darker by changing lightness percentage to 46%, i.e. hsl(0, 0, 46)

Added following tests:
- a11y-axe-core\sources\sources-left-pane-a11y-test.js: Axe test for Sources panel Navigator pane
- a11y-axe-core\sources\sources-editor-pane-a11y-test.js: Axe test for Sources panel Editor pane

Images showing new colors in the Editor pane:
https://imgur.com/orA26yS (dark theme)
https://imgur.com/VSeTXck (light theme)

Video showing selection of FileSystem contents by default
https://imgur.com/l7wMKx6

Change-Id: I191d915818039455aeb7d9c6869c16b76d7ceeb7
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1593550
Reviewed-by: Joel Einbinder <einbinder@chromium.org>
Commit-Queue: Anubha Mathur <anubmat@microsoft.com>
Cr-Original-Commit-Position: refs/heads/master@{#676209}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 39d427c5da5ec4b35e1870adf173c959b1622f06
 2019-07-11 00:31:00 +00:00
Joel Einbinder d1b707807d DevTools: Fix some missing images after switching to svg 
select elements were incorrectly relying on chromeSelect.svg, which
doesn't exist yet.

Simimlarly, code folding was relying on the png version of treeoutline
triangles.

Change-Id: Id2f27a1800a5070e5eaa607260328f14cb06c582
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1663322
Reviewed-by: Erik Luo <luoe@chromium.org>
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#669981}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 996cd9e77c56106f4f85d3a75d84bb347180329a
 2019-06-18 06:19:22 +00:00
Joel Einbinder f6f86b6a43 DevTools: SVG Icons 
This switches our icons to use svg instead of png. It replaces
the png optimizer with an svg optimizer.

Change-Id: I63f8de9059502ab952d39bbefe5da1f6d4708d37
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1643403
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Reviewed-by: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#667807}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 56a647b2510baf3b314fab1130dbe08c191c9072
 2019-06-10 23:19:12 +00:00
Alexei Filippov 5db42e16fc DevTools: Show large memory allocations in MB in line level profile. 
BUG=937880

Change-Id: Ic6120eff249038ce2affcf46d40097fac62628ba
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1521567
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Commit-Queue: Alexei Filippov <alph@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#640531}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 3070906afb6a6c40eaf3e172e267da68e7591023
 2019-03-13 23:13:25 +00:00
Alexei Filippov fdfefe0d79 Reland: DevTools: Implement live heap profile. 
This is the initial implementation of the profiler. It is put behind
a hidden experiment.

BUG=937880

Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1501994
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1512701
Commit-Queue: Alexei Filippov <alph@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#639250}
Change-Id: I393e1b6f155464463a230b374f0ce69d40a099e8
Cr-Original-Original-Commit-Position: refs/heads/master@{#638794}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: cfeb8e2024965064a51c067599f9b013039e5d8d
 2019-03-09 00:33:24 +00:00
Kamila Hasanbega a07595a4df Revert "DevTools: Implement live heap profile." 
This reverts commit 7ddffe6a4a5eb3a30760a3df05639ef613577b77.

Reason for revert: reverting due to FindIt bot determining this cl to be the reason https://ci.chromium.org/p/chromium/builders/ci/Mac10.13%20Tests%20%28dbg%29 is failing.

Original change's description:
> DevTools: Implement live heap profile.
> 
> This is the initial implementation of the profiler. It is put behind
> a hidden experiment.
> 
> BUG=937880
> 
> Change-Id: I55f4fb7f234ba3baff9ade8a0b9523e736204dc9
> Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1501994
> Commit-Queue: Alexei Filippov <alph@chromium.org>
> Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#638794}

TBR=dgozman@chromium.org,alph@chromium.org

Change-Id: I7c3a5ce70db32ccd882b425ff6cc4432b6a68b0d
No-Presubmit: true
No-Tree-Checks: true
No-Try: true
Bug: 937880
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1511256
Reviewed-by: Kamila Hasanbega <hkamila@chromium.org>
Commit-Queue: Kamila Hasanbega <hkamila@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#638963}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 791c189547b47072f8c910fc238c6da6d6d1b579
 2019-03-08 10:19:10 +00:00
Alexei Filippov 70bdc1290f DevTools: Implement live heap profile. 
This is the initial implementation of the profiler. It is put behind
a hidden experiment.

BUG=937880

Change-Id: I55f4fb7f234ba3baff9ade8a0b9523e736204dc9
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1501994
Commit-Queue: Alexei Filippov <alph@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#638794}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 7ddffe6a4a5eb3a30760a3df05639ef613577b77
 2019-03-07 23:21:07 +00:00
Alexei Filippov 6c89282a54 DevTools: Make line level profile support memory annotations. 
BUG=937880

Change-Id: Ib222ad6cddf23b0f28863e75f1bc729e638c6ee4
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1504460
Commit-Queue: Alexei Filippov <alph@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#638307}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: f1092ff4c5a57d39196c4821a623d12df03b80d4
 2019-03-06 22:30:42 +00:00
Pavel Feldman 33b4091e40 DevTools: migrate to the light selection color to achieve 4.5+ contrast ratio. 
Bug: 850500
Change-Id: Iccf9ca5fe088aa09d46dc4dd3344be79f28013a8
Reviewed-on: https://chromium-review.googlesource.com/c/1388027
Commit-Queue: Pavel Feldman <pfeldman@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#618701}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 6b6debfc317059bbe69de528507b9b397333a612
 2018-12-22 01:08:02 +00:00
Joel Einbinder c9861428f5 DevTools: Use geometry instead of CSS for code folding hover 
The previous CL's CSS hack incorrectly cut off breakpoints, caused the
gutter to be transparent when scrolling code horizontally, and made
closed folding triangles invisible.

Bug: 328431
Change-Id: Iba9482efd4bfd13d750580746f5507dadd0c73b2
Reviewed-on: https://chromium-review.googlesource.com/c/1380557
Reviewed-by: Erik Luo <luoe@chromium.org>
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#617362}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 87b1e4b4c4908281cb602c44f4a757fd653ec4b4
 2018-12-18 03:26:45 +00:00
Joel Einbinder bbaf38311d DevTools: Code Folding 
This adds the ability to collapse sections of code in the Sources and
Network panels.

https://i.imgur.com/CkREJEV.png

Bug: 328431

Change-Id: I88e44d86c7fd2e6dbf076cc734aa538836516cf0
Reviewed-on: https://chromium-review.googlesource.com/c/1014386
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Reviewed-by: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#616885}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 9e5bce11314b18020acc24e078f2ccc723be3867
 2018-12-15 00:05:35 +00:00
Joel Einbinder 05d89d6167 DevTools: Make CodeMirror dark theme behave in shadow dom 
cmdevtools.css was looking for the dark theme class on the body in
order to apply its dark theme. When CodeMirror was attached
in a shadow dom, like in elements panel, this broke.

Bug: 901774
Change-Id: I67eab73721b8ba7642a862220bafa1cb0364146b
Reviewed-on: https://chromium-review.googlesource.com/c/1356231
Reviewed-by: Erik Luo <luoe@chromium.org>
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#612837}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: f778f842b76b239be502ec52538c3f639a93b954
 2018-11-30 23:28:15 +00:00
Erik Luo fa544813dc DevTools: split out consolePrompt.css, fix matching bracket style 
- Splits out prompt styles into consolePrompt.css
- Do not show background/border on matching brackets if the
  CodeMirror container is not focused

Bug: none
Change-Id: I1955e07ca3289a6781097d0c99467c51336403b9
Reviewed-on: https://chromium-review.googlesource.com/1153468
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#579136}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 60fc08c17da4f858739220886c4899ef846cc4bc
 2018-07-30 20:03:54 +00:00
Joel Einbinder d7595c7afb DevTools: Auto pretty print in sources panel experiment 
Change-Id: Ib16be938e7df8c90f02da1211f350d172c34ebff
Reviewed-on: https://chromium-review.googlesource.com/1047949
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#558766}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 6cc4917ff46b654205b4aa1700c049c14d2ebabd
 2018-05-15 17:41:54 +00:00
Joel Einbinder 5d6cc6eeaa DevTools: SourceFrame pretty print improvements 
I extracted out some improvements to inplace pretty print in
SourceFrame from my sources auto pretty print patch.

* Line numbers become blue when pretty print is active
* Selection is properly scrolled into view when pretty print is toggled

Change-Id: Ib1cf8f0a15b8495594ecf121cef8786d8cfd0f16
Reviewed-on: https://chromium-review.googlesource.com/1044878
Commit-Queue: Joel Einbinder <einbinder@chromium.org>
Reviewed-by: Dmitry Gozman <dgozman@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#556318}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: d893a023c6a2ad473795fc680170c2a018eedab3
 2018-05-05 06:29:47 +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