Skip to content

Commit

Permalink
Rename form-sizing CSS property to field-sizing
Browse files Browse the repository at this point in the history
w3c/csswg-drafts#7542 (comment)

Bug: 1447058
Change-Id: Ia87e0fde1bd47eda5102da937365be268c9f92f4
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4930938
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Auto-Submit: Kent Tamura <tkent@chromium.org>
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1208923}
  • Loading branch information
tkent-google authored and chromium-wpt-export-bot committed Oct 12, 2023
1 parent 7c2914d commit b9e9226
Show file tree
Hide file tree
Showing 8 changed files with 41 additions and 41 deletions.
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<title>CSS UI: getComputedStyle().formSizing</title>
<title>CSS UI: getComputedStyle().fieldSizing</title>
<link rel="help" href="https://github.com/w3c/csswg-drafts/pull/9251">
<link rel="author" title="Kent Tamura" href="mailto:tkent@chromium.org">
<script src="/resources/testharness.js"></script>
Expand All @@ -8,7 +8,7 @@
<body>
<div id="target"></div>
<script>
test_computed_value('form-sizing', 'fixed');
test_computed_value('form-sizing', 'content');
test_computed_value('field-sizing', 'fixed');
test_computed_value('field-sizing', 'content');
</script>
</body>
18 changes: 18 additions & 0 deletions css/css-ui/parsing/field-sizing-invalid.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!DOCTYPE html>
<title>CSS UI: parsing field-sizing with invalid values</title>
<link rel="help" href="https://github.com/w3c/csswg-drafts/pull/9251">
<link rel="author" title="Kent Tamura" href="mailto:tkent@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
<body>
<script>
test_invalid_value('field-sizing', 'none');
test_invalid_value('field-sizing', 'legacy');
test_invalid_value('field-sizing', 'auto');
test_invalid_value('field-sizing', 'normal');
test_invalid_value('field-sizing', 'normal auto');
test_invalid_value('field-sizing', '100%');
test_invalid_value('field-sizing', '10px');
</script>
</body>
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
<!DOCTYPE html>
<title>CSS UI: parsing form-sizing with valid values</title>
<title>CSS UI: parsing field-sizing with valid values</title>
<link rel="help" href="https://github.com/w3c/csswg-drafts/pull/9251">
<link rel="author" title="Kent Tamura" href="mailto:tkent@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
<body>
<script>
test_valid_value('form-sizing', 'fixed');
test_valid_value('form-sizing', 'content');
test_valid_value('field-sizing', 'fixed');
test_valid_value('field-sizing', 'content');
</script>
</body>
18 changes: 0 additions & 18 deletions css/css-ui/parsing/form-sizing-invalid.html

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
.disable-default {
form-sizing: content;
field-sizing: content;
}

.small-placeholder {
Expand Down Expand Up @@ -51,7 +51,7 @@
test(() => {
let pair = addElements(`<input type=${type}>`);
// A text <input> has approximately 20ch width by default.
// A text <input> with form-sizing:content must be shorter than the default.
// A text <input> with field-sizing:content must be shorter than the default.
assert_less_than(pair.content.offsetWidth, pair.fixed.offsetWidth);
assert_equals(pair.content.offsetHeight, pair.fixed.offsetHeight);

Expand Down Expand Up @@ -142,7 +142,7 @@
element.classList.add('disable-default');
assert_less_than(element.offsetWidth, w);
assert_equals(element.offsetHeight, h);
}, `${type}: Update form-sizing property dynamically`);
}, `${type}: Update field-sizing property dynamically`);

});
</script>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
.disable-default {
form-sizing: content;
field-sizing: content;
}

.small-placeholder {
Expand Down Expand Up @@ -50,7 +50,7 @@
test(() => {
let pair = addElements(`<input type=${type}>`);
// A text <input> has approximately 20ch width by default.
// A text <input> with form-sizing:content must be shorter than the default.
// A text <input> with field-sizing:content must be shorter than the default.
assert_less_than(pair.content.offsetWidth, pair.fixed.offsetWidth);
assert_equals(pair.content.offsetHeight, pair.fixed.offsetHeight);

Expand Down Expand Up @@ -147,7 +147,7 @@
element.classList.add('disable-default');
assert_less_than(element.offsetWidth, w);
assert_equals(element.offsetHeight, h);
}, `${type}: Update form-sizing property dynamically`);
}, `${type}: Update field-sizing property dynamically`);

});
</script>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<body>
<style>
.disable-default {
form-sizing: content;
field-sizing: content;
}
</style>
<div id="container"></div>
Expand All @@ -18,7 +18,7 @@
test(() => {
const s = '<select>><option>1<option>quick brown<option>fox</select>';
container.innerHTML = s + s;
container.lastElementChild.style.formSizing = 'content';
container.lastElementChild.style.fieldSizing = 'content';
const widthForContent1 = container.lastElementChild.offsetWidth;
assert_greater_than(container.firstElementChild.offsetWidth,
widthForContent1);
Expand All @@ -31,11 +31,11 @@
container.innerHTML = '<select><option>foo<option>quick brown fox</select>';
const select = container.firstElementChild;
const initialWidth = select.offsetWidth;
select.style.formSizing = 'content';
select.style.fieldSizing = 'content';
assert_less_than(select.offsetWidth, initialWidth);
select.style.formSizing = 'fixed';
select.style.fieldSizing = 'fixed';
assert_equals(select.offsetWidth, initialWidth);
}, 'dropdown: Change the form-sizing value dynamically');
}, 'dropdown: Change the field-sizing value dynamically');

// Tests for list box =========================================================

Expand Down Expand Up @@ -76,11 +76,11 @@
container.innerHTML = '<select multiple><option>foo<option>quick brown fox</select>';
const select = container.firstElementChild;
const initialHeight = select.offsetHeight;
select.style.formSizing = 'content';
select.style.fieldSizing = 'content';
assert_less_than(select.offsetHeight, initialHeight);
select.style.formSizing = 'fixed';
select.style.fieldSizing = 'fixed';
assert_equals(select.offsetHeight, initialHeight);
}, 'listbox: Change the form-sizing value dynamically');
}, 'listbox: Change the field-sizing value dynamically');

}
</script>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<script src="/resources/testharnessreport.js"></script>
<style>
.disable-default {
form-sizing: content;
field-sizing: content;
}

.small-placeholder {
Expand Down Expand Up @@ -49,7 +49,7 @@
test(() => {
let pair = addElements('<textarea></textarea>');
// Historically a <textarea> has approximately 20ch x 2lh size by default.
// A <textarea> with form-sizing:content must be samller than the default.
// A <textarea> with field-sizing:content must be samller than the default.
assert_less_than(pair.content.offsetWidth, pair.fixed.offsetWidth);
assert_less_than(pair.content.offsetHeight, pair.fixed.offsetHeight);

Expand Down Expand Up @@ -136,6 +136,6 @@
element.classList.add('disable-default');
assert_less_than(element.offsetWidth, w);
assert_less_than(element.offsetHeight, h);
}, 'Update form-sizing property dynamically');
}, 'Update field-sizing property dynamically');
</script>
</body>

0 comments on commit b9e9226

Please sign in to comment.