mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-12-08 06:09:58 +00:00
e561749164
The difference is that parsing as the `color` property's value also allows the CSS-wide keywords, which we don't want here. The added test cases make sure that those keywords are *not* valid: - `color` should inherit its parent value of `orange` - `background-color` doesn't inherit, so should be its initial value of `transparent`
69 lines
2.2 KiB
HTML
69 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<script src="../include.js"></script>
|
|
|
|
<body>
|
|
<math data-prop="direction">
|
|
<mi></mi>
|
|
<mi dir="LTR"></mi>
|
|
<mi dir="rtl"></mi>
|
|
</math>
|
|
<math data-prop="color" style="color: orange">
|
|
<mi mathcolor="red"></mi>
|
|
<mi mathcolor="#f00"></mi>
|
|
<mi mathcolor="initial"></mi>
|
|
</math>
|
|
<math data-prop="background-color" style="background-color: orange">
|
|
<mi mathbackground="blue"></mi>
|
|
<mi mathbackground="#0000ff"></mi>
|
|
<mi mathbackground="inherit"></mi>
|
|
</math>
|
|
<math data-prop="font-size">
|
|
<mi mathsize="10px"></mi>
|
|
<mi mathsize="150%"></mi>
|
|
<mi mathsize="2em"></mi>
|
|
</math>
|
|
<math data-prop="math-style">
|
|
<mi displaystyle=""></mi>
|
|
<mi displaystyle="true"></mi>
|
|
<mi displaystyle="TRuE"></mi>
|
|
<mi displaystyle="false"></mi>
|
|
<mi displaystyle="faLse"></mi>
|
|
</math>
|
|
<math data-prop="math-depth" style="math-depth:1">
|
|
<mi></mi>
|
|
<mi scriptlevel="2"></mi>
|
|
<mi scriptlevel="+2"></mi>
|
|
<mi scriptlevel="-3"></mi>
|
|
</math>
|
|
<math data-prop="text-transform">
|
|
<mi></mi>
|
|
<mi mathvariant="normal"></mi>
|
|
</math>
|
|
<math data-prop="width">
|
|
<mspace width="10px"></mspace>
|
|
<mspace width="10%"></mspace>
|
|
<mspace width="2em"></mspace>
|
|
</math>
|
|
<math data-prop="height">
|
|
<mspace height="20px"></mspace>
|
|
<mspace height="10%"></mspace>
|
|
<mspace height="2em"></mspace>
|
|
<mspace depth="30px"></mspace>
|
|
<mspace depth="20%"></mspace>
|
|
<mspace depth="3em"></mspace>
|
|
<mspace depth="1%" height="20px"></mspace>
|
|
<mspace depth="30px" height="1%"></mspace>
|
|
<mspace depth="30px" height="20px"></mspace>
|
|
<mspace depth="1.5em" height="2em"></mspace>
|
|
</math>
|
|
</body>
|
|
<script>
|
|
test(() => {
|
|
[...document.querySelectorAll('[data-prop]')].forEach(propItem => {
|
|
const prop = propItem.dataset['prop'];
|
|
[...propItem.querySelectorAll('& > *')].forEach(item =>
|
|
println(`${prop}: ${item.computedStyleMap().get(prop).toString()}`)
|
|
);
|
|
});
|
|
});
|
|
</script>
|