зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1474512 [wpt PR 11877] - [css-text] A leading white-space should break before handling overflow, a=testonly
Automatic update from web-platform-tests[css-text] A leading white-space should break before handling overflow Leading white-spaces are indeed breaking opportunities that should prevent, if there are no other css properties forcing it, breaking text in the middle of a word when honoring the word-wrap/overflow-wrap CSS property. We are doing so if the leading white-space sequence is longer than 1 character, but when we have a single leading white-space, we are missing that breaking opportunity and we may lead to cases, like the one described in the bug. However, this breaking opportunity should be considered together with other provided by the word-break CSS property (eg, break-word or break-all). There is a discussion [1] in the CSS WG github about this issue, which provides an interoperability analysis of a few cases where a single leading white-space character may produce different results, depending on the browser and the combination of line-breaking properties. [1] https://github.com/w3c/csswg-drafts/issues/2907 Bug: 854624 Change-Id: I49ec8282e899a32990662c104b48cab04057b909 Reviewed-on: https://chromium-review.googlesource.com/1130515 Commit-Queue: Javier Fernandez <jfernandez@igalia.com> Reviewed-by: Koji Ishii <kojii@chromium.org> Cr-Commit-Position: refs/heads/master@{#575596} -- wpt-commits: df5392444342a1c00422096a2febb9ceb0edf250 wpt-pr: 11877
This commit is contained in:
Родитель
b905aac610
Коммит
851fb8ca7b
|
@ -135091,6 +135091,18 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/overflow-wrap/overflow-wrap-break-word-004.html": [
|
||||
[
|
||||
"/css/css-text/overflow-wrap/overflow-wrap-break-word-004.html",
|
||||
[
|
||||
[
|
||||
"/css/css-text/overflow-wrap/reference/overflow-wrap-break-word-001-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/overflow-wrap/overflow-wrap-break-word-fit-content-001.html": [
|
||||
[
|
||||
"/css/css-text/overflow-wrap/overflow-wrap-break-word-fit-content-001.html",
|
||||
|
@ -137215,6 +137227,30 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/word-break/word-break-break-all-010.html": [
|
||||
[
|
||||
"/css/css-text/word-break/word-break-break-all-010.html",
|
||||
[
|
||||
[
|
||||
"/css/css-text/word-break/reference/word-break-break-all-010-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/word-break/word-break-break-all-011.html": [
|
||||
[
|
||||
"/css/css-text/word-break/word-break-break-all-011.html",
|
||||
[
|
||||
[
|
||||
"/css/css-text/word-break/reference/word-break-break-all-010-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/word-break/word-break-keep-all-000.html": [
|
||||
[
|
||||
"/css/css-text/word-break/word-break-keep-all-000.html",
|
||||
|
@ -258679,6 +258715,11 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/word-break/reference/word-break-break-all-010-ref.html": [
|
||||
[
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-text/word-break/reference/word-break-break-all-ref-000.html": [
|
||||
[
|
||||
{}
|
||||
|
@ -533236,6 +533277,10 @@
|
|||
"63bbe4f7fb67f33217876af58c1de4d032c369f4",
|
||||
"reftest"
|
||||
],
|
||||
"css/css-text/overflow-wrap/overflow-wrap-break-word-004.html": [
|
||||
"ca2b98f9db6ac13da149380dab3311301d741045",
|
||||
"reftest"
|
||||
],
|
||||
"css/css-text/overflow-wrap/overflow-wrap-break-word-fit-content-001.html": [
|
||||
"9f88a667825f8cb725dc348e17081e1a25b3f4de",
|
||||
"reftest"
|
||||
|
@ -534800,6 +534845,10 @@
|
|||
"5ad54c7b9197746f66fa30628b6059a369f5bd36",
|
||||
"support"
|
||||
],
|
||||
"css/css-text/word-break/reference/word-break-break-all-010-ref.html": [
|
||||
"0b16a0bdb25ddd647ad96dd82e3430274667ee87",
|
||||
"support"
|
||||
],
|
||||
"css/css-text/word-break/reference/word-break-break-all-ref-000.html": [
|
||||
"765afbeeede3d3dd8ad33b88927d6eb8e5435463",
|
||||
"support"
|
||||
|
@ -534976,6 +535025,14 @@
|
|||
"fd5f0cf9f57152d3c6df7c4b59c0fe70733bf9f4",
|
||||
"manual"
|
||||
],
|
||||
"css/css-text/word-break/word-break-break-all-010.html": [
|
||||
"f9eedfe8e72bcf6693f8049bfdf2e1efdf3084ef",
|
||||
"reftest"
|
||||
],
|
||||
"css/css-text/word-break/word-break-break-all-011.html": [
|
||||
"047e950374d902e426287900a2d03c63726420a2",
|
||||
"reftest"
|
||||
],
|
||||
"css/css-text/word-break/word-break-keep-all-000.html": [
|
||||
"219e6b0435541a834ebbee114b0dd40e15956f75",
|
||||
"reftest"
|
||||
|
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word</title>
|
||||
<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-break-word">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-001-ref.html">
|
||||
<meta name="assert" content="A Single leading white-space constitutes a soft breaking opportunity, honoring the 'white-space: pre-wrap' property, that must prevent the word to be broken.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
.red {
|
||||
position: absolute;
|
||||
background: green;
|
||||
color: red;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: -1;
|
||||
}
|
||||
.test {
|
||||
color: green;
|
||||
line-height: 1em;
|
||||
width: 5ch;
|
||||
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div class="red"><br>XXXXX</div>
|
||||
<div class="test"> XXXXX </div>
|
||||
</body>
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Reference File</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div></div>
|
||||
</body>
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word</title>
|
||||
<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-word-break-break-all">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/word-break-break-all-010-ref.html">
|
||||
<meta name="assert" content="The word is broken even if pre-wrap provides a former breaking opportunity in leading white-space.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
.red {
|
||||
position: absolute;
|
||||
white-space: pre;
|
||||
background: green;
|
||||
color: red;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: -1;
|
||||
}
|
||||
.test {
|
||||
color: green;
|
||||
line-height: 1em;
|
||||
width: 5ch;
|
||||
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div class="red"> XXXX<br>X</div>
|
||||
<div class="test"> XXXXX</div>
|
||||
</body>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word</title>
|
||||
<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-word-break-break-all">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/word-break-break-all-010-ref.html">
|
||||
<meta name="assert" content="A single leading white-space should account as soft breaking opportunity, honoring the 'white-space: pre-wrap', on top to the ones provided by 'word-break: break-all'.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
.red {
|
||||
position: absolute;
|
||||
background: green;
|
||||
color: red;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: -1;
|
||||
}
|
||||
.test {
|
||||
color: green;
|
||||
background: green;
|
||||
line-height: 1em;
|
||||
width: 1ch;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div class="red">X<br>X<br>X</div>
|
||||
<div class="test"> XX</div>
|
||||
</body>
|
Загрузка…
Ссылка в новой задаче