1
    2
    3
    4
    5
    6
    7
    8
    9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58


content / test / data / accessibility / aria / aria-owns-illegal-multiple-owner.html [blame]

<!--
# When there are multiple owners, the first one assigned wins.
@BLINK-ALLOW:className*
@EXECUTE-AND-WAIT-FOR:p2IsOwner()
@EXECUTE-AND-WAIT-FOR:p1IsNotOwner()
@EXECUTE-AND-WAIT-FOR:p1IsOwner()
@EXECUTE-AND-WAIT-FOR:noOwner()
@EXECUTE-AND-WAIT-FOR:p2IsOwner()
-->
<!DOCTYPE html>
<html>
<p class="p1" aria-owns="m1"></p>
<p class="p2"></p>
<div>
  <mark id="m1"></mark>
</div>

<script>
// Step 1: create a second owner for m1, which is illegal, and therefore the
// tree should not change.
function p2IsOwner() {
  document.querySelector('.p2').setAttribute('aria-owns', "m1");
  document.title = "p2IsOwner";
  return "p2IsOwner";
}

// Step 2:
// Remove the original owner, leaving the second owner as the only owner.
// In other words, the second owner (p2) now becomes a legal owner.
function p1IsNotOwner() {
  document.querySelector('.p1').removeAttribute('aria-owns');
  document.title = "p1IsNotOwner";
  return "p1IsNotOwner";
}

// Step 3:
// Add p1 as an owner again. However, we already have switched to p2 being the
// owner, and it now takes precedence. Therefore, no tree changes should occur.
function p1IsOwner() {
  document.querySelector('.p1').setAttribute('aria-owns', "m1");
  document.title = "p1IsOwner";
  return "p1IsOwner";
}

// Step 4:
// Remove all owners. The tree should follow the DOM order.
function noOwner() {
  document.querySelector('.p1').removeAttribute('aria-owns');
  document.querySelector('.p2').removeAttribute('aria-owns');
  document.title = "noOwner";
  return "noOwner";
}

// Step 5: Calls p2IsOwner() again.
// P2 should mow own the mark object again.

</script>
</html>