summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html')
-rw-r--r--testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html54
1 files changed, 54 insertions, 0 deletions
diff --git a/testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html b/testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html
new file mode 100644
index 0000000000..f8348c15b2
--- /dev/null
+++ b/testing/web-platform/tests/mathml/relations/html5-tree/css-inline-style-interface.tentative.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8" />
+ <title>MathML 'ElementCSSInlineStyle` Mixin Tests</title>
+ <link rel="help" href="https://w3c.github.io/mathml-core/#dom-and-javascript"/>
+ <style>
+ math * {
+ background-color: red;
+ }
+ </style>
+ <meta
+ name="assert"
+ content="MathMLElements incorporate a functional ElementCSSInlineStyle interface"
+ />
+ <script src="/mathml/support/mathml-fragments.js"></script>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ </head>
+ <body>
+ <span
+ >This tests the presence and functionality of features of the
+ `ElementCSSInlineStyle` interface for MathMLElements</span
+ >
+ <math></math>
+ <script>
+ let mathEl = document.querySelector("math");
+
+ test(function() {
+ mathEl.style.backgroundColor = "lime";
+ assert_equals(
+ getComputedStyle(mathEl).backgroundColor,
+ "rgb(0, 255, 0)",
+ "The applied background should be green."
+ );
+ }, `The <math> element style property should be present and be functional.`);
+
+ Object.keys(MathMLFragments).forEach(elName => {
+ mathEl.innerHTML = MathMLFragments[elName];
+
+ test(function() {
+ let el = FragmentHelper.element(mathEl);
+ el.style.backgroundColor = "blue";
+
+ assert_equals(
+ getComputedStyle(el).backgroundColor,
+ "rgb(0, 0, 255)",
+ "The applied background should be blue."
+ );
+ }, `The ${elName}'s style property should be present and be functional.`);
+ });
+ </script>
+ </body>
+</html>