mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-14 22:05:44 +00:00
Bug 1453148: Let overflow parse two values. r=xidorn
Per https://github.com/w3c/csswg-drafts/issues/2484. MozReview-Commit-ID: D7M3PhnTtD2
This commit is contained in:
parent
fb8e77d0f3
commit
d8f9719a5b
@ -4208,8 +4208,9 @@ var gCSSProperties = {
|
||||
prerequisites: { "display": "block", "contain": "none" },
|
||||
subproperties: [ "overflow-x", "overflow-y" ],
|
||||
initial_values: [ "visible" ],
|
||||
other_values: [ "auto", "scroll", "hidden", "-moz-hidden-unscrollable", "-moz-scrollbars-none" ],
|
||||
invalid_values: []
|
||||
other_values: [ "auto", "scroll", "hidden", "-moz-hidden-unscrollable", "-moz-scrollbars-none",
|
||||
"auto auto", "auto scroll", "hidden scroll", "auto hidden" ],
|
||||
invalid_values: [ "-moz-hidden-unscrollable -moz-hidden-unscrollable", "-moz-hidden-unscrollable -moz-scrollbars-none" ]
|
||||
},
|
||||
"overflow-x": {
|
||||
domProp: "overflowX",
|
||||
|
@ -4,8 +4,11 @@
|
||||
|
||||
<%namespace name="helpers" file="/helpers.mako.rs" />
|
||||
|
||||
<%helpers:shorthand name="overflow" sub_properties="overflow-x overflow-y"
|
||||
spec="https://drafts.csswg.org/css-overflow/#propdef-overflow">
|
||||
<%helpers:shorthand
|
||||
name="overflow"
|
||||
sub_properties="overflow-x overflow-y"
|
||||
spec="https://drafts.csswg.org/css-overflow/#propdef-overflow"
|
||||
>
|
||||
use properties::longhands::overflow_x::parse as parse_overflow;
|
||||
% if product == "gecko":
|
||||
use properties::longhands::overflow_x::SpecifiedValue;
|
||||
@ -42,20 +45,23 @@
|
||||
return moz_kw_found
|
||||
}
|
||||
% endif
|
||||
let overflow = parse_overflow(context, input)?;
|
||||
let overflow_x = parse_overflow(context, input)?;
|
||||
let overflow_y =
|
||||
input.try(|i| parse_overflow(context, i)).unwrap_or(overflow_x);
|
||||
Ok(expanded! {
|
||||
overflow_x: overflow,
|
||||
overflow_y: overflow,
|
||||
overflow_x: overflow_x,
|
||||
overflow_y: overflow_y,
|
||||
})
|
||||
}
|
||||
|
||||
impl<'a> ToCss for LonghandsToSerialize<'a> {
|
||||
fn to_css<W>(&self, dest: &mut CssWriter<W>) -> fmt::Result where W: fmt::Write {
|
||||
if self.overflow_x == self.overflow_y {
|
||||
self.overflow_x.to_css(dest)
|
||||
} else {
|
||||
Ok(())
|
||||
self.overflow_x.to_css(dest)?;
|
||||
if self.overflow_x != self.overflow_y {
|
||||
dest.write_char(' ')?;
|
||||
self.overflow_y.to_css(dest)?;
|
||||
}
|
||||
Ok(())
|
||||
}
|
||||
}
|
||||
</%helpers:shorthand>
|
||||
|
@ -313623,6 +313623,12 @@
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-overflow/overflow-shorthand-001.html": [
|
||||
[
|
||||
"/css/css-overflow/overflow-shorthand-001.html",
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/css-position/position-sticky-bottom.html": [
|
||||
[
|
||||
"/css/css-position/position-sticky-bottom.html",
|
||||
@ -503530,6 +503536,10 @@
|
||||
"f51bc673da28b0471018cdf945b4449ab00ce717",
|
||||
"reftest"
|
||||
],
|
||||
"css/css-overflow/overflow-shorthand-001.html": [
|
||||
"6409ee499d3e853d8f4933f1b532e12ed9ab406b",
|
||||
"testharness"
|
||||
],
|
||||
"css/css-overflow/reference/input-scrollable-region-001-ref.html": [
|
||||
"31e24bb1a2cb6f42703cc05e055fcb345c770a22",
|
||||
"support"
|
||||
|
@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow Test: Overflow longhand accepts two values</title>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<link rel="author" title="Emilio Cobos Álvarez <emilio@crisal.io>">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow/#propdef-overflow">
|
||||
<div id="test-div"></div>
|
||||
<script>
|
||||
let div = document.getElementById("test-div");
|
||||
function testOverflowShorthand(x, y) {
|
||||
test(function() {
|
||||
div.style.overflowX = x;
|
||||
div.style.overflowY = y;
|
||||
|
||||
let expectedX = getComputedStyle(div).overflowX;
|
||||
let expectedY = getComputedStyle(div).overflowY;
|
||||
let expectedSerialization = x == y ? x : `${x} ${y}`;
|
||||
|
||||
assert_equals(div.style.overflow, expectedSerialization);
|
||||
|
||||
div.style.overflowX = "";
|
||||
div.style.overflowY = "";
|
||||
assert_equals(div.style.overflow, "");
|
||||
|
||||
div.style.overflow = `${x} ${y}`;
|
||||
assert_equals(div.style.overflow, expectedSerialization);
|
||||
assert_equals(getComputedStyle(div).overflowX, expectedX);
|
||||
assert_equals(getComputedStyle(div).overflowY, expectedY);
|
||||
}, `overflow: ${x} ${y} works`);
|
||||
}
|
||||
|
||||
let OVERFLOW_VALUES = [ "auto", "hidden", "scroll" ];
|
||||
for (let x of OVERFLOW_VALUES)
|
||||
for (let y of OVERFLOW_VALUES)
|
||||
testOverflowShorthand(x, y);
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user