Side navigation
#12648 closed bug (fixed)
Opened October 03, 2012 10:57PM UTC
Closed October 15, 2012 03:22PM UTC
Can not correctly detect focus for DIVs with contenteditable in Chrome and Safari
Reported by: | Marvin | Owned by: | |
---|---|---|---|
Priority: | high | Milestone: | 1.8.3 |
Component: | selector | Version: | 1.8.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
Related to ticket #12492: The bug there was about textareas and input fields in Chrome and Safari and was fixed in 1.8.2.
The very same bug still (jQuery 1.8.2) exists in div elements with contenteditable="true":
$('#editablediv').is(\\':focus\\')
is always FALSE in Chrome and Safari.
Example: http://jsfiddle.net/YzagR/3/
Attachments (0)
Change History (7)
Changed October 04, 2012 12:03AM UTC by comment:1
Changed October 04, 2012 12:29AM UTC by comment:2
Updated fiddle: http://jsfiddle.net/YzagR/5/
If you click into the div, note the values. Then click to another tab and click back, note that the values are different. This seems like an inconsistency with the :focus
selector in qSA and mS.
Changed October 05, 2012 10:08AM UTC by comment:3
dmethvin, you are right: qSA and mS behave inconsistently. It depends if you switch focus by clicking on elements *within* the same page or if you click on another page/application and then click on an element.
But I think this is another issue, and probably an issue for the Webkit developers, because it does not occur on Firefox or Opera.
My issue is only about how to detect if a specific div has focus when the user clicks around on the same webpage. This is important for many web applications, especially for my current project, a rich text email writer webapp.
is(':active') works on all platform in 1.8.2, but not is(':focus').
I analized the problem on different browsers (mobile and desktop). The focus tests should always return "true", but they do not:
||<DIV ce>||||||jQ 1.8.2||||||jQ 1.7.2||
|| ||is(':focus')||qSA||mS||is(':focus')||qSA||mS||
||Webkit||false||false||false||false||false||false||
||Firefox 15||false||true||true||true||true||true||
||Opera 12||false||true||-||true||true||-||
||<textarea>||||||jQ 1.8.2||||||jQ 1.7.2||
|| ||is(':focus')||qSA||mS||is(':focus')||qSA||mS||
||Webkit||true||false||false||false||false||false||
||Firefox 15||true||true||true||true||true||true||
||Opera 12||true||true||-||true||true||-||
Conclusion: focus detection with is(':focus') works only well for textareas on all platforms, but not for divs. qSA and mS are not reliable, either.
Question: Is there a chance jQ can fix is(':focus') for DIVs as it has been done for textareas already?
Remark: I hope very much jQ can found a workaround over the inconsistencies between different browsers and implement a reliable is(':focus') behaviour. It is easier to use a jQ update than to wait for Apple to implement an updated Mobile Safari in iOS 6...
p.s. I would be grateful for any workaround...
Changed October 05, 2012 11:47AM UTC by comment:4
Here is a jsFiddle example I used for testing:
Changed October 12, 2012 12:53PM UTC by comment:6
Replying to [comment:5 mikesherov]:
#12713 is a duplicate of this ticket.
Hi all (:
Sorry for the duplicated tic
I use a little workaround that you find here: http://pastie.org/5043656
Hope this helps you a little
Cheers
Changed October 15, 2012 03:22PM UTC by comment:7
component: | unfiled → selector |
---|---|
milestone: | None → 1.8.3 |
priority: | undecided → high |
resolution: | → fixed |
status: | new → closed |
This was just fixed in Sizzle: https://github.com/jquery/sizzle/commit/f0dc09b83356e8bf8adeeb555e09077a10af2dc6
#12646 is a duplicate of this ticket.