1 files changed, 61 insertions, 0 deletions
diff --git a/devtools/client/animationinspector/test/doc_pseudo_elements.html b/devtools/client/animationinspector/test/doc_pseudo_elements.html
new file mode 100644
index 000000000..587608b19
--- /dev/null
+++ b/devtools/client/animationinspector/test/doc_pseudo_elements.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <title>Animated pseudo elements</title>
+    <style>
+      html, body {
+        margin: 0;
+        height: 100%;
+        width: 100%;
+        overflow: hidden;
+        display: flex;
+        justify-content: center;
+        align-items: flex-end;
+      }
+
+      body {
+        animation: color 2s linear infinite;
+        background: #333;
+      }
+
+      @keyframes color {
+        to {
+          filter: hue-rotate(360deg);
+        }
+      }
+
+      body::before,
+      body::after {
+        content: "";
+        flex-grow: 1;
+        height: 100%;
+        animation: grow 1s linear infinite alternate;
+      }
+
+      body::before {
+        background: hsl(120, 80%, 80%);
+      }
+      body::after {
+        background: hsl(240, 80%, 80%);
+        animation-delay: -.5s;
+      }
+
+      @keyframes grow {
+        0% {height: 100%; animation-timing-function: ease-in-out;}
+        10% {height: 80%; animation-timing-function: ease-in-out;}
+        20% {height: 60%; animation-timing-function: ease-in-out;}
+        30% {height: 70%; animation-timing-function: ease-in-out;}
+        40% {height: 50%; animation-timing-function: ease-in-out;}
+        50% {height: 30%; animation-timing-function: ease-in-out;}
+        60% {height: 80%; animation-timing-function: ease-in-out;}
+        70% {height: 90%; animation-timing-function: ease-in-out;}
+        80% {height: 70%; animation-timing-function: ease-in-out;}
+        90% {height: 60%; animation-timing-function: ease-in-out;}
+        100% {height: 100%; animation-timing-function: ease-in-out;}
+      }
+    </style>
+  </head>
+  <body>
+  </body>
+</html>
+\ No newline at end of file