Bug 63551 - SVGElement 'blur' event is not working
: SVGElement 'blur' event is not working
Status: NEW
: WebKit
SVG
: 528+ (Nightly build)
: Unspecified Unspecified
: P2 Normal
Assigned To:
:
:
:
:
  Show dependency treegraph
 
Reported: 2011-06-28 12:03 PST by
Modified: 2012-02-03 10:23 PST (History)


Attachments
Example for 'blur' event (442 bytes, image/svg+xml)
2011-06-28 12:03 PST, Dirk Schulze
no flags Details
Displays focus, blur, focusin, focusout, activate, DOMFocusIn, DOMFocusOut, and DOMActivate events on SVG and HTML elements. (3.69 KB, application/xhtml+xml)
2011-08-30 15:22 PST, ViewPlus
no flags Details


Note

You need to log in before you can comment on or make changes to this bug.


Description From 2011-06-28 12:03:33 PST
Created an attachment (id=98954) [details]
Example for 'blur' event

If a SVGElement looses its focus it should fire event 'blur' but doesn't right now.

This is related to bug https://bugs.webkit.org/show_bug.cgi?id=41401
------- Comment #1 From 2011-06-28 12:09:12 PST -------
*** Bug 41401 has been marked as a duplicate of this bug. ***
------- Comment #2 From 2011-07-04 15:19:33 PST -------
Actually I don't think this works in SVG, blur (and onfocus) are not part of the list:

http://www.w3.org/TR/SVG11/interact.html#SVGEvents

See also:

https://groups.google.com/group/lib-gwt-svg/browse_thread/thread/b4c05d297ff15fa

Cheers,

Rob.
------- Comment #3 From 2011-07-04 22:15:17 PST -------
I think it could be very useful for accessibility.
------- Comment #4 From 2011-08-30 15:22:45 PST -------
Created an attachment (id=105707) [details]
Displays focus, blur, focusin, focusout, activate, DOMFocusIn, DOMFocusOut, and DOMActivate events on SVG and HTML elements.

I have been running some SVG focus-related tests (spurred by trying to capture iOS VoiceOver's focus-ring changes in JavaScript, see [1]). It seems[2] SVG *should* only be firing `DOMFocusIn`, `DOMFocusOut`, and `DOMActivate`.

However, with elements taking on "group" roles via `tabindex` and/or `role="button"`, I've found:

  * Chrome (14b) fires all events on SVG, even `focus` and `blur`, which it technically should not.
  * Desktop Safari (5.1) only fires `DOMActivate` for SVG.
  * iOS Safari (w/VoiceOver on) fires nothing for SVG

Live example at:
  http://viewplus.com/downloads/htmltests/accessibility/focus-events.xhtml

--------------------------------------------------------
            | Chrome 14b | Safari 5.1 | Mobile Safari* |
--------------------------------------------------------
focus       |    H, S    |     H      |       H        |
blur        |    H, S    |     H      |       H        |
focusin     |    H, S    |     H      |       H        |
focusout    |    H, S    |     H      |       H        |
activate    |            |            |                |
DOMFocusIn  |    H, S    |     H      |       H        |
DOMFocusOut |    H, S    |     H      |       H        |
DOMActivate |    H, S    |    H, S    |       H        |
--------------------------------------------------------
Key:
  H => fires on HTML elements
  S => fires on SVG elements
  * => only w/VoiceOver (iOS) activated
--------------------------------------------------------

I found an old bug[3] which sounds related, but has long since been marked RESOLVED/FIXED. Also, I would like to confirm Dirk's assertion that this is an important accessibility feature. I'm going to keep an eye on this bug


[1]: http://old.nabble.com/Considering-a-Touchhover-td31127221.html#a31129788
[2]: http://www.w3.org/TR/SVGTiny12/interact.html#focus
[3]: https://bugs.webkit.org/show_bug.cgi?id=12573
------- Comment #5 From 2012-02-03 10:23:25 PST -------
(In reply to comment #4)
> Created an attachment (id=105707) [details] [details]
Your test works in Safari trunk as well. But you embedded the SVG in the HTML document. We might check if it works for plain SVG files as well.