diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/css-text/text-justify | |
| parent | Initial commit. (diff) | |
| download | firefox-upstream.tar.xz firefox-upstream.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-text/text-justify')
29 files changed, 749 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-text/text-justify/distribute-alias.tentative.html b/testing/web-platform/tests/css/css-text/text-justify/distribute-alias.tentative.html new file mode 100644 index 0000000000..62854b52c7 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/distribute-alias.tentative.html @@ -0,0 +1,14 @@ +<!doctype html> +<link rel=author href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez"> +<link rel=author href="https://mozilla.org" title="Mozilla"> +<link rel=help href="https://github.com/w3c/csswg-drafts/issues/6156"> +<title>text-justify: distribute is a parse-time alias of inter-character</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script> + test(function() { + let style = document.createElement("div").style; + style.textJustify = "distribute"; + assert_equals(style.textJustify, "inter-character"); + }); +</script> diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-006-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-006-ref.html new file mode 100644 index 0000000000..595485c5f4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-006-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + font: 20px/1 Ahem; + white-space: pre; +} +#ref { + color: orange; +} +#test { + color: blue; +} + +/* this is just filler content to have an invisible last line, as jutification does not affect the last line */ +a { color: white; } +</style> + +<p>Test passes if the the blue and orange boxes are aligned. + +<div id=ref>X X X X</div> +<div id=test>X X X X</div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-001-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-001-ref.html new file mode 100644 index 0000000000..de1aa16466 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-001-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +div { + width: 7ch; + font: 20px monospace; + background: blue; +} +span { + background: green; +} +</style> + +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div><span>XX XX <br>XXX</span></div> + diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-003-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-003-ref.html new file mode 100644 index 0000000000..6dc81769a0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-003-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +div { + width: 7ch; + font: 20px monospace; + background: blue; + margin-left: 20px; + direction: rtl; +} +span { + background: green; +} +</style> + +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div><span>XX XX <br>XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-005-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-005-ref.html new file mode 100644 index 0000000000..593ed2befd --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-005-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +@font-face { + font-family: 'ezra_silregular'; + src: url('/fonts/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} +div { + font-family: ezra_silregular, monospace; + font-size: 15px; +} +</style> + +<p>Test passes if we have a first line with hebrew justified and XXX in the second line (left-edge trailing space if not removed)</p> +<div style="position: relative; width: 20px;"> + <div style="display: inline; background: green; position: absolute; right: 0px;"> </div> +</div> +<div style="position: relative; margin-left: 20px; width: 70px;"> + <div style="float: right; background: green;">הם</div> + <div style="background: green;">דה<br></div> +</div> +<div style="position: relative; margin-left: 20px; background: blue; width: 70px; direction: rtl;"> + <div style="display: inline; background: green; ">XXX</div> +</div> + diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-001-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-001-ref.html new file mode 100644 index 0000000000..b05af606a3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-001-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +div { + width: 7ch; + font: 20px monospace; + background: blue; +} +span { + background: green; +} +</style> + +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div><span>XX XX<br>XXX</span></div> + diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-003-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-003-ref.html new file mode 100644 index 0000000000..d4dbf95417 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-003-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +div { + width: 7ch; + font: 20px monospace; + background: blue; + margin-left: 20px; + direction: rtl; +} +span { + background: green; +} +</style> + +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div><span>XX XX<br>XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-005-ref.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-005-ref.html new file mode 100644 index 0000000000..e3131010d3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-and-trailing-spaces-alt-005-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>test reference</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<style> +@font-face { + font-family: 'ezra_silregular'; + src: url('/fonts/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} +div { + font-family: ezra_silregular, monospace; + font-size: 15px; +} +</style> + +<p>Test passes if we have a first line with hebrew justified and XXX in the second line (left-edge trailing space if not removed)</p> +<div style="position: relative; margin-left: 20px; width: 70px;"> + <div style="float: right; background: green;">הם</div> + <div style="background: green;">דה<br></div> +</div> +<div style="position: relative; margin-left: 20px; background: blue; width: 70px; direction: rtl;"> + <div style="display: inline; background: green; ">XXX</div> +</div> + diff --git a/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-ref-001.html b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-ref-001.html new file mode 100644 index 0000000000..976df7f4dc --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/reference/text-justify-ref-001.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: none</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style type='text/css'> +.test, .ref { border: 1px solid orange; margin: 20px; width: 290px; color: orange; font: 24px/24px Ahem; } +.ref { position: relative; height: 72px; } +.rb1 { position: absolute; top: 0; left: 0; background-color: orange; width: 72px; height: 72px; } +.rb2 { position: absolute; top: 0; left: 96px; background-color: orange; width: 72px; height: 72px; } +.rb3 { position: absolute; top: 0; left: 192px; background-color: orange; width: 72px; height: 48px; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the shading in both orange boxes looks the same.</div> +<div class="ref"><div class="rb1"></div><div class="rb2"></div><div class="rb3"></div></div> +<div class="ref"><div class="rb1"></div><div class="rb2"></div><div class="rb3"></div></div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-001.html new file mode 100644 index 0000000000..4c1d46525d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-001.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: none</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-align-property'> +<link rel='match' href='reference/text-justify-ref-001.html'> +<meta name="assert" content="text-justify:none means justification is disabled: there are no justification opportunities within the text."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style type='text/css'> +.test { text-align: justify; text-justify: none; } +/* the CSS below is not part of the test */ +.test, .ref { border: 1px solid orange; margin: 20px; width: 290px; color: orange; font: 24px/24px Ahem; } +.ref { position: relative; height: 72px; } +#rb1 { position: absolute; top: 0; left: 0; background-color: orange; width: 72px; height: 72px; } +#rb2 { position: absolute; top: 0; left: 96px; background-color: orange; width: 72px; height: 72px; } +#rb3 { position: absolute; top: 0; left: 192px; background-color: orange; width: 72px; height: 48px; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the shading in both orange boxes looks the same.</div> +<div class="test">XXX XXX XXX XXX XXX XXX XXX XXX</div> +<div class="ref"><div id="rb1"></div><div id="rb2"></div><div id="rb3"></div></div> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-002.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-002.html new file mode 100644 index 0000000000..91b6381e7c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-002.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: inter-character</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-align-property'> +<meta name="assert" content="text-justify:inter-character means justification adjusts spacing between each pair of adjacent typographic character units."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style type='text/css'> +.test { text-align: justify; text-justify: inter-character; } +/* the CSS below is not part of the test */ +.test { border: 1px solid blue; margin: 20px; width: 290px; color: blue; font: 24px/24px Ahem; } +</style> +</head> +<body> +<div id='instructions'>Test passes if, on the first line only, the last box is flush with the right edge, and the line is composed of boxes about one third the size of those on the second line, and with small gaps between each.</div> +<div class="test">XXX XXX XXX XXX XXX</div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-003.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-003.html new file mode 100644 index 0000000000..41dfdf0622 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-003.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: distribute</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-align-property'> +<meta name="assert" content="text-justify:distribute means justification adjusts spacing between each pair of adjacent typographic character units."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style type='text/css'> +.test { text-align: justify; text-justify: distribute; } +/* the CSS below is not part of the test */ +.test { border: 1px solid blue; margin: 20px; width: 290px; color: blue; font: 24px/24px Ahem; } +</style> +</head> +<body> +<div id='instructions'>Test passes if, on the first line only, the last box is flush with the right edge, and the line is composed of boxes about one third the size of those on the second line, and with small gaps between each.</div> +<div class="test">XXX XXX XXX XXX XXX</div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-004.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-004.html new file mode 100644 index 0000000000..497320feb9 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-004.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: inter-character, arabic</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-align-property'> +<meta name="assert" content="text-justify:inter-character means justification adjusts spacing between each pair of adjacent typographic character units. Justification must not introduce gaps between the joined typographic letter units of cursive scripts such as Arabic."> +<style type='text/css'> +.test { text-align: justify; text-justify: inter-character; } +/* the CSS below is not part of the test */ +.test { border: 1px solid blue; margin: 20px; width: 290px; font-size: 28px; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the sequence مممممع has no gaps in it.</div> +<div class="test">مممممع مممممع مممممع مممممع مممممع</div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-005.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-005.html new file mode 100644 index 0000000000..afbc036cce --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-005.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>text-justify: distribute, arabic</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-align-property'> +<meta name="assert" content="text-justify:distribute means justification adjusts spacing between each pair of adjacent typographic character units. Justification must not introduce gaps between the joined typographic letter units of cursive scripts such as Arabic."> +<style type='text/css'> +.test { text-align: justify; text-justify: distribute; } +/* the CSS below is not part of the test */ +.test { border: 1px solid blue; margin: 20px; width: 290px; font-size: 28px; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the sequence مممممع has no gaps in it.</div> +<div class="test">مممممع مممممع مممممع مممممع مممممع</div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-006.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-006.html new file mode 100644 index 0000000000..7744f52afe --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-006.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: text-justify applies inline</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-006-ref.html'> +<meta name="assert" content="text-justify applies to inline elements"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + font: 20px/1 Ahem; + width: 11ch; +} +#ref { + white-space: pre; + color: orange; +} +#test { + text-align: justify; + color: blue; +} +span { + text-justify: none; +} + +/* this is just filler content to have an invisible last line, as jutification does not affect the last line */ +a { color: white; } +</style> + +<p>Test passes if the the blue and orange boxes are aligned. + +<div id=ref>X X X X</div> +<div id=test>X <span>X X</span> X <a>###########</a></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-001.html new file mode 100644 index 0000000000..3c7dd9d316 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-001.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-001-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-001-ref.html'> +<meta name="assert" content="The text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +.test { + width: 7ch; + font: 20px monospace; + background: blue; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>XX XX </span><span>XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-002.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-002.html new file mode 100644 index 0000000000..b596b33f95 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-002.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-001-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-001-ref.html'> +<meta name="assert" content="The text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +.test { + width: 7ch; + font: 20px monospace; + background: blue; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>XX XX XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-003.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-003.html new file mode 100644 index 0000000000..1768ca3238 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-003.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-003-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-003-ref.html'> +<meta name="assert" content="The RTL text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +.test { + width: 7ch; + font: 20px monospace; + background: blue; + margin-left: 20px; + + direction: rtl; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>XX XX </span><span>XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-004.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-004.html new file mode 100644 index 0000000000..d2f614ae94 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-004.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-003-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-003-ref.html'> +<meta name="assert" content="The RTL text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +.test { + width: 7ch; + font: 20px monospace; + background: blue; + margin-left: 20px; + + direction: rtl; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have XX at each edge of the blue box and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>XX XX XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-005.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-005.html new file mode 100644 index 0000000000..496c9e240e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-005.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-005-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-005-ref.html'> +<meta name="assert" content="The RTL text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +@font-face { + font-family: 'ezra_silregular'; + src: url('/fonts/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} +.test { + width: 70px; + font-family: ezra_silregular, monospace; + font-size: 15px; + background: blue; + margin-left: 20px; + + direction: rtl; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have a first line with hebrew justified and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>הם דה </span><span>XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-006.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-006.html new file mode 100644 index 0000000000..83dfaed80a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-and-trailing-spaces-006.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>CSS text tests: How trailing spaces affect text-justify </title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-justify-property'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-005-ref.html'> +<link rel='match' href='reference/text-justify-and-trailing-spaces-alt-005-ref.html'> +<meta name="assert" content="The RTL text in the first line is correctly justified, leaving aside the trailing space, which must hang or be removed."> +<style> +@font-face { + font-family: 'ezra_silregular'; + src: url('/fonts/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} +.test { + width: 70px; + font-family: ezra_silregular, monospace; + font-size: 15px; + background: blue; + margin-left: 20px; + + direction: rtl; + + white-space: pre-wrap; + text-align: justify; +} +.test > span { + background: green;; +} +</style> +<p>Test passes if we have a first line with hebrew justified and XXX in the second line (left-edge trailing space if not removed)</p> +<div class="test"><span>הם דה XXX</span></div> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-distribute-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-distribute-001.html new file mode 100644 index 0000000000..4d29f0fee5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-distribute-001.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: distribute</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#text-justify-property"> +<link rel='match' href='text-justify-inter-character-001-ref.html'> +<meta name="assert" content="text-justify:distribute means justification adjusts spacing between each pair of adjacent typographic character units."> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.test { + text-align-last: justify; + text-justify: distribute; +} +</style> +</head> +<body> +<p lang="en" class="test">XX</p> +<p lang="ja" class="test">文字</p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001-ref.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001-ref.html new file mode 100644 index 0000000000..0a42a5cf8c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: inter-character</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.right { + float: right; +} +</style> +</head> +<body> +<p lang="en">X<span class="right">X</span></p> +<p lang="ja">文<span class="right">字</span></p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001.html new file mode 100644 index 0000000000..639ab7ecb7 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-character-001.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: inter-character</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#text-justify-property"> +<link rel='match' href='text-justify-inter-character-001-ref.html'> +<meta name="assert" content="text-justify:inter-character means justification adjusts spacing between each pair of adjacent typographic character units."> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.test { + text-align-last: justify; + text-justify: inter-character; +} +</style> +</head> +<body> +<p lang="en" class="test">XX</p> +<p lang="ja" class="test">文字</p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001-ref.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001-ref.html new file mode 100644 index 0000000000..687e864e7d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: inter-word</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.right { + float: right; +} +</style> +</head> +<body> +<p lang="en">Latin<span class="right">text</span></p> +<p lang="ja">日本<span class="right">文字</span></p> +<p lang="th">อักษรไทย<span class="right">อักษรไทย</span></p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001.html new file mode 100644 index 0000000000..75aec2f5f6 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-inter-word-001.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: inter-word</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#text-justify-property"> +<link rel='match' href='text-justify-inter-word-001-ref.html'> +<meta name="assert" content="text-justify:inter-word means justification adjusts spacing at word separators only."> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.test { + text-align-last: justify; + text-justify: inter-word; +} +</style> +</head> +<body> +<p lang="en" class="test">Latin text</p> +<p lang="ja" class="test">日本 文字</p> +<p lang="th" class="test">อักษรไทย อักษรไทย</p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-interpolation.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-interpolation.html new file mode 100644 index 0000000000..cb6103f0c0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-interpolation.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>text-justify interpolation</title> + <link rel="author" title="Kiet Ho" href="mailto:tho22@apple.com"> + <link rel="help" href="https://drafts.csswg.org/css-text/#text-justify-property"> + <meta name="assert" content="text-justify supports discrete animation"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="/css/support/interpolation-testcommon.js"></script> + </head> + <body> + <script> + test_no_interpolation({ + property: 'text-justify', + from: 'auto', + to: 'inter-word' + }); + + test_no_interpolation({ + property: 'text-justify', + from: 'auto', + to: 'inter-character' + }); + + test_no_interpolation({ + property: 'text-justify', + from: 'inter-character', + to: 'distribute' + }); + + test_no_interpolation({ + property: 'text-justify', + from: 'inter-word', + to: 'distribute' + }); + + test_no_interpolation({ + property: 'text-justify', + from: 'distribute', + to: 'none' + }); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001-ref.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001-ref.html new file mode 100644 index 0000000000..c8500ac9f3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: none</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +</style> +</head> +<body> +<p lang="en">Latin text</p> +<p lang="ja">日本 文字</p> +<p lang="th">อักษรไทย อักษรไทย</p> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001.html b/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001.html new file mode 100644 index 0000000000..2b55111954 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/text-justify/text-justify-none-001.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS Text 7.4. Justification Method: text-justify: none</title> +<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com"> +<link rel="author" title="Mozilla" href="https://www.mozilla.org"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#text-justify-property"> +<link rel='match' href='text-justify-none-001-ref.html'> +<meta name="assert" content="text-justify:none means justification is disabled: there are no justification opportunities within the text."> +<style type='text/css'> +p { + font-size: 1.5em; + border: 1px solid black; + padding: 10px; + margin-right: 310px; +} +.test { + text-align-last: justify; + text-justify: none; +} +</style> +</head> +<body> +<p lang="en" class="test">Latin text</p> +<p lang="ja" class="test">日本 文字</p> +<p lang="th" class="test">อักษรไทย อักษรไทย</p> +</body> +</html> |