mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-05-05 06:32:30 +02:00
Tests: Import text-decoration WPT tests
This commit is contained in:
committed by
Andreas Kling
parent
9453c25925
commit
fa1e102f3c
Notes:
github-actions[bot]
2024-11-30 10:02:42 +00:00
Author: https://github.com/AtkinsSJ Commit: https://github.com/LadybirdBrowser/ladybird/commit/fa1e102f3c5 Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/2638
@@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedStyle().textDecorationColor</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="Computed text-decoration-color is the computed color.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#container {
|
||||
color: rgb(255, 0, 0);
|
||||
text-decoration-color: currentcolor;
|
||||
}
|
||||
#target {
|
||||
color: rgb(0, 255, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="target"></div>
|
||||
</div>
|
||||
<script>
|
||||
test_computed_value("text-decoration-color", "rgb(0, 0, 255)");
|
||||
test_computed_value("text-decoration-color", "currentcolor", "rgb(0, 255, 0)");
|
||||
test_computed_value("text-decoration-color", "inherit", "rgb(0, 255, 0)"); // currentcolor
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-color with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="text-decoration-color supports only the grammar '<color>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration-color", "auto");
|
||||
test_invalid_value("text-decoration-color", "invert");
|
||||
test_invalid_value("text-decoration-color", "50%");
|
||||
test_invalid_value("text-decoration-color", "red green");
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-color with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="text-decoration-color supports the full grammar '<color>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("text-decoration-color", "currentcolor");
|
||||
test_valid_value("text-decoration-color", "red");
|
||||
test_valid_value("text-decoration-color", "rgba(10, 20, 30, 0.4)");
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedStyle().textDecoration</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-property">
|
||||
<meta name="assert" content="text-decoration computed value is as specified.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
'use strict';
|
||||
const currentColor = "rgb(0, 0, 255)";
|
||||
test_computed_value("text-decoration", "none", currentColor);
|
||||
test_computed_value("text-decoration", "line-through", "line-through " + currentColor);
|
||||
test_computed_value("text-decoration", "solid", currentColor);
|
||||
test_computed_value("text-decoration", "currentcolor", currentColor);
|
||||
|
||||
test_computed_value("text-decoration", "double overline underline", "underline overline double " + currentColor);
|
||||
test_computed_value("text-decoration", "underline overline line-through red", "underline overline line-through rgb(255, 0, 0)");
|
||||
test_computed_value("text-decoration", "rgba(10, 20, 30, 0.4) dotted", "dotted rgba(10, 20, 30, 0.4)");
|
||||
|
||||
test_computed_value("text-decoration", "underline dashed rgb(0, 255, 0)");
|
||||
|
||||
// Add text-decoration-thickness in [css-text-decor-4].
|
||||
test_computed_value("text-decoration", "auto", currentColor);
|
||||
test_computed_value("text-decoration", "from-font", "from-font " + currentColor);
|
||||
test_computed_value("text-decoration", "10px", "10px " + currentColor);
|
||||
test_computed_value("text-decoration", "underline red from-font", "underline from-font rgb(255, 0, 0)");
|
||||
</script>
|
||||
@@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#propdef-text-decoration">
|
||||
<meta name="assert" content="text-decoration supports only the grammar '<‘text-decoration-line’> || <‘text-decoration-style’> || <‘text-decoration-color’>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration", "double overline underline dotted");
|
||||
test_invalid_value("text-decoration", "red line-through green");
|
||||
test_invalid_value("text-decoration", "overline blue underline");
|
||||
</script>
|
||||
@@ -0,0 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedStyle().textDecorationLine</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-line-property">
|
||||
<meta name="assert" content="text-decoration-line computed value is specified keyword(s).">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
// none
|
||||
test_computed_value("text-decoration-line", "none");
|
||||
|
||||
// underline || overline || line-through || blink
|
||||
test_computed_value("text-decoration-line", "underline");
|
||||
test_computed_value("text-decoration-line", "overline");
|
||||
test_computed_value("text-decoration-line", "line-through");
|
||||
test_computed_value("text-decoration-line", "blink");
|
||||
test_computed_value("text-decoration-line", "underline overline");
|
||||
test_computed_value("text-decoration-line", "underline line-through");
|
||||
test_computed_value("text-decoration-line", "underline blink");
|
||||
test_computed_value("text-decoration-line", "overline line-through");
|
||||
test_computed_value("text-decoration-line", "overline blink");
|
||||
test_computed_value("text-decoration-line", "line-through blink");
|
||||
test_computed_value("text-decoration-line", "underline overline line-through");
|
||||
test_computed_value("text-decoration-line", "underline overline blink");
|
||||
test_computed_value("text-decoration-line", "underline line-through blink");
|
||||
test_computed_value("text-decoration-line", "overline line-through blink");
|
||||
test_computed_value("text-decoration-line", "underline overline line-through blink");
|
||||
|
||||
// spelling-error
|
||||
test_computed_value("text-decoration-line", "spelling-error");
|
||||
|
||||
// grammar-error
|
||||
test_computed_value("text-decoration-line", "grammar-error");
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-line with invalid values</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-line-property">
|
||||
<meta name="assert" content="text-decoration-line supports only the grammar 'none | [ underline || overline || line-through || blink ] | spelling-error | grammar-error'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration-line", "auto");
|
||||
test_invalid_value("text-decoration-line", "null");
|
||||
test_invalid_value("text-decoration-line", "noone");
|
||||
test_invalid_value("text-decoration-line", "under-line");
|
||||
test_invalid_value("text-decoration-line", "over-line");
|
||||
test_invalid_value("text-decoration-line", "linethrough");
|
||||
test_invalid_value("text-decoration-line", "none underline");
|
||||
test_invalid_value("text-decoration-line", "none spelling-error");
|
||||
test_invalid_value("text-decoration-line", "underline underline");
|
||||
test_invalid_value("text-decoration-line", "underline none overline");
|
||||
test_invalid_value("text-decoration-line", "blink line-through blink");
|
||||
test_invalid_value("text-decoration-line", "spelling-error overline");
|
||||
test_invalid_value("text-decoration-line", "spelling-error grammar-error");
|
||||
test_invalid_value("text-decoration-line", "blink underline line-through grammar-error");
|
||||
</script>
|
||||
@@ -0,0 +1,86 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-line with valid values</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-line-property">
|
||||
<meta name="assert" content="text-decoration-line supports the full grammar 'none | [ underline || overline || line-through || blink ] | spelling-error | grammar-error'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
// none
|
||||
test_valid_value("text-decoration-line", "none");
|
||||
|
||||
// underline || overline || line-through || blink
|
||||
test_valid_value("text-decoration-line", "underline");
|
||||
test_valid_value("text-decoration-line", "overline");
|
||||
test_valid_value("text-decoration-line", "line-through");
|
||||
test_valid_value("text-decoration-line", "blink");
|
||||
test_valid_value("text-decoration-line", "underline overline");
|
||||
test_valid_value("text-decoration-line", "overline underline", "underline overline");
|
||||
test_valid_value("text-decoration-line", "underline line-through");
|
||||
test_valid_value("text-decoration-line", "line-through underline", "underline line-through");
|
||||
test_valid_value("text-decoration-line", "underline blink");
|
||||
test_valid_value("text-decoration-line", "blink underline", "underline blink");
|
||||
test_valid_value("text-decoration-line", "overline line-through");
|
||||
test_valid_value("text-decoration-line", "line-through overline", "overline line-through");
|
||||
test_valid_value("text-decoration-line", "overline blink");
|
||||
test_valid_value("text-decoration-line", "blink overline", "overline blink");
|
||||
test_valid_value("text-decoration-line", "line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink line-through", "line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "underline line-through overline", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "overline underline line-through", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "overline line-through underline", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "line-through underline overline", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "line-through overline underline", "underline overline line-through");
|
||||
test_valid_value("text-decoration-line", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "underline blink overline", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "overline underline blink", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "overline blink underline", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "blink underline overline", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "blink overline underline", "underline overline blink");
|
||||
test_valid_value("text-decoration-line", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline blink line-through", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through underline blink", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through blink underline", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink underline line-through", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink line-through underline", "underline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline blink line-through", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through overline blink", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through blink overline", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink overline line-through", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink line-through overline", "overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline overline blink line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline line-through overline blink", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline line-through blink overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline blink overline line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "underline blink line-through overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline underline line-through blink", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline underline blink line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline line-through underline blink", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline line-through blink underline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline blink underline line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "overline blink line-through underline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through underline overline blink", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through underline blink overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through overline underline blink", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through overline blink underline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through blink underline overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "line-through blink overline underline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink underline overline line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink underline line-through overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink overline underline line-through", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink overline line-through underline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink line-through underline overline", "underline overline line-through blink");
|
||||
test_valid_value("text-decoration-line", "blink line-through overline underline", "underline overline line-through blink");
|
||||
|
||||
// spelling-error
|
||||
test_valid_value("text-decoration-line", "spelling-error");
|
||||
|
||||
// grammar-error
|
||||
test_valid_value("text-decoration-line", "grammar-error");
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration: text-decoration sets longhands</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#propdef-text-decoration">
|
||||
<meta name="assert" content="text-decoration supports the full grammar '<‘text-decoration-line’> || <‘text-decoration-style’> || <‘text-decoration-color’>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/shorthand-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_shorthand_value('text-decoration', 'overline from-font dotted green', {
|
||||
'text-decoration-line': 'overline',
|
||||
'text-decoration-thickness': 'from-font',
|
||||
'text-decoration-style': 'dotted',
|
||||
'text-decoration-color': 'green'
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedStyle().textDecorationStyle</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-style-property">
|
||||
<meta name="assert" content="text-decoration-style computed value is as specified.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("text-decoration-style", "solid");
|
||||
test_computed_value("text-decoration-style", "double");
|
||||
test_computed_value("text-decoration-style", "dotted");
|
||||
test_computed_value("text-decoration-style", "dashed");
|
||||
test_computed_value("text-decoration-style", "wavy");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-style with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-style-property">
|
||||
<meta name="assert" content="text-decoration-style supports only the grammar 'solid | double | dotted | dashed | wavy'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration-style", "groove");
|
||||
test_invalid_value("text-decoration-style", "solid wavy");
|
||||
</script>
|
||||
@@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-style with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-style-property">
|
||||
<meta name="assert" content="text-decoration-style supports the full grammar 'solid | double | dotted | dashed | wavy'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("text-decoration-style", "solid");
|
||||
test_valid_value("text-decoration-style", "double");
|
||||
test_valid_value("text-decoration-style", "dotted");
|
||||
test_valid_value("text-decoration-style", "dashed");
|
||||
test_valid_value("text-decoration-style", "wavy");
|
||||
</script>
|
||||
@@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#propdef-text-decoration">
|
||||
<meta name="assert" content="text-decoration supports the full grammar '<‘text-decoration-line’> ||
|
||||
<'text-decoration-thickness'> || <‘text-decoration-style’> || <‘text-decoration-color’>'.">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<script src="../../../css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("text-decoration", "none");
|
||||
test_valid_value("text-decoration", "line-through");
|
||||
test_valid_value("text-decoration", "solid", "none");
|
||||
test_valid_value("text-decoration", "currentcolor", "none");
|
||||
test_valid_value("text-decoration", "auto", "none");
|
||||
test_valid_value("text-decoration", "from-font");
|
||||
test_valid_value("text-decoration", "10px");
|
||||
|
||||
test_valid_value("text-decoration", "double overline underline", "underline overline double");
|
||||
test_valid_value("text-decoration", "underline overline line-through red");
|
||||
test_valid_value("text-decoration", "rgba(10, 20, 30, 0.4) dotted", "dotted rgba(10, 20, 30, 0.4)");
|
||||
test_valid_value("text-decoration", "overline green from-font", "overline from-font green");
|
||||
test_valid_value("text-decoration", "underline dashed green");
|
||||
test_valid_value("text-decoration", "underline auto", "underline");
|
||||
test_valid_value("text-decoration", "line-through 20px");
|
||||
test_valid_value("text-decoration", "overline 3em");
|
||||
</script>
|
||||
Reference in New Issue
Block a user