Opened 10 years ago
Closed 9 years ago
#13794 closed bug (wontfix)
:focus pseudo selector does not work/broken for application/xhtml+xml with iOS-6.1.3, chrome-28.0.1483.0 canary (webkit in general?)
Reported by: | binki | Owned by: | binki |
---|---|---|---|
Priority: | low | Milestone: | 1.next/2.next |
Component: | selector | Version: | 1.9.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Ticket #10569 discusses this problem of a non-working :focus but does not completely address every aspect of it.
On webpages served with Content-Type: application/xhtml+xml
, selecting elements with jQuery(':focus')
breaks at least on iOS-6.1.3 and chrome-28.0.1483.0 canary. This same code successfully filters for focused elements on Mozilla (seamonkey-2.17.1). Also, this selector works fine on webkit when used in CSS rules.
I have written a quick small page to allow comparison. http://cdn.ohnopub.net/cdn/binki/jquery-1.9.1-webkit-focus/ links to http://cdn.ohnopub.net/cdn/binki/jquery-1.9.1-webkit-focus/focus.html and http://cdn.ohnopub.net/cdn/binki/jquery-1.9.1-webkit-focus/focus.xhtml which are byte-per-byte identical but respectively served with Content-Type
s of text/html
and application/xhtml+xml
. In the latter page, failure of jQuery(':focus')
to select any elements is seen with the aforementioned webkit browsers. Yet,the ability of the :focus
CSS selector to define rules for focused elements in all mentioned browsers is demonstrated. Both pages behave identically on Mozilla-based browsers.
Thus, jQuery(':focus')
behaves differently between two modern and accepted browser platforms (webkit and mozilla) for Content-Type: application/xhtml+xml
.
(Concerning style and performance: In my test page, I use jQuery(':focus')
for simplicity. I would normally use .is(':focus')
or include :focus
at the end of a larger selector expression. In fact, it was while trying to use :focus
that way when I stumbled upon this bug, so the above is just a simplified repro. I do not think that jsfiddle.net or jsbin.com let me set the Content-Type
to other than text/html
, so that is why I do not use either of those services to demonstrate this bug; if I am wrong, please point me to the relevant documentation. Bug also exists in jquery-1.8.3.)
Change History (10)
comment:1 Changed 10 years ago by
Owner: | set to binki |
---|---|
Status: | new → pending |
comment:3 Changed 10 years ago by
Status: | pending → new |
---|
http://cdn.ohnopub.net/cdn/binki/jquery-2.0.0-1-gebecdac-webkit-focus/ uses jQuery master (locked into revision ebecdac from 2013-04-18) and behaves exactly the same on chrome and iOS, working with text/html
but not application/xhtml+xml
. Mozilla still works fine with it in both cases.
It would be really nice if jQuery(':focus')
behaved the same (and as documented) on webkit browsers. I think jQuery is the place to put this cross-browser support code, especially as jQuery is meant to smooth out such browser differences. I think I can, for pragmatic and practical purposes, get away with using document.activeElement
as IE is not targeted in any way by my project (but I am going to test that later, just posting the results of my jquery master branch check).
comment:4 Changed 10 years ago by
Do a hard refresh on my bug reproduction URIs to see that I added document.activeElement to the tests. Windows Chrome and iOS-1.6.3 both disabled document.activeElement for application/xhtml+xml
: for XHTML, that property is undefined
. I guess they’re trying to be more “strict” than Mozilla is, as it seems that document.activeElement isn’t quite yet official... regardless of all the other unofficial HTML features which webkit supports in application/xhtml+xml
.
However, document.querySelector(':focus')
seems to work just fine. I’ll use that as my workaround since it is fully supported by all my targets, even by webkit in application/xhtml+xml
.
comment:5 Changed 10 years ago by
Component: | unfiled → selector |
---|---|
Priority: | undecided → low |
Status: | new → pending |
Your test is not using http://code.jquery.com/jquery-git.js
comment:6 Changed 10 years ago by
Status: | pending → new |
---|
The version at http://cdn.ohnopub.net/cdn/binki/jquery-git-webkit-focus has been set up and points to jquery-git.js. Same behavior as before, but now you can test if git fixes this bug without copying the testcase locally and configuring Content-Type
.
comment:7 Changed 10 years ago by
Milestone: | None → 1.next |
---|---|
Status: | new → open |
comment:9 Changed 9 years ago by
Milestone: | 1.next → 1.next/2.next |
---|
comment:10 Changed 9 years ago by
Resolution: | → wontfix |
---|---|
Status: | open → closed |
Windows Chrome and iOS-1.6.3 both disabled document.activeElement for application/xhtml+xml: for XHTML, that property is undefined.
I think that is more an indictment of XHTML than a bug in jQuery, but either way this is esoteric enough that we're unlikely to find a good fix. Since it is a Webkit-only issue you should report it to them and see if they will fix, which might be relatively quick given their release pace nowadays.
Probably related to #13378. The
:focus
selector is buggy on Chrome (WebKit?) and (even worse) the workaround of usingdocument.activeElement
throws a JavaScript error in IE9. So we're screwed either way trying to process:focus
cross-browser. For your specific situation are you able to use$(document.activeElement)
in place of$(":focus")
? I have no idea whether that works in XML+XHTML