blob: bce13efa23b078c8b632f24b7c25d82ebf5f93eb [file] [log] [blame]
<!DOCTYPE HTML>
<html>
<body>
<script src="../resources/js-test-pre.js"></script>
<div id="content">
<meter id="meter1" value=6 max=8>6 blocks used (out of 8 total)</meter>
<meter id="meter2" value=0.75><img alt="75%" src="graph75.png"></meter>
<meter id="meter3" min="0" max="100" value="75"></meter>
<meter id="meter4" min=0 max=20 value=12>12cm</meter>
<meter id="meter5" min=0 max=10 value=2>2cm</meter>
<meter id="meter6" min=0 max=20 value=12 title="centimeters">12cm</meter>
<meter id="meter7" min=0 max=10 value=2 title="centimeters">2cm</meter>
<meter id="meter8" value=0.75><img aria-label="75 out of 100" src="graph75.png"></meter>
<meter id="meter9" value=0.75><img aria-label="75 out of 100" aria-labelledby="label" src="graph75.png"></meter>
<meter id="meter10" value=0.75><img aria-labelledby="label" src="graph75.png"></meter>
<span id="label" style="color:green;">75 percent</span>
<meter id="meter11" value=0.75><img aria-labelledby="label1 label2" src="graph75.png"></meter>
<span id="label1" style="color:green;">75</span>
<span id="label2" style="color:green;">(100 total)</span>
<meter id="meter12" value=0.75><span style="color:green;">75 (out of 100 total)</span></meter>
<meter id="meter13" value=0.75><div><p><span style="color:green;">75 (out of 100 total)</span></p></div></meter>
<meter id="meter14" value=0.60><div aria-label="7 of 10"><span style="color:green;">&#9632;&#9632;&#9632;&#9632;&#9632;&#9632;</span><span>&#9633;&#9633;&#9633;&#9633;</span></div></meter>
</div>
<div id="console"></div>
<script>
description("This tests that the meter element is accessible.");
if (window.testRunner && window.accessibilityController) {
for (var k = 1; k < 15; k++) {
var meter = accessibilityController.accessibleElementById("meter" + k);
debug("Meter" + k);
debug(meter.role);
debug(meter.title);
debug(meter.description);
debug(meter.valueDescription);
debug("AXValueSettable: " + meter.isAttributeSettable("AXValue"));
debug("\n");
}
document.getElementById("content").style.visibility = 'hidden';
}
</script>
<script src="../resources/js-test-post.js"></script>
</body>
</html>