New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 663798 link

Starred by 3 users

Issue metadata

Status: Fixed
Owner:
NOT IN USE
Closed: Nov 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 3
Type: Bug



Sign in to add a comment

svg[viewBox] CSS selector not matching DOM element correctly

Reported by bjank...@gmail.com, Nov 9 2016

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36

Steps to reproduce the problem:
1. Use a CSS attribute selector referencing the viewBox attribute on a SVG element

What is the expected behavior?
The styles applied with a CSS attribute selector referencing the viewBox are applied to the matching DOM element.

What went wrong?
The styles applied with a CSS attribute selector referencing the viewBox are not applied to the matching DOM element.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 54.0.2840.71  Channel: n/a
OS Version: OS X 10.11.5
Flash Version: Shockwave Flash 23.0 r0
 
index.html
691 bytes View Download
Oops, just filed this myself as  Issue #663805 . Whoever is triaging can close one or the other as duplicate.
 Issue 663805  has been merged into this issue.
Labels: Needs-Bisect
Status: Untriaged (was: Unconfirmed)
Cc: sureshkumari@chromium.org
Labels: -Needs-Bisect OS-Linux OS-Windows
Able to reproduce the issue on windows-7, Mac-10.11.6 and Linux Ubuntu-14.04 using 
chrome stable version 54.0.2840.98 and latest canary 56.0.2914.0 with below steps
1.opened Chrome
2.Opened index.html file  
observed that the icon appeared without a red background, which was not noticed in other browser(Firefox).  

This is non-regression issue observed from M-30 # 30.0.1550.0. Hence marking it as Untriaged to get it addressed.
Please find the attached screencast.

Thanks.
Issue-663798.mp4
113 KB View Download

Comment 5 by r...@opera.com, Nov 10 2016

Labels: -OS-Linux -OS-Windows -Pri-2 -OS-Mac OS-All Pri-3
Owner: r...@opera.com
Status: Started (was: Untriaged)

Comment 6 by r...@opera.com, Nov 11 2016

Status: Fixed (was: Started)
Project Member

Comment 7 by bugdroid1@chromium.org, Nov 11 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/b946c5d62ca51dff877a5a1947c62e78756bb38e

commit b946c5d62ca51dff877a5a1947c62e78756bb38e
Author: rune <rune@opera.com>
Date: Fri Nov 11 11:54:59 2016

Match camelCased SVG attributes selectors in html documents.

Attribute names are stored lower-case in stylesheets in HTML documents.
SVG attribute names are normalized to the camelCase form in HTML
documents. That meant SVG attributes with camelCase like viewBox never
matched in HTML documents.

We had the same issue for camelCased element names in [1]. In that CL
we decided to allow insensitive matching for non-html elements in order
to avoid having to store the tag names twice in CSSSelector, even if
that is wrong according to the HTML spec. This CL does exactly the same
for attribute selectors.

[1] https://crrev.com/bab4aa7b9

R=sashab@chromium.org,esprehn@chromium.org
BUG= 663798 

Review-Url: https://codereview.chromium.org/2490393002
Cr-Commit-Position: refs/heads/master@{#431544}

[add] https://crrev.com/b946c5d62ca51dff877a5a1947c62e78756bb38e/third_party/WebKit/LayoutTests/svg/css/attribute-selector-expected.txt
[add] https://crrev.com/b946c5d62ca51dff877a5a1947c62e78756bb38e/third_party/WebKit/LayoutTests/svg/css/attribute-selector.svg
[add] https://crrev.com/b946c5d62ca51dff877a5a1947c62e78756bb38e/third_party/WebKit/LayoutTests/svg/css/viewBox-attribute-selector.html
[modify] https://crrev.com/b946c5d62ca51dff877a5a1947c62e78756bb38e/third_party/WebKit/Source/core/css/SelectorChecker.cpp
[modify] https://crrev.com/b946c5d62ca51dff877a5a1947c62e78756bb38e/third_party/WebKit/Source/core/dom/Attribute.h

Sign in to add a comment