Bug 1732267 - Make textarea::placeholder honor white-space. r=layout-reviewers,jfkthame

This comes from https://hg.mozilla.org/mozilla-central/rev/0f28fd24bdf3,
and was done because of implementation limitations which don't apply
anymore (https://bugzilla.mozilla.org/show_bug.cgi?id=737786#c33):

 * white-space changes don't reframe anymore, they only reflow.
 * We fixed reframing of native-anonymous content to do the right thing.

This aligns <textarea> and <input>, so I think it should be
uncontroversial.

See https://github.com/w3c/csswg-drafts/issues/6669 for the discussion
that prompted this.

Differential Revision: https://phabricator.services.mozilla.com/D126471
This commit is contained in:
Emilio Cobos Álvarez 2021-09-24 05:45:33 +00:00
Родитель a6fd1760f5
Коммит a2118a17fe
5 изменённых файлов: 25 добавлений и 9 удалений

Просмотреть файл

@ -1,12 +1,11 @@
<!DOCTYPE html>
<html>
<style>
:-moz-any(input, textarea)::placeholder {
:is(input, textarea)::placeholder {
visibility: hidden;
padding: 20px;
float: right;
overflow: visible;
white-space: pre;
/*
* This list could be endless given that all non-whitelisted properties

Просмотреть файл

@ -218,11 +218,6 @@ textarea::-moz-text-control-editing-root {
opacity: 0.54;
}
textarea::placeholder,
textarea::-moz-text-control-preview {
white-space: pre-wrap !important;
}
input:read-write,
textarea:read-write {
-moz-user-modify: read-write !important;

Просмотреть файл

@ -41,8 +41,7 @@ for (let prop in gCSSProperties) {
#test::placeholder { ${prop}: ${info.other_values[0]}; ${prereqs} }
`;
// line-height does apply to ::placeholder, but only on <textarea>. We could
// switch the test to use a <textarea> but then we'd need the same special-case
// for white-space.
// switch the test to use a <textarea>.
if (info.applies_to_placeholder && prop != "line-height") {
isnot(get_computed_value(test, prop),
get_computed_value(control, prop),

Просмотреть файл

@ -0,0 +1,8 @@
<!doctype html>
<title>CSS Test Reference</title>
<style>
textarea {
max-width: 100px;
}
</style>
<textarea placeholder="This is a really long string that needs to be truncated"></textarea>

Просмотреть файл

@ -0,0 +1,15 @@
<!doctype html>
<meta charset=utf-8>
<title>Textarea placeholder honors textarea's text-overflow</title>
<link rel=author href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
<link rel=author href="https://mozilla.com" title="Mozilla">
<link rel=mismatch href="placeholder-white-space-notref.html">
<link rel=help href="https://github.com/w3c/csswg-drafts/issues/6669">
<style>
textarea {
white-space: nowrap;
text-overflow: ellipsis;
max-width: 100px;
}
</style>
<textarea placeholder="This is a really long string that needs to be truncated"></textarea>