New issue
Advanced search Search tips

Issue 663805 link

Starred by 1 user

Issue metadata

Status: Duplicate
Merged: issue 663798
Owner: ----
Closed: Nov 2016
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Compat



Sign in to add a comment

CSS selector matching / querySelector doesn't match mixed case SVG attributes

Reported by amelia.b...@gmail.com, Nov 9 2016

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36

Example URL:
http://codepen.io/AmeliaBR/pen/qqOoKy

Steps to reproduce the problem:
1. Use inline SVG in HTML including an element with mixed case attributes.
2. Use attribute selectors to either assign CSS rules to that element or to select it via the querySelector / querySelectorAll API.

What is the expected behavior?
The selector should match when the casing matches the canonical form for the attribute, and maybe also when it matches in a case insensitive way.

What went wrong?
Neither the correct mixed/camelCase version, nor the all lowercase version of the attribute name, select anything.

This is an less common case of a long-standing bug (#237435) that previously also affected camelCase tag names.  The fix for tag names was committed in May 2015, but relies on automatic down-casing of all CSS selectors in an HTML document, and then comparison against stored lowercase versions of tag names.  The same lowercasing of compared values does not seem to be applied to attribute names.

Does it occur on multiple sites: N/A

Is it a problem with a plugin? N/A 

Did this work before? N/A 

Does this work in other browsers? N/A

Chrome version: 54.0.2840.71  Channel: n/a
OS Version: 10.0
Flash Version: Shockwave Flash 23.0 r0

Works in Firefox, MS Edge, and even Safari 10 (despite WebKit formerly having the same issue as Chrome with mixed-case tags).
 
See also the simultaneously posted  Issue #663798 .

Mergedinto: 663798
Status: Duplicate (was: Unconfirmed)

Sign in to add a comment