1 files changed, 76 insertions, 0 deletions
diff --git a/layout/inspector/tests/test_getCSSStyleRules_pseudo.html b/layout/inspector/tests/test_getCSSStyleRules_pseudo.html
new file mode 100644
index 0000000000..097a66baed
--- /dev/null
+++ b/layout/inspector/tests/test_getCSSStyleRules_pseudo.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<title>Test getCSSStyleRules for pseudo elements</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+<link rel="stylesheet" href="/tests/SimpleTest/test.css">
+
+<style>
+#block:before {
+  display: block;
+  content: ":before";
+}
+#block:after {
+  display: block;
+  content: ":after";
+}
+
+#table:before {
+  display: table;
+  content: ":before";
+}
+#table:after {
+  display: table;
+  content: ":after";
+}
+
+#flex:before {
+  display: flex;
+  content: ":before";
+}
+#flex:after {
+  display: flex;
+  content: ":after";
+}
+
+#grid:before {
+  display: grid;
+  content: ":before";
+}
+#grid:after {
+  display: grid;
+  content: ":after";
+}
+</style>
+
+<div id="block">block pseudos</div>
+<div id="table">table pseudos</div>
+<div id="flex">flex pseudos</div>
+<div id="grid">grid pseudos</div>
+
+<script>
+const InspectorUtils = SpecialPowers.InspectorUtils;
+
+function checkPseudoStyleForId(id) {
+  let element = document.getElementById(id);
+
+  let beforeRules = InspectorUtils.getCSSStyleRules(element, ":before");
+  is (beforeRules.length, 1, "Element " + id + ":before has expected number of rules.");
+  let beforeDecl = beforeRules[0].style;
+  is (beforeDecl.content, '":before"', "Element " + id + ":before has expected style content.");
+
+  let afterRules  = InspectorUtils.getCSSStyleRules(element, ":after");
+  is (afterRules.length, 1, "Element " + id + ":after has expected number of rules.");
+  let afterDecl = afterRules[0].style;
+  is (afterDecl.content, '":after"', "Element " + id + ":after has expected style content.");
+}
+
+let idsToCheck = [
+  "block",
+  "table",
+  "flex",
+  "grid",
+];
+
+for (let id of idsToCheck) {
+  checkPseudoStyleForId(id);
+}
+</script>