content/test/data/accessibility/html/popover-api.html

<!--
@MAC-ALLOW:AXExpanded
@WIN-ALLOW:details-from*
@WIN-ALLOW:details-roles*
@WIN-ALLOW:EXPANDED*
@WIN-ALLOW:HASPOPUP*
@WIN-ALLOW:haspopup*
@BLINK-ALLOW:details*
@BLINK-ALLOW:haspopup*
@BLINK-ALLOW:expanded*
@AURALINUX-ALLOW:details-from*
@AURALINUX-ALLOW:details-roles*
@AURALINUX-ALLOW:expanded*
@AURALINUX-ALLOW:haspopup:*
-->
<div popover>Div popover</div>
<ul popover role=listbox><li>Listbox role on ul</li></ul>
<ul popover role=listbox><li>Listbox role on ul</li></ul>
<details popover><summary>summary/details popover</summary></details>

<button popovertarget=popover1>Button pointing to hidden popover</button>
<input type=text popovertarget=popover1>Text input pointing to hidden popover</button>
<div popover id=popover1>Popover</div>
<button popovertarget=manual1 popovertargetaction=hide>Hide button pointing to hidden manual</button>
<input type=email popovertarget=manual1 popovertargetaction=hide>Email input pointing to hidden manual</button>
<div popover=manual id=manual1>Manual</div>

<button popovertarget=hint1>Button pointing to hint popover</button>
<div popover=hint id=hint1>Popover=hint</div>

<button popovertarget=hint2>Button pointing to "rich" hint popover</button>
<div popover=hint id=hint2>Popover=hint <a href="invalid">Link</a></div>

<button popovertarget=noattr>Button pointing to non-popover</button>
<input type=text popovertarget=noattr>Text input pointing to non-popover</button>
<div id=noattr>No popover attribute</div>
<button popovertarget=badattr>Button pointing to invalid popover value</button>
<input type=text popovertarget=badattr>Text input pointing to invalid popover value</button>
<div id=badattr popover=invalid_value>Invalid popover attribute value</div>

<p> Showing/visible popovers below </p>

<button popovertarget=popover2>Button pointing to showing popover</button>
<button popovertarget=popover2 aria-details="">w/o details</button>
<input type=tel popovertarget=popover2>Tel input pointing to showing popover</button>
<button popovertarget=popover3 popovertargetaction=show>Show button pointing to nested popover</button>
<input type=url popovertarget=popover3 popovertargetaction=show>Url input pointing to nested popover</button>
<div popover id=popover2 style="top:100px">Popover (showing)
  <div popover id=popover3 style="top:200px">Nested popover (showing)</div>
  <button popovertarget=popover2>Nested invoker pointing back to containing popover</button>
</div>
<button popovertarget=manual2 popovertargetaction=hide>Hide button pointing to showing manual (should add aria-details)</button>
<input type=url popovertarget=manual2 popovertargetaction=hide>Url input pointing to showing manual</button>
<button popovertarget=manual2 popovertargetaction=hide>Hide button pointing to showing manual (should NOT add aria-details)</button>
<div popover=manual id=manual2>Manual (showing)</div>
<div popover=hint id=hint3 anchor=manual2 style="inset:0;top:300px">Popover=hint (showing) <a href="foo">Link</a></div>
<script>
  popover2.showPopover();
  popover3.showPopover();
  manual2.showPopover();
  hint3.showPopover();
</script>