<head>
<meta charset="utf-8">
<style>
.reset { counter-reset: c; }
.increment { counter-increment: c; }
.increment2 { counter-increment: c 2; }
.show-marker { display: list-item; }
.show-marker::marker { content: counters(c, "."); }
.show-before:before { content: counters(c, "."); }
.show-after:after { content: counters(c, "."); }
.show-twice:before { content: counters(c, ".") counters(c, "."); }
.show-greek:before { content: counters(c, ".", lower-greek); }
.show-three-greeks:before { content: counters(c, ".", lower-greek) counters(c, ".", lower-greek); }
.show-three-greeks:after { content: counters(c, ".", lower-greek); }
</style>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<div>This is the test for internals.counterValueForElementById</div>
<div class="reset"><span id="marker" class="show-marker"></span></div>
<div class="reset"><span id="before" class="show-before"></span></div>
<div class="reset"><span id="after" class="show-after"></span></div>
<div class="reset"><span id="marker_before" class="show-marker show-before"></span></div>
<div class="reset"><span id="marker_after" class="show-marker show-after"></span></div>
<div class="reset"><span id="before_after" class="show-before show-after"></span></div>
<div class="reset"><span id="marker_before_after" class="show-marker show-before show-after"></span></div>
<div class="reset"><span id="twice" class="show-twice"></span></div>
<div class="reset">
<span id="point" class="reset increment show-before">
<span id="two-points" class="reset increment2 show-before">
<span id="greek" class="show-greek"></span>
<span id="three-greeks" class="show-three-greeks"></span>
</span>
</span>
</div>
<div id="console"></div>
<script>
if (window.testRunner) {
testRunner.dumpAsText();
shouldBe("internals.counterValue(document.getElementById('marker'))", "'0'");
shouldBe("internals.counterValue(document.getElementById('before'))", "'0'");
shouldBe("internals.counterValue(document.getElementById('after'))", "'0'");
shouldBe("internals.counterValue(document.getElementById('marker_before'))", "'0 0'");
shouldBe("internals.counterValue(document.getElementById('marker_after'))", "'0 0'");
shouldBe("internals.counterValue(document.getElementById('before_after'))", "'0 0'");
shouldBe("internals.counterValue(document.getElementById('marker_before_after'))", "'0 0 0'");
shouldBe("internals.counterValue(document.getElementById('twice'))", "'0 0'");
shouldBe("internals.counterValue(document.getElementById('point'))", "'0.1'");
shouldBe("internals.counterValue(document.getElementById('two-points'))", "'0.1.2'");
shouldBe("internals.counterValue(document.getElementById('greek'))", "'0.\u03b1.\u03b2'");
shouldBe("internals.counterValue(document.getElementById('three-greeks'))", "'0.\u03b1.\u03b2 0.\u03b1.\u03b2 0.\u03b1.\u03b2'");
}
</script>
</body>