<html>
<head>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
.first:first-letter {
  font-weight: bold;
  visibility: visible;
}
.visible {
  visiblity: visible;
}
.invisible {
  visibility: hidden;
}
.preLine {
  white-space: pre-line;
}
.preWrap {
  white-space: pre-wrap;
}
.left {
  float: left;
}
.left:first-letter {
  text-transform: capitalize;
}
</style>
</head>
<body>
<div id="tests">
<div id="divFirst" class="first">div</div>
<div id="divNormal">div</div>
<pre id="pFirst" class="first">pre</pre>
<pre id="pNormal">pre</pre>
<div id="collapsedSpaceFirst"><span> </span><div class="first">abc</div></div>
<div id="collapsedSpaceNormal"><span> </span><div>abc</div></div>
<div id="collapsedSpacePreFirst"><span> </span><pre class="first">abc</pre></div>
<div id="collapsedSpacePreNormal"><span> </span><pre>abc</pre></div>
<div id="preSpaceFirst"><span>test</span><pre class="first">  abc</pre></div>
<div id="preSpaceNormal"><span>test</span><pre>  abc</pre></div>
<div id="divSpaceFirst"><span>test</span><div class="first">  abc</div></div>
<div id="divSpaceNormal"><span>test</span><div>  abc</div></div>
<div id="preLineFirst" class="first preLine">test</div>
<div id="preLineNormal" class="preLine">test</div>
<div id="preWrapFirst" class="first preWrap">
test</div>
<div id="preWrapNormal" class="preWrap">
test</div>
<div id="collapsedSpaceDivFirst"><span>foo</span><span> </span><div class="first">abc</div></div>
<div id="collapsedSpaceDivNormal"><span>foo</span><span> </span><div>abc</div></div>
<div id="firstCollapsedDivFirst"><div class="first">abc  </div><span>def</span></div>
<div id="firstCollapsedDivNormal"><div>abc  </div><span>def</span></div>
<div id="collapsedSpaceCollapsedDivFirst"><span>foo</span><span> </span><div class="first">  abc</div></div>
<div id="collapsedSpaceCollapsedDivNormal"><span>foo</span><span> </span><div>  abc</div></div>
<div id="collapsedSpacePunctDivFirst"><span>foo</span><span> </span><div class="first">|  
abc</div></div>
<div id="collapsedSpacePunctDivNormal"><span>foo</span><span> </span><div>|  
abc</div></div>
<div id="divSpanFirst" class="first"><span id="f1">1</span><span id="f2">2</span></div>
<div id="divSpanNormal"><span id="n1">1</span><span id="n2">2</span></div>
<div id="invisiblePre"><pre class="invisible">test</pre></div>
<div id="invisiblePreFirst"><pre class="invisible first">test</pre></div>
<div id="invisible">
<div class="invisible"><input value="an input" type="text"/> </div><pre>test</pre>
</div>

<pre>
Results
</pre>
<div id="floatDt"><dl><dt class=left> ab<dt class=left> cd<dt class=left> e</dl></div>
</div>

<script>
// This tests a letter with :first-letter applied is present in innerText.
test(() => assert_equals(document.getElementById('divFirst').innerText, document.getElementById('divNormal').innerText),
     'divFirst.innerText');

test(() => assert_equals(document.getElementById('pFirst').innerText, document.getElementById('pNormal').innerText),
     'pFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpaceFirst').innerText, document.getElementById('collapsedSpaceNormal').innerText),
     'collapsedSpaceFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpacePreFirst').innerText, document.getElementById('collapsedSpacePreNormal').innerText),
     'collapsedSpacePreFirst.innerText');

test(() => assert_equals(document.getElementById('preLineFirst').innerText, document.getElementById('preLineNormal').innerText),
     'preLineFirst.innerText');

test(() => assert_equals(document.getElementById('preWrapFirst').innerText, document.getElementById('preWrapNormal').innerText),
     'preWrapFirst.innerText');

test(() => assert_equals(document.getElementById('preSpaceFirst').innerText, document.getElementById('preSpaceNormal').innerText),
     'preSpaceFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpaceDivFirst').innerText, document.getElementById('collapsedSpaceDivNormal').innerText),
     'collapsedSpaceDivFirst.innerText');

test(() => assert_equals(document.getElementById('firstCollapsedDivFirst').innerText, document.getElementById('firstCollapsedDivNormal').innerText),
     'firstCollapsedDivFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpaceCollapsedDivFirst').innerText, document.getElementById('collapsedSpaceCollapsedDivNormal').innerText),
     'collapsedSpaceCollapsedDivFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpaceCollapsedDivFirst').innerText, 'foo\nabc'),
     'collapsedSpaceSollapsedDivFirst.innerText literal');

test(() => assert_equals(document.getElementById('collapsedSpacePunctDivFirst').innerText, document.getElementById('collapsedSpacePunctDivNormal').innerText),
     'collapsedSpacePunctDivFirst.innerText');

test(() => assert_equals(document.getElementById('collapsedSpacePunctDivFirst').innerText, 'foo\n| abc'),
     'collapsedSpacePunctDivFirst.innerText literal');

test(() => assert_equals(document.getElementById('divSpanFirst').innerText, document.getElementById('divSpanNormal').innerText),
     'divSpanFirst.innerText');

test(() => assert_equals(document.getElementById('invisiblePre').innerText, ''),
     'invisiblePre.innerText');

test(() => assert_equals(document.getElementById('invisiblePreFirst').innerText, ''),
     'invisiblePreFirst.innerText');

test(() => assert_equals(document.getElementById('invisible').innerText, 'test'),
     'invisible.innerText');

test(() => assert_equals(document.getElementById('floatDt').innerText, 'Ab\nCd\nE'),
     'floatDt.innerText');
</script>
</body>
</html>