54 lines
1.6 KiB
HTML
54 lines
1.6 KiB
HTML
<!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>
|