Closed
Bug 1367657
Opened 7 years ago
Closed 7 years ago
CSS selector is matching twice. <svg> and <use> elements in SVG
Categories
(Core :: SVG, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 265894
People
(Reporter: karlcow, Assigned: u459114)
References
Details
(Whiteboard: [webcompat])
This is a spin off of a Webcompat issue. https://webcompat.com/issues/6829 I also wonder if it's a duplicate of Bug 265894 This is happening on the site http://m.nouvelobs.com/en-direct/a-chaud.html There is an arrow widget under the tag to expose more tags. The orientation of the arrow is wrong. The markup is: ```html <div class="tags activ"> <h2>#Temps forts</h2> <span> <a href="?highlight=1" title="Essentiels">#Essentiels</a> <a href="?hashtag=manchester" title="manchester">#manchester</a> <!-- etc. --> </span> <button class="js-expand"> <svg> <use xlink:href="/themes/svg/nobstr-common.svg#svg-picto-arrow-top"></use> </svg> </button> </div> ``` The minimized state doesn't have the `activ` value. ```html <div class="tags"> </div> ``` Somehow the `transform` is not happening on the SVG. ```css #mobs-home-live .tags button svg { width: 10px; height: 10px; -webkit-transform: rotate(180deg); transform: rotate(180deg); pointer-events: none; -webkit-transform-origin: center center; transform-origin: center center; } ``` ```css #mobs-home-live .tags.activ button svg { -webkit-transform: rotate(0deg); transform: rotate(0deg); } ``` On the webcompat issue it is being said that the CSS rule is matching twice and applies a rotation of rotate(180deg) + rotate(180deg) so it comes back to its original state.
Reporter | ||
Updated•7 years ago
|
Flags: webcompat?
Whiteboard: [webcompat]
I will start from the test case in Bug 265894. The test case in that bug failed even if enable stylo
Example: https://codepen.io/cku/pen/BZyMxZ
1. Implement is_in_svg_shadow_tree of element in stylo 2. In matches_complex_selector_internal, create a special Combinator::Child & Combinator::Descendant rule for element in use shadow tree. If the element we want to match is in use shadow tree, parent lookup path should upto use element only.
Status: NEW → RESOLVED
Closed: 7 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•