18 <script src=
"../resources/js-test.js"></script>
21 <div style=
"background-repeat: repeat-x;">
22 <div><pre id=
"leading-px" class=
"px-tab-size">	<span>leading text, tab-size in px.
</span></pre></div>
23 <div><pre id=
"leading-em" class=
"em-tab-size">	<span>leading text, tab-size in em.
</span></pre></div>
24 <div><pre id=
"leading-int" class=
"int-tab-size">	<span>leading text, tab-size in spaces.
</span></pre></div>
25 <div><pre id=
"trailing-px" class=
"px-tab-size"><span>leading text
</span>	<span>trailing text, tab-size in px.
</span></pre></div>
26 <div><pre id=
"trailing-em" class=
"em-tab-size"><span>leading text
</span>	<span>trailing text, tab-size in em.
</span></pre></div>
27 <div><pre id=
"trailing-int" class=
"int-tab-size"><span>leading text
</span>	<span>trailing text, tab-size in spaces.
</span></pre></div>
28 <div><pre>Some spaces... '
<span id=
"space-size-reference"> </span>' ... for size reference.
</pre></div>
29 <div><pre>'
<span id=
"leading-text-size-reference">leading text
</span>', for size reference.
</pre></div>
32 description('Test tab-size measurements.');
34 // Tests with a tab character at the beginning of the line.
36 var pxPre
= document
.getElementById('leading-px');
37 var emPre
= document
.getElementById('leading-em');
38 var intPre
= document
.getElementById('leading-int');
40 var pxLeadingSpan
= pxPre
.firstElementChild
;
41 var emLeadingSpan
= emPre
.firstElementChild
;
42 var intLeadingSpan
= intPre
.firstElementChild
;
44 var pxExpected
= 60; // tab size in px.
45 var emExpected
= 13 * 7; // (font size) * (tab size in em)
46 var intExpected
= document
.getElementById('space-size-reference').getBoundingClientRect().width
;
48 var pxTabLength
= pxLeadingSpan
.getBoundingClientRect().left
- pxPre
.getBoundingClientRect().left
;
49 var emTabLength
= emLeadingSpan
.getBoundingClientRect().left
- emPre
.getBoundingClientRect().left
;
50 var intTabLength
= intLeadingSpan
.getBoundingClientRect().left
- intPre
.getBoundingClientRect().left
;
52 shouldBe("pxTabLength", "pxExpected", false, 0.02);
53 shouldBe("emTabLength", "emExpected", false, 0.02);
54 shouldBe("intTabLength", "intExpected", false, 0.02);
56 // Tests with a tab character after leading text.
58 var leadingTextSize
= document
.getElementById('leading-text-size-reference').getBoundingClientRect().width
;
59 pxExpected
= pxExpected
- (leadingTextSize
% pxExpected
);
60 emExpected
= emExpected
- (leadingTextSize
% emExpected
);
61 intExpected
= intExpected
- (leadingTextSize
% intExpected
);
63 pxPre
= document
.getElementById('trailing-px');
64 emPre
= document
.getElementById('trailing-em');
65 intPre
= document
.getElementById('trailing-int');
67 pxLeadingSpan
= pxPre
.firstElementChild
;
68 emLeadingSpan
= emPre
.firstElementChild
;
69 intLeadingSpan
= intPre
.firstElementChild
;
71 pxTrailingSpan
= pxPre
.lastElementChild
;
72 emTrailingSpan
= emPre
.lastElementChild
;
73 intTrailingSpan
= intPre
.lastElementChild
;
75 pxTabLength
= pxTrailingSpan
.getBoundingClientRect().left
- pxLeadingSpan
.getBoundingClientRect().right
;
76 emTabLength
= emTrailingSpan
.getBoundingClientRect().left
- emLeadingSpan
.getBoundingClientRect().right
;
77 intTabLength
= intTrailingSpan
.getBoundingClientRect().left
- intLeadingSpan
.getBoundingClientRect().right
;
79 shouldBe("pxTabLength", "pxExpected", false, 0.02);
80 shouldBe("emTabLength", "emExpected", false, 0.02);
81 shouldBe("intTabLength", "intExpected", false, 0.02);