Bug 168044 - Apply SVG styles paint-order, stroke-linejoin, and stroke-linecap on DOM text.
Summary: Apply SVG styles paint-order, stroke-linejoin, and stroke-linecap on DOM text.
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebCore Misc. (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Per Arne Vollan
URL:
Keywords: InRadar, WebExposed
Depends on:
Blocks:
 
Reported: 2017-02-09 03:42 PST by Per Arne Vollan
Modified: 2017-02-23 00:48 PST (History)
12 users (show)

See Also:


Attachments
Patch (6.53 KB, patch)
2017-02-09 03:53 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (9.86 KB, patch)
2017-02-09 06:41 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (11.37 KB, patch)
2017-02-13 02:37 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (14.32 KB, patch)
2017-02-13 05:50 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (14.42 KB, patch)
2017-02-13 07:05 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews124 for ios-simulator-wk2 (9.52 MB, application/zip)
2017-02-13 10:21 PST, Build Bot
no flags Details
Patch (14.09 KB, patch)
2017-02-14 03:30 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews124 for ios-simulator-wk2 (834.04 KB, application/zip)
2017-02-14 04:52 PST, Build Bot
no flags Details
Patch (15.28 KB, patch)
2017-02-14 05:19 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (225.99 KB, patch)
2017-02-15 05:40 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews101 for mac-elcapitan (1.97 MB, application/zip)
2017-02-15 06:31 PST, Build Bot
no flags Details
Archive of layout-test-results from ews104 for mac-elcapitan-wk2 (1.69 MB, application/zip)
2017-02-15 06:35 PST, Build Bot
no flags Details
Archive of layout-test-results from ews113 for mac-elcapitan (2.42 MB, application/zip)
2017-02-15 06:39 PST, Build Bot
no flags Details
Archive of layout-test-results from ews126 for ios-simulator-wk2 (4.31 MB, application/zip)
2017-02-15 07:01 PST, Build Bot
no flags Details
Patch (35.84 KB, patch)
2017-02-16 09:20 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (53.68 KB, patch)
2017-02-17 08:01 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff
Patch (65.39 KB, patch)
2017-02-17 08:44 PST, Per Arne Vollan
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Per Arne Vollan 2017-02-09 03:42:35 PST
This is needed for rendering of video subtitles.
Comment 1 Per Arne Vollan 2017-02-09 03:53:55 PST
Created attachment 301028 [details]
Patch
Comment 2 WebKit Commit Bot 2017-02-09 03:55:41 PST
Attachment 301028 [details] did not pass style-queue:


ERROR: Source/WebCore/ChangeLog:10:  You should remove the 'No new tests' and either add and list tests, or explain why no new tests were possible.  [changelog/nonewtests] [5]
Total errors found: 1 in 6 files


If any of these errors are false positives, please file a bug against check-webkit-style.
Comment 3 Per Arne Vollan 2017-02-09 06:41:28 PST
Created attachment 301031 [details]
Patch
Comment 4 Per Arne Vollan 2017-02-09 08:30:21 PST
(In reply to comment #3)
> Created attachment 301031 [details]
> Patch

I will add test(s).
Comment 5 Myles C. Maxfield 2017-02-09 20:12:40 PST
Comment on attachment 301031 [details]
Patch

Removing the "r?" until there are tests.
Comment 6 Per Arne Vollan 2017-02-13 02:37:58 PST
Created attachment 301339 [details]
Patch
Comment 7 Per Arne Vollan 2017-02-13 05:50:00 PST
Created attachment 301348 [details]
Patch
Comment 8 Build Bot 2017-02-13 07:05:33 PST
Comment on attachment 301348 [details]
Patch

Attachment 301348 [details] did not pass ios-sim-ews (ios-simulator-wk2):
Output: http://webkit-queues.webkit.org/results/3077856

New failing tests:
fast/css/paint-order.html
Comment 9 Per Arne Vollan 2017-02-13 07:05:51 PST
Created attachment 301352 [details]
Patch
Comment 10 Eric Carlson 2017-02-13 07:28:01 PST
Comment on attachment 301352 [details]
Patch

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

> Source/WebCore/page/CaptionUserPreferencesMediaAF.cpp:442
> +        String css = cssPropertyWithTextEdgeColor(CSSPropertyWebkitTextStroke, strokeWidth(), color, behavior == kMACaptionAppearanceBehaviorUseValue);
> +        css.append(" paint-order: stroke;");
> +        css.append(" stroke-linejoin: round;");
> +        css.append(" stroke-linecap: round;");

A String is immutable to String.append() is extremely inefficient. You should use a StringBuilder for this.

> Source/WebCore/rendering/InlineTextBox.cpp:606
> +    

Nit: please delete this added whitespace (if you use Xcode to edit source files, you should enable automatic whitespace trimming in Preferences -> TextEditing).

> Source/WebCore/rendering/InlineTextBox.cpp:609
> +        

Ditto.

> Source/WebCore/rendering/InlineTextBox.cpp:616
> +                

Ditto.

> Source/WebCore/rendering/InlineTextBox.cpp:636
> +    

Ditto.
Comment 11 Build Bot 2017-02-13 10:21:08 PST
Comment on attachment 301352 [details]
Patch

Attachment 301352 [details] did not pass ios-sim-ews (ios-simulator-wk2):
Output: http://webkit-queues.webkit.org/results/3078481

New failing tests:
fast/css/paint-order.html
Comment 12 Build Bot 2017-02-13 10:21:12 PST
Created attachment 301359 [details]
Archive of layout-test-results from ews124 for ios-simulator-wk2

The attached test failures were seen while running run-webkit-tests on the ios-sim-ews.
Bot: ews124  Port: ios-simulator-wk2  Platform: Mac OS X 10.11.6
Comment 13 Myles C. Maxfield 2017-02-13 16:42:48 PST
I'll be happy to review this when EWS is all green.
Comment 14 Per Arne Vollan 2017-02-14 03:30:11 PST
Created attachment 301482 [details]
Patch
Comment 15 Build Bot 2017-02-14 04:52:04 PST
Comment on attachment 301482 [details]
Patch

Attachment 301482 [details] did not pass ios-sim-ews (ios-simulator-wk2):
Output: http://webkit-queues.webkit.org/results/3100374

New failing tests:
fast/css/paint-order.html
Comment 16 Build Bot 2017-02-14 04:52:07 PST
Created attachment 301486 [details]
Archive of layout-test-results from ews124 for ios-simulator-wk2

The attached test failures were seen while running run-webkit-tests on the ios-sim-ews.
Bot: ews124  Port: ios-simulator-wk2  Platform: Mac OS X 10.11.6
Comment 17 Per Arne Vollan 2017-02-14 05:19:06 PST
Created attachment 301488 [details]
Patch
Comment 18 Per Arne Vollan 2017-02-14 07:47:50 PST
(In reply to comment #10)
> Comment on attachment 301352 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=301352&action=review
> 
> > Source/WebCore/page/CaptionUserPreferencesMediaAF.cpp:442
> > +        String css = cssPropertyWithTextEdgeColor(CSSPropertyWebkitTextStroke, strokeWidth(), color, behavior == kMACaptionAppearanceBehaviorUseValue);
> > +        css.append(" paint-order: stroke;");
> > +        css.append(" stroke-linejoin: round;");
> > +        css.append(" stroke-linecap: round;");
> 
> A String is immutable to String.append() is extremely inefficient. You
> should use a StringBuilder for this.
> 
> > Source/WebCore/rendering/InlineTextBox.cpp:606
> > +    
> 
> Nit: please delete this added whitespace (if you use Xcode to edit source
> files, you should enable automatic whitespace trimming in Preferences ->
> TextEditing).
> 
> > Source/WebCore/rendering/InlineTextBox.cpp:609
> > +        
> 
> Ditto.
> 
> > Source/WebCore/rendering/InlineTextBox.cpp:616
> > +                
> 
> Ditto.
> 
> > Source/WebCore/rendering/InlineTextBox.cpp:636
> > +    
> 
> Ditto.

Thanks for reviewing :) Updated patch.
Comment 19 Eric Carlson 2017-02-14 08:00:52 PST
Comment on attachment 301488 [details]
Patch

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

Someone that knows more about text rendering should review this.

> Source/WebCore/rendering/InlineTextBox.cpp:581
> +    case PaintOrderMarkers: {
> +        paintDecorations(paintInfo, lineStyle, context, font, combinedText, textRun, textOrigin, boxRect, boxOrigin, textPaintStyle, textShadow, useCustomUnderlines);
> +
> +        textPainter.paintText(textRun, length, boxRect, textOrigin, selectionStart, selectionEnd, paintSelectedTextOnly, paintSelectedTextSeparately);
> +        break;
> +    }

Nit: are these braces necessary?

> Source/WebCore/rendering/InlineTextBox.cpp:584
> +    case PaintOrderStrokeMarkers: // FIXME: Implement.
> +    case PaintOrderMarkersStroke : // FIXME: Implement.
> +    case PaintOrderFillMarkers : // FIXME: Implement.

Nit: a "FIXME:" should include a bug number.

> Source/WebCore/rendering/InlineTextBox.cpp:591
> +    default: {
> +        textPainter.paintText(textRun, length, boxRect, textOrigin, selectionStart, selectionEnd, paintSelectedTextOnly, paintSelectedTextSeparately);
>  
> -    textPainter.paintText(textRun, length, boxRect, textOrigin, selectionStart, selectionEnd, paintSelectedTextOnly, paintSelectedTextSeparately);
> +        paintDecorations(paintInfo, lineStyle, context, font, combinedText, textRun, textOrigin, boxRect, boxOrigin, textPaintStyle, textShadow, useCustomUnderlines);
> +    }

Nit: are these braces necessary?
Comment 20 Simon Fraser (smfr) 2017-02-14 16:30:54 PST
Comment on attachment 301488 [details]
Patch

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

> Source/WebCore/ChangeLog:4
> +        https://bugs.webkit.org/show_bug.cgi?id=168044

Radar number?

> Source/WebCore/ChangeLog:8
> +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.

Adding support for it in inline text boxes basically means everywhere, right?

You need to reference https://drafts.fxtf.org/paint/ and say how close you are to that spec.

> Source/WebCore/rendering/InlineTextBox.cpp:554
> +    PaintOrder paintOrder = lineStyle.svgStyle().paintOrder();

You need to move these properties out of svgStyle into RenderStyle now that they are no longer SVG-specific, and you need to fix up CSSProperties.json to remove  "svg": true from the "codegen-properties" for these properties.

> Source/WebCore/rendering/InlineTextBox.cpp:556
> +    switch (paintOrder) {

Does InlineTextBox::paintDecoration() have to change too? You should test that thick strokes and clear fills get shadowed correctly, for example.

> LayoutTests/ChangeLog:10
> +        * fast/css/paint-order.html: Added.
> +        * platform/mac/fast/css/paint-order-expected.txt: Added.
> +        * platform/ios-simulator/fast/css/paint-order-expected.txt: Added.

This needs a crapload of ref tests to make sure it works correctly.
Comment 21 Simon Fraser (smfr) 2017-02-14 16:48:00 PST
rdar://problem/30165746
Comment 22 Per Arne Vollan 2017-02-15 05:40:00 PST
Created attachment 301607 [details]
Patch
Comment 23 Build Bot 2017-02-15 06:31:20 PST
Comment on attachment 301607 [details]
Patch

Attachment 301607 [details] did not pass mac-ews (mac):
Output: http://webkit-queues.webkit.org/results/3121705

Number of test failures exceeded the failure limit.
Comment 24 Build Bot 2017-02-15 06:31:23 PST
Created attachment 301608 [details]
Archive of layout-test-results from ews101 for mac-elcapitan

The attached test failures were seen while running run-webkit-tests on the mac-ews.
Bot: ews101  Port: mac-elcapitan  Platform: Mac OS X 10.11.6
Comment 25 Build Bot 2017-02-15 06:35:06 PST
Comment on attachment 301607 [details]
Patch

Attachment 301607 [details] did not pass mac-wk2-ews (mac-wk2):
Output: http://webkit-queues.webkit.org/results/3121712

Number of test failures exceeded the failure limit.
Comment 26 Build Bot 2017-02-15 06:35:10 PST
Created attachment 301611 [details]
Archive of layout-test-results from ews104 for mac-elcapitan-wk2

The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews.
Bot: ews104  Port: mac-elcapitan-wk2  Platform: Mac OS X 10.11.6
Comment 27 Build Bot 2017-02-15 06:39:36 PST
Comment on attachment 301607 [details]
Patch

Attachment 301607 [details] did not pass mac-debug-ews (mac):
Output: http://webkit-queues.webkit.org/results/3121710

Number of test failures exceeded the failure limit.
Comment 28 Build Bot 2017-02-15 06:39:42 PST
Created attachment 301613 [details]
Archive of layout-test-results from ews113 for mac-elcapitan

The attached test failures were seen while running run-webkit-tests on the mac-debug-ews.
Bot: ews113  Port: mac-elcapitan  Platform: Mac OS X 10.11.6
Comment 29 Build Bot 2017-02-15 07:01:33 PST
Comment on attachment 301607 [details]
Patch

Attachment 301607 [details] did not pass ios-sim-ews (ios-simulator-wk2):
Output: http://webkit-queues.webkit.org/results/3121741

New failing tests:
imported/mozilla/svg/paint-order-02.svg
imported/mozilla/svg/paint-order-03.svg
fast/css/paint-order.html
imported/blink/svg/paintorder/paintorder.svg
imported/blink/svg/paintorder/paintorder-text.svg
Comment 30 Build Bot 2017-02-15 07:01:38 PST
Created attachment 301615 [details]
Archive of layout-test-results from ews126 for ios-simulator-wk2

The attached test failures were seen while running run-webkit-tests on the ios-sim-ews.
Bot: ews126  Port: ios-simulator-wk2  Platform: Mac OS X 10.11.6
Comment 31 Per Arne Vollan 2017-02-15 07:02:55 PST
(In reply to comment #20)
> Comment on attachment 301488 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=301488&action=review
> 

Thanks for reviewing, I will update the patch :)

> > Source/WebCore/ChangeLog:8
> > +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.
> 
> Adding support for it in inline text boxes basically means everywhere, right?
> 

There is also painting of text in SimpleLineLayoutFunctions.cpp (paintFlow), but it seems this is used for text in block elements. According to https://drafts.fxtf.org/paint/, the properties should be applied on inline boxes, but perhaps we also should change the paintFlow function?
Comment 32 zalan 2017-02-15 07:52:27 PST
> > Adding support for it in inline text boxes basically means everywhere, right?
> > 
> 
> There is also painting of text in SimpleLineLayoutFunctions.cpp (paintFlow),
> but it seems this is used for text in block elements.
so as InlineTextBox.
The "inline" part in the InlineTextBox name does not refer to inline-level elements/inline boxes. We also generate InlineTextBoxes for the content of block elements.
This painting logic looks to be at the wrong place and should be moved out of the inline tree context.

>According to
> https://drafts.fxtf.org/paint/, the properties should be applied on inline
> boxes, but perhaps we also should change the paintFlow function?
Currently simple line layout does not support inline elements, so no, you should not change paintflow.
Comment 33 zalan 2017-02-15 07:55:45 PST
Comment on attachment 301607 [details]
Patch

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

> Source/WebCore/ChangeLog:9
> +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.

As per spec, it's not for inline text boxes but inline boxes! This line is misleading as it suggests we need to apply these properties on the content of block elements as well.
Comment 34 Simon Fraser (smfr) 2017-02-15 13:53:05 PST
> > Source/WebCore/ChangeLog:9
> > +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.
> 
> As per spec, it's not for inline text boxes but inline boxes!

We're actually not sure about this, and are waiting for clarification.

Per, I think you should break this up. First, do the CSS bits, and test with some parsing tests (if there's any behavior change).

Then do the TextPainter changes.

You may also need some new code to handle additional overflow from strokes.
Comment 35 zalan 2017-02-15 14:40:39 PST
(In reply to comment #33)
> Comment on attachment 301607 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=301607&action=review
> 
> > Source/WebCore/ChangeLog:9
> > +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.
> 
> As per spec, it's not for inline text boxes but inline boxes! This line is
> misleading as it suggests we need to apply these properties on the content
> of block elements as well.
So thanks to Simon, it's clear now that these properties should applied to all elements. https://twitter.com/tabatkins/status/831991186487287808
Comment 36 Per Arne Vollan 2017-02-16 08:32:25 PST
(In reply to comment #35)
> (In reply to comment #33)
> > Comment on attachment 301607 [details]
> > Patch
> > 
> > View in context:
> > https://bugs.webkit.org/attachment.cgi?id=301607&action=review
> > 
> > > Source/WebCore/ChangeLog:9
> > > +        Add support for paint-order, stroke-linejoin, and stroke-linecap style for inline text boxes.
> > 
> > As per spec, it's not for inline text boxes but inline boxes! This line is
> > misleading as it suggests we need to apply these properties on the content
> > of block elements as well.
> So thanks to Simon, it's clear now that these properties should applied to
> all elements. https://twitter.com/tabatkins/status/831991186487287808

Thanks for clarifying! I will split the patch into a CSS part and a text painter part.
Comment 37 Per Arne Vollan 2017-02-16 09:20:53 PST
Created attachment 301774 [details]
Patch
Comment 38 Per Arne Vollan 2017-02-16 09:21:53 PST
(In reply to comment #37)
> Created attachment 301774 [details]
> Patch

CSS part.
Comment 39 Simon Fraser (smfr) 2017-02-16 09:49:29 PST
Comment on attachment 301774 [details]
Patch

Don't we also need some subset of the other properties in https://drafts.fxtf.org/paint/, like stroke-width, stroke-color etc? Don't just go by the title of this bug.

Also your test needs to a generic CSS test, for example like fast/css/parsing-object-fit.html, and not be captions-specific.
Comment 40 Simon Fraser (smfr) 2017-02-16 09:50:32 PST
Actually let's agree first on the subset of https://drafts.fxtf.org/paint/ we actually plan to implement here.
Comment 41 Per Arne Vollan 2017-02-17 08:01:13 PST
Created attachment 301933 [details]
Patch
Comment 42 Per Arne Vollan 2017-02-17 08:44:53 PST
Created attachment 301936 [details]
Patch
Comment 43 Per Arne Vollan 2017-02-17 11:10:24 PST
Comment on attachment 301936 [details]
Patch

Thanks for reviewing :)
Comment 44 WebKit Commit Bot 2017-02-17 11:36:31 PST
Comment on attachment 301936 [details]
Patch

Clearing flags on attachment: 301936

Committed r212562: <http://trac.webkit.org/changeset/212562>
Comment 45 WebKit Commit Bot 2017-02-17 11:36:41 PST
All reviewed patches have been landed.  Closing bug.