ally.event.activeElement

Observes changes to document.activeElement regardless of focus/blur events and emits active-element CustomEvents.

Description

The property document.activeElement is visited on every animation frame.

This event should not be abused because FocusEvents do not bubble and are therefore unaccessible to event delegation, as the handling of focus and blur events can be delegated when using the capture phase:

document.addEventListener('focus', function(event) {
  // event.target: element that received focus
  // event.relatedTarget: element that lost focus
}, true);

Usage

document.addEventListener('active-element', function(event) {
  // event.detail.focus: element that received focus
  // event.detail.blur: element that lost focus
}, false);

// start emitting active-element
var handle = ally.event.activeElement();
// stop emitting active-element
handle.disengage();

Arguments

Returns

A <global-service> interface, providing the handle.disengage() method to stop the service.

Throws

Event data

The event.detail property provides the following data:

Name	Type	Description
event.detail.focus	HTMLElement	The element that received focus.
event.detail.blur	HTMLElement	The element that lost focus.

Examples

Notes

Related resources

Contributing

• module source
• document source
• unit test
• uses ally/prototype/window.customevent.js for Internet Explorer compatibility