1<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
2<html>
3<head>
4<script src="../../resources/js-test-pre.js"></script>
5</head>
6<body>
7
8<img id="image1" src="pythagorean.jpg" alt="Pythagorean Theorem" aria-details="details1 details2">
9<details open id="details1">
10 <summary>Details example</summary>
11 <p>
12 The Pythagorean Theorem is a relationship in Euclidean Geometry between the three sides of
13 a right triangle, where the square of the hypotenuse is the sum of the squares of the two
14 opposing sides.
15 </p>
16 <p>
17 The following drawing illustrates an application of the Pythagorean Theorem when used to
18 construct a skateboard ramp.
19 </p>
20 <p>
21 In this example you will notice a skateboard ramp with a base and vertical board whose width
22 is the width of the ramp. To compute how long the ramp must be, simply calculate the
23 base length, square it, sum it with the square of the height of the ramp, and take the
24 square root of the sum.
25 </p>
26</details>
27<p>See an <a href="http://foo.com/pt.html" id="details2">Application of the Pythagorean Theorem</a>.</p>
28
29<p id="description"></p>
30<div id="console"></div>
31
32<script>
33 description("This verifies the exposure of aria-details.");
34
35 if (window.accessibilityController) {
36 image1 = accessibilityController.accessibleElementById("image1");
37 details = image1.detailsElements();
38 shouldBe("details.length", "5");
39 shouldBe("details[0].description", "'AXLabel: Details example'");
40 shouldBe("details[2].description", "'AXLabel: The following drawing illustrates an application of the Pythagorean Theorem when used to construct a skateboard ramp.'");
41 shouldBe("details[4].description", "'AXLabel: Application of the Pythagorean Theorem'");
42 }
43</script>
44<script src="../../resources/js-test-post.js"></script>
45</body>
46</html>