<!DOCTYPE html>
<style>
    p { color: green; }
    div:first-letter { color: red; }
</style>
<script src="../../../resources/js-test-pre.js"></script>
<p>Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=83298">https://bugs.webkit.org/show_bug.cgi?id=83298</a></p>
<div>First letter of this sentence should be red.</div>
<script>
description("getMatchedCSSRules with invalid Pseudo Elements");

var expectedResult1 = "p { color: green; }";
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('p'), '')[0].cssText", expectedResult1)
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('p'), undefined)[0].cssText", expectedResult1)
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('p'), null)[0].cssText", expectedResult1)
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('p'))[0].cssText", expectedResult1)

shouldBe("getMatchedCSSRules(document.querySelector('p'), 'before')", "null")
shouldBe("getMatchedCSSRules(document.querySelector('p'), 'foo')", "null")

var expectedResult2 = "div::first-letter { color: red; }";
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('div'), 'first-letter')[0].cssText", expectedResult2)
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('div'), ':first-letter')[0].cssText", expectedResult2)
shouldBeEqualToString("getMatchedCSSRules(document.querySelector('div'), '::first-letter')[0].cssText", expectedResult2)

successfullyParsed = true;
</script>
<script src="../../../resources/js-test-post.js"></script>