third_party/WebKit/LayoutTests/accessibility/name-calc-figure.html

   1 <!DOCTYPE HTML>
   2 <script src="../resources/testharness.js"></script>
   3 <script src="../resources/testharnessreport.js"></script>
   4
   5 <style>
   6 .hideAllContainers .container {
   7     display: none;
   8 }
   9 </style>
  10
  11 <div class="container">
  12   <figure id="figure1">
  13     <img src="resources/cake.png" alt="cake">
  14   </figure>
  15 </div>
  16
  17 <script>
  18 test(function(t) {
  19     var axFigure1 = accessibilityController.accessibleElementById("figure1");
  20     assert_equals(axFigure1.name, "");
  21 }, "Figure element with no figcaption");
  22 </script>
  23
  24 <div class="container">
  25   <figure id="figure2" title="figure2-title">
  26     <img src="resources/cake.png" alt="cake">
  27   </figure>
  28 </div>
  29
  30 <script>
  31 test(function(t) {
  32     var axFigure2 = accessibilityController.accessibleElementById("figure2");
  33     assert_equals(axFigure2.name, "figure2-title");
  34     assert_equals(axFigure2.nameFrom, "attribute");
  35 }, "Figure element with no figcaption with title");
  36 </script>
  37
  38 <div class="container">
  39   <figure id="figure3" title="figure3-title">
  40     <figcaption>figcaption3</figcaption>
  41     <img src="resources/cake.png" alt="cake">
  42   </figure>
  43 </div>
  44
  45 <script>
  46 test(function(t) {
  47     var axFigure3 = accessibilityController.accessibleElementById("figure3");
  48     assert_equals(axFigure3.name, "figcaption3");
  49     assert_equals(axFigure3.nameFrom, "relatedElement");
  50 }, "Figure element with figcaption and title");
  51 </script>
  52
  53 <div class="container">
  54   <figure id="figure4" title="figure4-title" aria-label="figure4-aria-label">
  55     <figcaption>figcaption4</figcaption>
  56     <img src="resources/cake.png" alt="cake">
  57   </figure>
  58 </div>
  59
  60 <script>
  61 test(function(t) {
  62     var axFigure4 = accessibilityController.accessibleElementById("figure4");
  63     assert_equals(axFigure4.name, "figure4-aria-label");
  64     assert_equals(axFigure4.nameFrom, "attribute");
  65 }, "Figure element with figcaption, title and aria-label");
  66 </script>
  67
  68 <div class="container">
  69   <figure id="figure5" title="figure5-title" aria-label="figure5-aria-label" aria-labelledby="labelledby5">
  70     <figcaption>figcaption5</figcaption>
  71     <img src="resources/cake.png" alt="cake">
  72   </figure>
  73   <span hidden="true" id="labelledby5">figure5-aria-labelledby</span>
  74 </div>
  75
  76 <script>
  77 test(function(t) {
  78     var axFigure5 = accessibilityController.accessibleElementById("figure5");
  79     assert_equals(axFigure5.name, "figure5-aria-labelledby");
  80     assert_equals(axFigure5.nameFrom, "relatedElement");
  81 }, "Figure element with figcaption, title, aria-label and aria-labelledby");
  82 </script>
  83
  84 <script>
  85 if (window.testRunner)
  86     document.body.className = "hideAllContainers";
  87 </script>