Bug 154099 - Focus rings around text fields do not follow contour (border-radius)
Summary: Focus rings around text fields do not follow contour (border-radius)
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: zalan
URL:
Keywords: InRadar
: 69195 (view as bug list)
Depends on:
Blocks:
 
Reported: 2016-02-10 19:16 PST by zalan
Modified: 2016-03-12 09:24 PST (History)
6 users (show)

See Also:

Attachments
WIP (17.04 KB, patch)
2016-02-22 11:08 PST, zalan 		no flags Details | Formatted Diff | Diff
outline-offset: 20px (44.34 KB, image/png)
2016-02-22 11:14 PST, zalan 		no flags Details
Outline-offset: 3px (41.71 KB, image/png)
2016-02-22 11:14 PST, zalan 		no flags Details
outline-offset: 10px -multiline (58.92 KB, image/png)
2016-02-22 11:15 PST, zalan 		no flags Details
Patch (36.83 KB, patch)
2016-03-11 17:53 PST, zalan 		no flags Details | Formatted Diff | Diff
Patch (37.77 KB, patch)
2016-03-12 08:29 PST, zalan 		no flags Details | Formatted Diff | Diff
Show Obsolete (2) View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description zalan 2016-02-10 19:16:05 PST 
outline: auto painting (focusring) should follow the curve of border-radius.
Comment 1 zalan 2016-02-22 11:08:00 PST 
Created attachment 271930 [details]
WIP
Comment 2 zalan 2016-02-22 11:14:13 PST 
Created attachment 271932 [details]
outline-offset: 20px
Comment 3 zalan 2016-02-22 11:14:36 PST 
Created attachment 271933 [details]
Outline-offset: 3px
Comment 4 zalan 2016-02-22 11:15:01 PST 
Created attachment 271934 [details]
outline-offset: 10px -multiline
Comment 5 Tim Horton 2016-03-04 12:06:46 PST 
Comment on attachment 271930 [details]
WIP

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

> Source/WebCore/platform/graphics/PathUtilities.cpp:394
> +    static const float gCircleControlPoint = 0.447715f;

g :| This should probably mention where it came from. Or, even better, expose it on Path. Or something.
Comment 6 zalan 2016-03-11 17:53:02 PST 
Created attachment 273790 [details]
Patch
Comment 7 Tim Horton 2016-03-11 17:59:30 PST 
Comment on attachment 273790 [details]
Patch

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

> Source/WebCore/platform/graphics/PathUtilities.h:40
> +    static Path pathWithShrinkWrappedRectsForOutline(const Vector<FloatRect>&, const BorderData&, float outlineOffset, bool leftToRightWritingMode, bool horizontalWritingMode);

Do we not have nice enums for the bools?

> LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-horizontal-ltr.html:8
> + 	color: RGBA(0, 0, 0, 0);

I think people usually write rgba() not RGBA()

> LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-horizontal-ltr.html:18
> +    outline-offset: 0px;

Twice?

> LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-ltr.html:19
> +    outline-offset: 0px;

Again

> LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-ltr.html:25
> +    border-radius: 15px 4px 8px 5px;

Indentation is broken here

> LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-rtl.html:8
> + 	font-size: 20px;

Indentation again?
Comment 8 zalan 2016-03-12 08:29:58 PST 
Created attachment 273836 [details]
Patch
Comment 9 zalan 2016-03-12 08:30:48 PST 
rdar://problem/9988429
Comment 10 zalan 2016-03-12 08:30:59 PST 
(In reply to comment #7)
> Comment on attachment 273790 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=273790&action=review
> 
> > Source/WebCore/platform/graphics/PathUtilities.h:40
> > +    static Path pathWithShrinkWrappedRectsForOutline(const Vector<FloatRect>&, const BorderData&, float outlineOffset, bool leftToRightWritingMode, bool horizontalWritingMode);
> 
> Do we not have nice enums for the bools?
> 
> > LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-horizontal-ltr.html:8
> > + 	color: RGBA(0, 0, 0, 0);
> 
> I think people usually write rgba() not RGBA()
> 
> > LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-horizontal-ltr.html:18
> > +    outline-offset: 0px;
> 
> Twice?
> 
> > LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-ltr.html:19
> > +    outline-offset: 0px;
> 
> Again
> 
> > LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-ltr.html:25
> > +    border-radius: 15px 4px 8px 5px;
> 
> Indentation is broken here
> 
> > LayoutTests/fast/inline/hidpi-outline-auto-with-border-radius-vertical-rtl.html:8
> > + 	font-size: 20px;
> 
> Indentation again?
Done.
Comment 11 zalan 2016-03-12 08:31:33 PST 
*** Bug 69195 has been marked as a duplicate of this bug. ***
Comment 12 WebKit Commit Bot 2016-03-12 09:24:10 PST 
Comment on attachment 273836 [details]
Patch

Clearing flags on attachment: 273836

Committed r198062: <http://trac.webkit.org/changeset/198062>
Comment 13 WebKit Commit Bot 2016-03-12 09:24:13 PST 
All reviewed patches have been landed.  Closing bug.