Bug 1098939 (shape-outside)

[meta] Implement CSS shape-outside property

NEW
Unassigned

Status

()

enhancement
P2
normal
5 years ago
a month ago

People

(Reporter: igor, Unassigned)

Tracking

(Depends on 2 bugs, Blocks 3 bugs, 6 keywords)

Dependency tree / graph

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [DevRel:P1], )

Attachments

(1 obsolete attachment)

Reporter

Description

5 years ago
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/38.0.2125.122 Safari/537.36

Steps to reproduce:

This bug tracks the overall implementation of the shape outside feature(http://dev.w3.org/csswg/css-shapes/#propdef-shape-outside)
Reporter

Updated

5 years ago
Component: Untriaged → Layout: Floats
Product: Firefox → Core
Assignee: nobody → igor
Comment hidden (offtopic)
Flags: needinfo?(tonikitoo)
Comment hidden (offtopic)
Comment hidden (offtopic)
Blocks: 1242029
Assignee: nobody → tlin
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
Assignee: tlin → nobody
Status: ASSIGNED → NEW
Whiteboard: [parity-webkit][parity-blink]

Updated

3 years ago
Keywords: meta

Updated

3 years ago
Keywords: feature

Updated

3 years ago
Keywords: DevAdvocacy
Whiteboard: [parity-webkit][parity-blink] → [parity-webkit][parity-blink][DevRel:P1]
Assignee: nobody → tlin
Status: NEW → ASSIGNED
Summary: [META][CSS Shapes] Implement shape-outside → Implement CSS shape-outside property
Depends on: 1274835
https://reviewboard.mozilla.org/r/54228/#review51418

::: layout/style/nsCSSPropList.h:3705
(Diff revision 1)
> +CSS_PROP_DISPLAY(
> +    shape-outside,
> +    shape_outside,
> +    ShapeOutside,
> +    CSS_PROPERTY_PARSE_VALUE |
> +        CSS_PROPERTY_VALUE_PARSER_FUNCTION,

Perhaps you'll need CSS_PROPERTY_APPLIES_TO_FIRST_LETTER here to apply to floating first-letter.
Flags: platform-rel?
platform-rel: --- → ?
Depends on: 1288626
Attachment #8755323 - Attachment is obsolete: true
Depends on: 1289049
Depends on: 1291110
Depends on: 435426
Priority: -- → P2
Based on IRC discussion with Xidorn, attr() support should not block the implementation of shape-outside.
No longer depends on: 435426
Depends on: 1309467
Depends on: 1311244
Depends on: 1316549
Turn this into a meta bug.
Alias: shape-outside
Assignee: tlin → nobody
Status: ASSIGNED → NEW
Summary: Implement CSS shape-outside property → [meta] Implement CSS shape-outside property
Depends on: 1326406
Depends on: 1326407
Depends on: 1326409
Depends on: 1328236
Depends on: 1332180
Depends on: 1334227
platform-rel: ? → ---
As all main values of shape-outside are implemented now, I think it's time to at least enable it by default on Nightly and DevEdition. What do you think, Ting-Yu?

Sebastian
Flags: needinfo?(tlin)
Depends on: 1353631
Re comment 9:

I filed bug 1353631 to track all the bugs that needs to fixed before enabling shape-outside on Nightly and Aurora. We still need animation support for <basic-shape> (bug 1289049).

> As all main values of shape-outside are implemented now

Not really. We still lack "shape-outside: <image>" support, which might not block enabling on Nightly and Aurora, but it definitely blocks shipping. To implement it, we need to fix bug 1265343. 

In general, shape-outside more or less makes stylo harder to ship because we need to support those CSS properties in servo as well, and I'll need to do them twice (once in gecko and once in servo). Given that, I might postpone doing them until we enable stylo on Nightly so that I only need to implement them once.
Flags: needinfo?(tlin)

Comment 11

2 years ago
Yeah, WebKit&blink supported shape-outside: <image>.
(In reply to Ting-Yu Lin [:TYLin] (UTC+8) from comment #10)
> Re comment 9:
> 
> I filed bug 1353631 to track all the bugs that needs to fixed before
> enabling shape-outside on Nightly and Aurora.

Great, thanks!

> > As all main values of shape-outside are implemented now
> 
> Not really. We still lack "shape-outside: <image>" support, which might not
> block enabling on Nightly and Aurora, but it definitely blocks shipping. To
> implement it, we need to fix bug 1265343. 
> 
> In general, shape-outside more or less makes stylo harder to ship because we
> need to support those CSS properties in servo as well, and I'll need to do
> them twice (once in gecko and once in servo). Given that, I might postpone
> doing them until we enable stylo on Nightly so that I only need to implement
> them once.

(In reply to percyley from comment #11)
> Yeah, WebKit&blink supported shape-outside: <image>.

I can't test WebKit, but as far as I can see, Blink parses "shape-outside: <image>" and shape-image-threshold but doesn't actually implement them. See http://codepen.io/team/css-tricks/pen/fbe5379f499f072e55fa1e4fbab5c8d5 or http://codepen.io/anon/pen/YZMxVP.

Sebastian

Comment 13

2 years ago
@Sebastian There is a problem with the first test case, which must contain a transparent region.

Please test this: http://codepen.io/AmeliaBR/pen/DgrCo

and http://hansmuller-webkit.blogspot.com/2013/11/css-shapes-from-images.html

The second example is the PNG image problem, use this: https://img.alicdn.com/tfs/TB1baHDQpXXXXX9XVXXXXXXXXXX-406-406.png
Ah, thank you! The second one was obviously my fault, should have been like http://codepen.io/anon/pen/qrGZgR. The second one came from https://css-tricks.com/almanac/properties/s/shape-outside/.

Sebastian
No longer blocks: 1265343
Depends on: 1265343
Depends on: 1404222
Depends on: 1404243
Depends on: 1418224
Depends on: 1430734
Assignee: nobody → bwerth
Depends on: 1454694
Mass bug change to replace various 'parity' whiteboard flags with the new canonical keywords. (See bug 1443764 comment 13.)
Whiteboard: [parity-webkit][parity-blink][DevRel:P1] → [DevRel:P1]
Depends on: 1457297

Updated

a year ago
Depends on: 1463745
Depends on: 1466231
Depends on: 1504387
Depends on: 1514267

Taking myself off now that Ting-Yu has returned to implementing the feature.

Assignee: bwerth → nobody
Type: defect → enhancement
You need to log in before you can comment on or make changes to this bug.