Bug 131500 - Web Inspector: Breakpoint in gutter has clipped / broken border image.
Summary: Web Inspector: Breakpoint in gutter has clipped / broken border image.
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: zalan
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2014-04-10 11:32 PDT by Joseph Pecoraro
Modified: 2014-04-10 16:59 PDT (History)
10 users (show)

See Also:


Attachments
[IMAGE] Issue (282.00 KB, image/png)
2014-04-10 11:32 PDT, Joseph Pecoraro
no flags Details
Test reduction (3.04 KB, text/html)
2014-04-10 12:20 PDT, zalan
no flags Details
Patch (7.14 KB, patch)
2014-04-10 13:39 PDT, zalan
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Joseph Pecoraro 2014-04-10 11:32:30 PDT
Created attachment 229061 [details]
[IMAGE] Issue

* SUMMARY
See attached screenshot. Broken breakpoint tip in gutter.

* STEPS TO REPRODUCE
1. Load <http://bogojoker.com/shell/> in Safari
2. Set a breakpoint on easySlider.min.js:56:21
  => broken breakpoint icon in gutter
Comment 1 Joseph Pecoraro 2014-04-10 11:33:04 PDT
CSS for this is:

  border-image-source: -webkit-image-set(url(../Images/Breakpoint.png) 1x, url(../Images/Breakpoint@2x.png) 2x);
Comment 2 Joseph Pecoraro 2014-04-10 11:40:31 PDT
Looks like this was caused by:
<http://trac.webkit.org/changeset/166925>

NOTE: This is a non-retina (1x) machine.
Comment 3 zalan 2014-04-10 11:43:15 PDT
I can repro it on 2x display. It looks terrible.
Comment 4 Joseph Pecoraro 2014-04-10 11:43:30 PDT
More accurately the CSS is:

    .text-editor > .CodeMirror .has-breakpoint .CodeMirror-linenumber::before {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: -7px;
        content: "";
        z-index: -2;
        border-image-source: -webkit-image-set(url(../Images/BreakpointInactive.png) 1x, url(../Images/BreakpointInactive@2x.png) 2x);
        border-image-slice: 3 7 3 3 fill;
        border-width: 3px 7px 3px 3px;
    }
Comment 5 zalan 2014-04-10 12:20:22 PDT
Created attachment 229069 [details]
Test reduction
Comment 6 zalan 2014-04-10 13:39:24 PDT
Created attachment 229076 [details]
Patch
Comment 7 Joseph Pecoraro 2014-04-10 13:41:08 PDT
Comment on attachment 229076 [details]
Patch

r=me, Thanks!
Comment 8 WebKit Commit Bot 2014-04-10 15:10:14 PDT
Comment on attachment 229076 [details]
Patch

Clearing flags on attachment: 229076

Committed r167090: <http://trac.webkit.org/changeset/167090>
Comment 9 WebKit Commit Bot 2014-04-10 15:10:19 PDT
All reviewed patches have been landed.  Closing bug.
Comment 10 Radar WebKit Bug Importer 2014-04-10 16:55:57 PDT
<rdar://problem/16585860>
Comment 11 Radar WebKit Bug Importer 2014-04-10 16:59:19 PDT
<rdar://problem/16585859>