Commit 3c720b74 authored by Eric Willigers's avatar Eric Willigers Committed by Commit Bot

CSS: Test computed value for CSS Text properties

Web Platform Tests for computed values of CSS Text properties
https://drafts.csswg.org/css-text-3/#property-index

Change-Id: I52b3de169752db63c96c8662819d3b8a1141d721
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1653608
Auto-Submit: Eric Willigers <ericwilligers@chromium.org>
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Reviewed-by: default avatarAnders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/master@{#668423}
parent 998ba97a
This is a testharness.js-based test.
PASS Property hyphens value 'none' computes to 'none'
PASS Property hyphens value 'manual' computes to 'manual'
FAIL Property hyphens value 'auto' computes to 'auto' assert_equals: expected "auto" but got "manual"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().hyphens</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-hyphens">
<meta name="assert" content="hyphens computed value is specified keyword.">
<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("hyphens", "none");
test_computed_value("hyphens", "manual");
test_computed_value("hyphens", "auto");
</script>
</body>
</html>
This is a testharness.js-based test.
FAIL Property letter-spacing value 'normal' computes to '0px' assert_equals: expected "0px" but got "normal"
PASS Property letter-spacing value '10px' computes to '10px'
PASS Property letter-spacing value '-20px' computes to '-20px'
PASS Property letter-spacing value 'calc(10px - 0.5em)' computes to '-10px'
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().letterSpacing</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-letter-spacing">
<meta name="assert" content="letter-spacing computed value is an absolute length.">
<meta name="assert" content="'normal' computes to zero.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<style>
#target {
font-size: 40px;
}
</style>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("letter-spacing", "normal", "0px");
test_computed_value("letter-spacing", "10px");
test_computed_value("letter-spacing", "-20px");
test_computed_value("letter-spacing", "calc(10px - 0.5em)", "-10px");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().lineBreak</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-line-break">
<meta name="assert" content="line-break computed value is specified keyword.">
<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("line-break", "auto");
test_computed_value("line-break", "loose");
test_computed_value("line-break", "normal");
test_computed_value("line-break", "strict");
test_computed_value("line-break", "anywhere");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property overflow-wrap value 'normal' computes to 'normal'
PASS Property overflow-wrap value 'break-word' computes to 'break-word'
FAIL Property overflow-wrap value 'anywhere' computes to 'anywhere' assert_equals: expected "anywhere" but got "normal"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().overflowWrap</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-overflow-wrap">
<meta name="assert" content="overflow-wrap computed value is specified keyword.">
<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("overflow-wrap", "normal");
test_computed_value("overflow-wrap", "break-word");
test_computed_value("overflow-wrap", "anywhere");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property tab-size value '0' computes to '0'
PASS Property tab-size value '16' computes to '16'
PASS Property tab-size value '4' computes to '4'
FAIL Property tab-size value '2.5' computes to '2.5' assert_equals: expected "2.5" but got "8"
PASS Property tab-size value '0px' computes to '0px'
PASS Property tab-size value '10px' computes to '10px'
PASS Property tab-size value 'calc(10px + 0.5em)' computes to '30px'
PASS Property tab-size value 'calc(10px - 0.5em)' computes to '0px'
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().tabSize</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-tab-size">
<meta name="assert" content="tab-size computed value is the specified number or an absolute length.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<style>
#target {
font-size: 40px;
}
</style>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("tab-size", "0");
test_computed_value("tab-size", "16");
test_computed_value("tab-size", "4");
test_computed_value("tab-size", "2.5");
test_computed_value("tab-size", "0px");
test_computed_value("tab-size", "10px");
test_computed_value("tab-size", "calc(10px + 0.5em)", "30px");
test_computed_value("tab-size", "calc(10px - 0.5em)", "0px");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property text-align-last value 'auto' computes to 'auto'
PASS Property text-align-last value 'start' computes to 'start'
PASS Property text-align-last value 'end' computes to 'end'
PASS Property text-align-last value 'left' computes to 'left'
PASS Property text-align-last value 'right' computes to 'right'
PASS Property text-align-last value 'center' computes to 'center'
PASS Property text-align-last value 'justify' computes to 'justify'
FAIL Property text-align-last value 'match-parent' computes to 'match-parent' assert_equals: expected "match-parent" but got "auto"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().textAlignLast</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-text-align-last">
<meta name="assert" content="text-align-last computed value is specified keyword.">
<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-align-last", "auto");
test_computed_value("text-align-last", "start");
test_computed_value("text-align-last", "end");
test_computed_value("text-align-last", "left");
test_computed_value("text-align-last", "right");
test_computed_value("text-align-last", "center");
test_computed_value("text-align-last", "justify");
test_computed_value("text-align-last", "match-parent");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().textIndent</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-text-indent">
<meta name="assert" content="text-indent computed value is computed <length-percentage> value, plus any specified keywords.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<style>
#target {
font-size: 40px;
}
</style>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("text-indent", "10px");
test_computed_value("text-indent", "20%");
test_computed_value("text-indent", "calc(50% + 60px)");
test_computed_value("text-indent", "-30px");
test_computed_value("text-indent", "-40%");
test_computed_value("text-indent", "calc(10px - 0.5em)", "-10px");
test_computed_value("text-indent", "10px hanging");
test_computed_value("text-indent", "20% each-line");
test_computed_value("text-indent", "calc(50% + 60px) hanging each-line");
test_computed_value("text-indent", "each-line hanging calc(10px + 0.5em)", "30px hanging each-line");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property text-justify value 'auto' computes to 'auto'
PASS Property text-justify value 'none' computes to 'none'
PASS Property text-justify value 'inter-word' computes to 'inter-word'
FAIL Property text-justify value 'inter-character' computes to 'inter-character' assert_equals: expected "inter-character" but got "auto"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().textJustify</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-text-justify">
<meta name="assert" content="text-justify computed value is specified keyword.">
<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-justify", "auto");
test_computed_value("text-justify", "none");
test_computed_value("text-justify", "inter-word");
test_computed_value("text-justify", "inter-character");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property text-transform value 'none' computes to 'none'
PASS Property text-transform value 'capitalize' computes to 'capitalize'
PASS Property text-transform value 'uppercase' computes to 'uppercase'
PASS Property text-transform value 'lowercase' computes to 'lowercase'
FAIL Property text-transform value 'full-width' computes to 'full-width' assert_equals: expected "full-width" but got "none"
FAIL Property text-transform value 'full-size-kana' computes to 'full-size-kana' assert_equals: expected "full-size-kana" but got "none"
FAIL Property text-transform value 'capitalize full-width' computes to 'capitalize full-width' assert_equals: expected "capitalize full-width" but got "none"
FAIL Property text-transform value 'full-width full-size-kana' computes to 'full-width full-size-kana' assert_equals: expected "full-width full-size-kana" but got "none"
FAIL Property text-transform value 'uppercase full-width full-size-kana' computes to 'uppercase full-width full-size-kana' assert_equals: expected "uppercase full-width full-size-kana" but got "none"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().textTransform</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-text-transform">
<meta name="assert" content="text-transform computed value is specified keywords.">
<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-transform", "none");
test_computed_value("text-transform", "capitalize");
test_computed_value("text-transform", "uppercase");
test_computed_value("text-transform", "lowercase");
test_computed_value("text-transform", "full-width");
test_computed_value("text-transform", "full-size-kana");
test_computed_value("text-transform", "capitalize full-width");
test_computed_value("text-transform", "full-width full-size-kana");
test_computed_value("text-transform", "uppercase full-width full-size-kana");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().whiteSpace</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-white-space">
<meta name="assert" content="white-space computed value is specified keyword.">
<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("white-space", "normal");
test_computed_value("white-space", "pre");
test_computed_value("white-space", "nowrap");
test_computed_value("white-space", "pre-wrap");
test_computed_value("white-space", "break-spaces");
test_computed_value("white-space", "pre-line");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().wordBreak</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-word-break">
<meta name="assert" content="word-break computed value is specified keyword.">
<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("word-break", "normal");
test_computed_value("word-break", "keep-all");
test_computed_value("word-break", "break-all");
test_computed_value("word-break", "break-word");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().wordSpacing</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-word-spacing">
<meta name="assert" content="word-spacing computed value is an absolute length.">
<meta name="assert" content="'normal' computes to zero.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<style>
#target {
font-size: 40px;
}
</style>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("word-spacing", "normal", "0px");
test_computed_value("word-spacing", "10px");
test_computed_value("word-spacing", "-20px");
test_computed_value("word-spacing", "calc(10px - 0.5em)", "-10px");
</script>
</body>
</html>
This is a testharness.js-based test.
PASS Property word-wrap value 'normal' computes to 'normal'
PASS Property word-wrap value 'break-word' computes to 'break-word'
FAIL Property word-wrap value 'anywhere' computes to 'anywhere' assert_equals: expected "anywhere" but got "normal"
Harness: the test ran to completion.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Text: getComputedValue().wordWrap</title>
<link rel="help" href="https://www.w3.org/TR/css-text-3/#propdef-word-wrap">
<meta name="assert" content="word-wrap computed value is specified keyword.">
<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("word-wrap", "normal");
test_computed_value("word-wrap", "break-word");
test_computed_value("word-wrap", "anywhere");
</script>
</body>
</html>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment