1. 6.13 Interest invokers
      1. 6.13.1 The interesttarget attribute
      2. 6.13.2 The InterestEvent interface
      3. 6.13.3 Processing model

6.13 Interest invokers

6.13.1 The interesttarget attribute

The interesttarget attribute on a, area, and button elements allows authors to set up an invoker relationship between the triggering element and a separate target element such as a popover. With this arrangement, when the user shows interest in the triggering element (e.g., by hovering or focusing it), the target element will have an interest event fired on it. If the target is a popover, this will show the popover.

If specified, the interesttarget attribute value must be the ID of an element in the same tree as the element with the interesttarget attribute.

DOM interface: 
interface mixin InterestInvokerElement {
  [CEReactions] attribute Element? interestTargetElement;
};

The interestTargetElement IDL attribute must reflect the interesttarget attribute.

The following demonstrates how one might show a tooltip for a button using the interesttarget attribute to associate the button with a popover representing the tooltip.

<button interesttarget=tooltip>
 Click me
</button>

<div popover=hint id=tooltip>
 I will appear when the user shows interest in the button
</div>

Every HTML element has an interest state, initially none, with these potential values:

6.13.2 The InterestEvent interface

[Exposed=Window]
interface InterestEvent : Event {
  constructor(DOMString type, InterestEventInit eventInitDict);
  readonly attribute Element source;
};

dictionary InterestEventInit : EventInit {
  required Element source;
};
event.source

Set to an interesting element TODO.

The source attribute must return the value it was initialized to.

6.13.3 Processing model

To capture interest, given an HTML element invoker:

  1. Assert: invoker is an a, area, or button element.

  2. Assert: invoker has the interesttarget attribute specified.

  3. Let target be the result of running node's get the interesttarget-associated element.

  4. If target is null, then return.

  5. Let continue be the result of firing an event named interest at target, using InterestEvent, with the cancelable attribute initialized to true, and the source attribute initialized to invoker.

  6. If continue is false, then return.

  7. Set invoker's interest state to full.

  8. If target's popover attribute is not in the no popover state, then run show popover given target, false, and invoker.

To lose interest, given an HTML element invoker:

  1. Assert: invoker is an a, area, or button element.

  2. Note: invoker may no longer have the interesttarget attribute specified.

  3. Let target be the result of running node's get the interesttarget-associated element.

  4. If target is null, then return.

  5. Let continue be the result of firing an event named loseinterest at target, using InterestEvent, with the cancelable and composed attributes initialized to true, and the source attribute initialized to invoker.

  6. If continue is false, then return.

  7. Set invoker's interest state to none.

  8. If target's popover attribute is not in the no popover state, then hide popover given invoker, false, true, and false.

TODO / questions: