Bug 160566 – Web Inspector: UI polish for Edit Breakpoint dialog

• Status: RESOLVED
• Resolution: FIXED
• Component: Web Inspector

[Matt Baker]

Created attachment 285359 [details]
[Image] Clipped condition field

The add/remove action buttons should be simplified and their positions swapped (add should be first, then remove) to match Xcode 8. Also, the condition field should update its width when the popover width changes. Currently the CodeMirror input is clipped by ~40px when the popover resizes (see screenshot).

Steps to Reproduce:
1. Edit Breakpoint
2. Type stuff in condition field until cursor scrolls
  => Padding looks good!
3. Add an action
  => Popover width changes, condition field becomes wider, but editable portion stays the same width.

[Radar WebKit Bug Importer]

<rdar://problem/27706378>

[Matt Baker]

Created attachment 285360 [details]
[Patch] Proposed Fix

[Timothy Hatcher]

Comment on attachment 285360 [details]
[Patch] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=285360&action=review

> Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css:74
> +    width: 360px; /* NOTE: Fixed value, manually tuned to .edit-breakpoint-popover-content width. */

Could this be a calc() instead?

[Matt Baker]

Comment on attachment 285360 [details]
[Patch] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=285360&action=review

>> Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css:74
>> +    width: 360px; /* NOTE: Fixed value, manually tuned to .edit-breakpoint-popover-content width. */
> 
> Could this be a calc() instead?

I tried calc initially, but had some issues. I'll try again before landing.

[WebKit Commit Bot]

Comment on attachment 285360 [details]
[Patch] Proposed Fix

Clearing flags on attachment: 285360

Committed r204152: <http://trac.webkit.org/changeset/204152>

[WebKit Commit Bot]

All reviewed patches have been landed.  Closing bug.