1003294 - [WebComponents] Inconsistent rendering with scoped style in shadow dom

Status: RESOLVED FIXED

(Core :: DOM: Core & HTML, defect)

Description

[Yan Or]

Attachment: demo.html

When using imported scoped stylesheet inside template, elements inside shadow dom sometimes aren't rendered correctly.

This does not happen with inline styles.

Sample code attached with video showing inconsistent rendering on repeat page refresh.

Comment 1

[Yan Or]

Attachment: blue.css

Comment 2

[Yan Or]

Attachment: red.css

Comment 3

[Yan Or]

Attachment: Video

Comment 4

[Yan Or]

Comment on attachment 8414610 [details]
Video

https://www.youtube.com/watch?v=CSUfBdFNQpg&feature=youtu.be

Comment 5

[Olli Pettay [:smaug][[e-mail]]]

Is the plan even to support <style scoped>?
See also https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/R1x18ZLS5qQ

Comment 6

[Yan Or]

Attachment: demo.html

Comment 7

[Yan Or]

(In reply to Olli Pettay [:smaug] from comment #5)
> Is the plan even to support <style scoped>?
> See also
> https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/R1x18ZLS5qQ

The same behavior is observed without "scoped".

Comment 8

[Jonas Sicking (:sicking) No longer reading bugmail consistently]

As far as I know we already have scoped stylesheets implemented.

Comment 9

[Yan Or]

Also, as I've mentioned before, we observed the same behavior even without scoped.

Comment 10

[William Chen [:wchen]]

I've got a fix for this locally. The problem here is related to @import not working in ShadowRoot due the style sheet not being put into the document.

Comment 11

[SUN Haitao]

It seems that Bug 997173 is on the same problem. Is there anyone can confirm whether I  	
mark that as duplicate?

Comment 12

[Yan Or]

(In reply to SUN Haitao from comment #11)
> It seems that Bug 997173 is on the same problem. Is there anyone can confirm
> whether I  	
> mark that as duplicate?

Yup.  It's the same problem.

William, any idea when the fix will be ready?

Comment 14

[Andrew Overholt [:overholt]]

William told me that one of the patches in bug 992521 will fix this issue.

Comment 15

[Cameron McCormack (:heycam)]

Not sure the patches in that bug will make <style scoped> as a child of ShadowTree work as you'd expect.  Various bits of the scoped style sheet code expects the scope to be an Element (the ElementIsStyleScopeRoot flag is on Element, the array on TreeMatchContext is an array of Elements, etc.).

Comment 16

[Cameron McCormack (:heycam)]

(But that might not be the exact issue here.)  Patches in bug 1017798 should help with some aspects of scoped style interacting with shadow trees.

Comment 17

[SUN Haitao]

The testcases in this and Bug 997173 both work fine on my box now. Could this be closed?

Comment 18

[Andrew Overholt [:overholt]]

Seems like this is fixed now (and createShadowRoot isn't what we're going to implement).