Bug Tracker

#13794 closed bug (wontfix)

Opened April 19, 2013 06:37PM UTC

Closed April 30, 2014 01:28PM UTC

: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-Types 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.)

Attachments (0)
Change History (10)

Changed April 19, 2013 06:58PM UTC by dmethvin comment:1

owner: → binki
status: new → pending

Probably related to #13378. The :focus selector is buggy on Chrome (WebKit?) and (even worse) the workaround of using document.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

Changed April 19, 2013 07:46PM UTC by timmywil comment:2

Can you check the current master branch also?

Changed April 20, 2013 06:44AM UTC by binki comment:3

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).

Changed April 21, 2013 05:08AM UTC by binki comment:4

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.

Changed April 22, 2013 04:11PM UTC by timmywil comment:5

component: unfiled → selector
priority: undecided → low
status: new → pending

Your test is not using http://code.jquery.com/jquery-git.js

Changed April 23, 2013 02:50PM UTC by binki comment:6

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.

Changed April 29, 2013 03:11PM UTC by dmethvin comment:7

milestone: None → 1.next
status: new → open

Changed June 24, 2013 04:29PM UTC by timmywil comment:8

#14030 is a duplicate of this ticket.

Changed September 16, 2013 08:55PM UTC by m_gol comment:9

milestone: 1.next → 1.next/2.next

Changed April 30, 2014 01:28PM UTC by dmethvin comment:10

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.