LayoutTests/fast/css/first-letter-on-non-matching-selectors.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 <title></title>
 <style type="text/css">
 doesnotexist:first-letter { color: red; }
 doesnotexist > #targeta:first-letter { color: red; }
 doesnotexist #targetb:first-letter { color: red; }
 doesnotexist + #targetc:first-letter { color: red; }
 doesnotexist ~ #targetd:first-letter { color: red; }
 </style>

 <script type="text/javascript">
 if (window.testRunner)
     testRunner.dumpAsText();

 function test()
 {
     document.body.offsetTop;
     document.getElementById("targeta").innerHTML = "PASS";
     document.getElementById("targetb").firstChild.data = "PASS";
     document.getElementById("targetc").replaceChild(document.createTextNode("PASS"), document.getElementById("targetc").firstChild);
     document.getElementById("targetd").textContent = "PASS";
 }
 </script>

 </head>
 <body onload="test()">
 <p>
 The style resolution has an optimization to detect if a selector has certain pseudo element. The optimization should only happen if the selector completely match with the exception of the pseudo element.
 </p>
 <p>This test pass if all the lines read "PASS".</p>
 <hr>
 <p id="targeta">didn&rsquo;t run</p>
 <p id="targetb">didn&rsquo;t run</p>
 <p id="targetc">didn&rsquo;t run</p>
 <p id="targetd">didn&rsquo;t run</p>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title></title>
	<style type="text/css">
	doesnotexist:first-letter { color: red; }
	doesnotexist > #targeta:first-letter { color: red; }
	doesnotexist #targetb:first-letter { color: red; }
	doesnotexist + #targetc:first-letter { color: red; }
	doesnotexist ~ #targetd:first-letter { color: red; }
	</style>

	<script type="text/javascript">
	if (window.testRunner)
	testRunner.dumpAsText();

	function test()
	{
	document.body.offsetTop;
	document.getElementById("targeta").innerHTML = "PASS";
	document.getElementById("targetb").firstChild.data = "PASS";
	document.getElementById("targetc").replaceChild(document.createTextNode("PASS"), document.getElementById("targetc").firstChild);
	document.getElementById("targetd").textContent = "PASS";
	}
	</script>

	</head>
	<body onload="test()">
	<p>
	The style resolution has an optimization to detect if a selector has certain pseudo element. The optimization should only happen if the selector completely match with the exception of the pseudo element.
	</p>
	<p>This test pass if all the lines read "PASS".</p>
	<hr>
	<p id="targeta">didn’t run</p>
	<p id="targetb">didn’t run</p>
	<p id="targetc">didn’t run</p>
	<p id="targetd">didn’t run</p>
	</body>
	</html>