mirror of
https://github.com/servo/servo.git
synced 2025-08-06 22:15:33 +01:00
Auto merge of #18131 - emilio:calc-serialization, r=canaltinova
style: Multiple calc serialization fixes. This puts us in line with the spec as written, except for caveat in https://github.com/w3c/csswg-drafts/issues/1731. Need to fix computed calc() too, I'm less confident that we won't need to change test expectations. <!-- Reviewable:start --> --- This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/18131) <!-- Reviewable:end -->
This commit is contained in:
bors-servo
GitHub
commit
92176d1152
8 changed files with 122 additions and 46 deletions
26
Cargo.lock
generated
26
Cargo.lock
generated
|
|
@ -57,7 +57,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
|
|||
|
||||
[[package]]
|
||||
name = "app_units"
|
||||
version = "0.5.2"
|
||||
version = "0.5.3"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
dependencies = [
|
||||
"heapsize 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -1052,7 +1052,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
|
|||
name = "gfx"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bitflags 0.7.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"byteorder 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"core-foundation 0.3.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -1451,7 +1451,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
|
|||
name = "layout"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"atomic_refcell 0.1.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bitflags 0.8.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"canvas_traits 0.0.1",
|
||||
|
|
@ -1501,7 +1501,7 @@ dependencies = [
|
|||
name = "layout_thread"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"atomic_refcell 0.1.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"euclid 0.15.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"fnv 1.0.5 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -2461,7 +2461,7 @@ name = "script"
|
|||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"angle 0.5.0 (git+https://github.com/servo/angle?branch=servo)",
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"audio-video-metadata 0.1.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"base64 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bitflags 0.7.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -2541,7 +2541,7 @@ dependencies = [
|
|||
name = "script_layout_interface"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"atomic_refcell 0.1.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"canvas_traits 0.0.1",
|
||||
"cssparser 0.19.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -2851,7 +2851,7 @@ dependencies = [
|
|||
name = "servo_geometry"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"euclid 0.15.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"heapsize 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
]
|
||||
|
|
@ -3007,7 +3007,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
|
|||
name = "style"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"arraydeque 0.2.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"arrayvec 0.3.23 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"atomic_refcell 0.1.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -3069,7 +3069,7 @@ dependencies = [
|
|||
name = "style_tests"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"byteorder 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"cssparser 0.19.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"euclid 0.15.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -3091,7 +3091,7 @@ dependencies = [
|
|||
name = "style_traits"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bitflags 0.7.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"cssparser 0.19.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"euclid 0.15.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -3483,7 +3483,7 @@ name = "webrender"
|
|||
version = "0.48.1"
|
||||
source = "git+https://github.com/servo/webrender#48808d144c83bbcc06524cb32c945144b44b51a5"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bincode 0.8.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bit-set 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bitflags 0.9.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -3512,7 +3512,7 @@ name = "webrender_api"
|
|||
version = "0.48.1"
|
||||
source = "git+https://github.com/servo/webrender#48808d144c83bbcc06524cb32c945144b44b51a5"
|
||||
dependencies = [
|
||||
"app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"bincode 0.8.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"byteorder 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"core-foundation 0.3.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
|
@ -3651,7 +3651,7 @@ dependencies = [
|
|||
"checksum angle 0.5.0 (git+https://github.com/servo/angle?branch=servo)" = "<none>"
|
||||
"checksum ansi_term 0.9.0 (registry+https://github.com/rust-lang/crates.io-index)" = "23ac7c30002a5accbf7e8987d0632fa6de155b7c3d39d0067317a391e00a2ef6"
|
||||
"checksum antidote 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)" = "34fde25430d87a9388dadbe6e34d7f72a462c8b43ac8d309b42b0a8505d7e2a5"
|
||||
"checksum app_units 0.5.2 (registry+https://github.com/rust-lang/crates.io-index)" = "813ec2cdca52df57e839c4f4083b47cd7b2c2ae5409cee26f50a020144a8e631"
|
||||
"checksum app_units 0.5.3 (registry+https://github.com/rust-lang/crates.io-index)" = "7ff4f3fe57393a150b39b026b6f6f4b9a6c4f49b52d0a4e2d61d08d926358438"
|
||||
"checksum arraydeque 0.2.3 (registry+https://github.com/rust-lang/crates.io-index)" = "96e774cadb24c2245225280c6799793f9802b918a58a79615e9490607489a717"
|
||||
"checksum arrayvec 0.3.23 (registry+https://github.com/rust-lang/crates.io-index)" = "699e63a93b79d717e8c3b5eb1b28b7780d0d6d9e59a72eb769291c83b0c8dc67"
|
||||
"checksum aster 0.41.0 (registry+https://github.com/rust-lang/crates.io-index)" = "4ccfdf7355d9db158df68f976ed030ab0f6578af811f5a7bb6dcf221ec24e0e0"
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ servo = ["serde", "heapsize", "heapsize_derive",
|
|||
gecko_debug = ["nsstring_vendor/gecko_debug"]
|
||||
|
||||
[dependencies]
|
||||
app_units = "0.5.2"
|
||||
app_units = "0.5.3"
|
||||
arrayvec = "0.3.20"
|
||||
arraydeque = "0.2.3"
|
||||
atomic_refcell = "0.1"
|
||||
|
|
|
|||
|
|
@ -195,11 +195,21 @@ impl From<LengthOrPercentageOrNone> for Option<CalcLengthOrPercentage> {
|
|||
|
||||
impl ToCss for CalcLengthOrPercentage {
|
||||
fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
|
||||
match (self.length, self.percentage) {
|
||||
(l, Some(p)) if l == Au(0) => p.to_css(dest),
|
||||
(l, Some(p)) => write!(dest, "calc({}px + {}%)", Au::to_px(l), p.0 * 100.),
|
||||
(l, None) => write!(dest, "{}px", Au::to_px(l)),
|
||||
}
|
||||
use num_traits::Zero;
|
||||
|
||||
let (length, percentage) = match (self.length, self.percentage) {
|
||||
(l, None) => return l.to_css(dest),
|
||||
(l, Some(p)) if l == Au(0) => return p.to_css(dest),
|
||||
(l, Some(p)) => (l, p),
|
||||
};
|
||||
|
||||
dest.write_str("calc(")?;
|
||||
percentage.to_css(dest)?;
|
||||
|
||||
dest.write_str(if length < Zero::zero() { " - " } else { " + " })?;
|
||||
length.abs().to_css(dest)?;
|
||||
|
||||
dest.write_str(")")
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ use values::CSSFloat;
|
|||
use values::animated::ToAnimatedZero;
|
||||
|
||||
/// A computed percentage.
|
||||
#[derive(Clone, ComputeSquaredDistance, Copy, Debug, Default, HasViewportPercentage, PartialEq)]
|
||||
#[derive(Clone, ComputeSquaredDistance, Copy, Debug, Default, HasViewportPercentage, PartialEq, PartialOrd)]
|
||||
#[cfg_attr(feature = "servo", derive(Deserialize, HeapSizeOf, Serialize))]
|
||||
pub struct Percentage(pub CSSFloat);
|
||||
|
||||
|
|
@ -27,6 +27,12 @@ impl Percentage {
|
|||
pub fn hundred() -> Self {
|
||||
Percentage(1.)
|
||||
}
|
||||
|
||||
/// Returns the absolute value for this percentage.
|
||||
#[inline]
|
||||
pub fn abs(&self) -> Self {
|
||||
Percentage(self.0.abs())
|
||||
}
|
||||
}
|
||||
|
||||
/// https://drafts.csswg.org/css-transitions/#animtype-percentage
|
||||
|
|
|
|||
|
|
@ -90,16 +90,26 @@ impl HasViewportPercentage for CalcLengthOrPercentage {
|
|||
}
|
||||
|
||||
impl ToCss for CalcLengthOrPercentage {
|
||||
/// https://drafts.csswg.org/css-values/#calc-serialize
|
||||
///
|
||||
/// FIXME(emilio): Should this simplify away zeros?
|
||||
#[allow(unused_assignments)]
|
||||
fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
|
||||
use num_traits::Zero;
|
||||
|
||||
let mut first_value = true;
|
||||
macro_rules! first_value_check {
|
||||
() => {
|
||||
($val:expr) => {
|
||||
if !first_value {
|
||||
dest.write_str(" + ")?;
|
||||
} else {
|
||||
first_value = false;
|
||||
dest.write_str(if $val < Zero::zero() {
|
||||
" - "
|
||||
} else {
|
||||
" + "
|
||||
})?;
|
||||
} else if $val < Zero::zero() {
|
||||
dest.write_str("-")?;
|
||||
}
|
||||
first_value = false;
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -107,8 +117,8 @@ impl ToCss for CalcLengthOrPercentage {
|
|||
( $( $val:ident ),* ) => {
|
||||
$(
|
||||
if let Some(val) = self.$val {
|
||||
first_value_check!();
|
||||
val.to_css(dest)?;
|
||||
first_value_check!(val);
|
||||
val.abs().to_css(dest)?;
|
||||
dest.write_str(stringify!($val))?;
|
||||
}
|
||||
)*
|
||||
|
|
@ -117,7 +127,16 @@ impl ToCss for CalcLengthOrPercentage {
|
|||
|
||||
dest.write_str("calc(")?;
|
||||
|
||||
serialize!(ch, em, ex, rem, vh, vmax, vmin, vw);
|
||||
// NOTE(emilio): Percentages first because of web-compat problems, see:
|
||||
// https://github.com/w3c/csswg-drafts/issues/1731
|
||||
if let Some(val) = self.percentage {
|
||||
first_value_check!(val.0);
|
||||
val.abs().to_css(dest)?;
|
||||
}
|
||||
|
||||
// NOTE(emilio): The order here it's very intentional, and alphabetic
|
||||
// per the spec linked above.
|
||||
serialize!(ch, em, ex);
|
||||
|
||||
#[cfg(feature = "gecko")]
|
||||
{
|
||||
|
|
@ -125,16 +144,13 @@ impl ToCss for CalcLengthOrPercentage {
|
|||
}
|
||||
|
||||
if let Some(val) = self.absolute {
|
||||
first_value_check!();
|
||||
val.to_css(dest)?;
|
||||
first_value_check!(val);
|
||||
val.abs().to_css(dest)?;
|
||||
}
|
||||
|
||||
if let Some(val) = self.percentage {
|
||||
first_value_check!();
|
||||
val.to_css(dest)?;
|
||||
}
|
||||
serialize!(rem, vh, vmax, vmin, vw);
|
||||
|
||||
write!(dest, ")")
|
||||
dest.write_str(")")
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -13512,6 +13512,12 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/calc-serialization.html": [
|
||||
[
|
||||
"/_mozilla/css/calc-serialization.html",
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/empty-keyframes.html": [
|
||||
[
|
||||
"/_mozilla/css/empty-keyframes.html",
|
||||
|
|
@ -22847,6 +22853,10 @@
|
|||
"b9e77c824d0c96e51d51fb8f1e923d3ab67be027",
|
||||
"testharness"
|
||||
],
|
||||
"css/calc-serialization.html": [
|
||||
"628597eb36bf21a1ec982c7f6935ee7949c62044",
|
||||
"testharness"
|
||||
],
|
||||
"css/canvas_as_block_element_a.html": [
|
||||
"668d93da2dab9722998cc7c5785c20e2ab9a1ced",
|
||||
"reftest"
|
||||
|
|
@ -26508,7 +26518,7 @@
|
|||
"testharness"
|
||||
],
|
||||
"mozilla/calc.html": [
|
||||
"5d59d5b367a023e778ce6968acdeca6b8b7c3197",
|
||||
"5b3ea33205a9f2404bd6976a2c7f6fc451be8e96",
|
||||
"testharness"
|
||||
],
|
||||
"mozilla/canvas.initial.reset.2dstate.html": [
|
||||
|
|
|
|||
34
tests/wpt/mozilla/tests/css/calc-serialization.html
Normal file
34
tests/wpt/mozilla/tests/css/calc-serialization.html
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Values and Units: calc() serialization.</title>
|
||||
<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-values/#calc-serialize">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<!-- FIXME(emilio): Upstream when spec stops being under discussion -->
|
||||
<div id="content"></div>
|
||||
<script>
|
||||
|
||||
// NOTE(emilio): This intentionally doesn't test for order of percentages
|
||||
// because of:
|
||||
//
|
||||
// https://github.com/w3c/csswg-drafts/issues/1731
|
||||
|
||||
test(function() {
|
||||
// specified -> expected
|
||||
var values = {
|
||||
"calc(10px + 1vmin)": "calc(10px + 1vmin)",
|
||||
"calc(10px + 1em)": "calc(1em + 10px)",
|
||||
"calc(1vmin - 10px)": "calc(-10px + 1vmin)",
|
||||
"calc(-10px + 1em)": "calc(1em - 10px)",
|
||||
"calc(-10px)": "calc(-10px)",
|
||||
};
|
||||
|
||||
var content = document.getElementById("content");
|
||||
|
||||
for (var prop in values) {
|
||||
content.style.width = prop;
|
||||
assert_equals(content.style.width, values[prop], "Serialization of " + prop);
|
||||
}
|
||||
}, "calc() serialization")
|
||||
</script>
|
||||
|
|
@ -46,13 +46,13 @@ var widthTests = [
|
|||
|
||||
// Alphabetical order
|
||||
['calc(0ch + 0px + 0pt + 0pc + 0in + 0cm + 0mm + 0rem + 0em + 0ex + 0% + 0vw + 0vh + 0vmin + 0vmax)',
|
||||
'calc(0ch + 0em + 0ex + 0rem + 0vh + 0vmax + 0vmin + 0vw + 0px + 0%)',
|
||||
'calc(0% + 0ch + 0em + 0ex + 0px + 0rem + 0vh + 0vmax + 0vmin + 0vw)',
|
||||
'0px'],
|
||||
|
||||
// Simplification
|
||||
['calc((2 - 1) * 10px)', 'calc(10px)', '10px'],
|
||||
['calc(((3 - 1) * (8 + 4)) * 10px)', 'calc(240px)', '240px'],
|
||||
['calc(5 * (20px / 2 + 7 * (3em + 12px/4 + (8 - 2) * 2rem)))', 'calc(105em + 420rem + 155px)', '8555px'],
|
||||
['calc(5 * (20px / 2 + 7 * (3em + 12px/4 + (8 - 2) * 2rem)))', 'calc(105em + 155px + 420rem)', '8555px'],
|
||||
|
||||
];
|
||||
|
||||
|
|
@ -107,7 +107,7 @@ var lengthOrPercentageProperties = [
|
|||
lengthOrPercentageProperties.forEach(function(prop) {
|
||||
test(function() {
|
||||
div.style.setProperty(prop, 'calc(1px + 0%)');
|
||||
assert_equals(div.style.getPropertyValue(prop), 'calc(1px + 0%)');
|
||||
assert_equals(div.style.getPropertyValue(prop), 'calc(0% + 1px)');
|
||||
}, 'calc for ' + prop);
|
||||
});
|
||||
|
||||
|
|
@ -142,14 +142,14 @@ numberProperties.forEach(function(prop) {
|
|||
var otherProperties = [
|
||||
['border-width', 'calc(1px)', 'calc(1px)'],
|
||||
['border-spacing', 'calc(1px)', 'calc(1px)'],
|
||||
['transform-origin', 'calc(1px + 0%)', 'calc(1px + 0%) center 0px'],
|
||||
['perspective-origin', 'calc(1px + 0%)', 'calc(1px + 0%) center'],
|
||||
['background-size', 'calc(1px + 0%)', 'calc(1px + 0%) auto'],
|
||||
['background-position', 'calc(1px + 0%) calc(2px + 0%)', 'calc(1px + 0%) calc(2px + 0%)'],
|
||||
['border-top-left-radius', 'calc(1px + 0%)', 'calc(1px + 0%) calc(1px + 0%)'],
|
||||
['border-bottom-left-radius', 'calc(1px + 0%)', 'calc(1px + 0%) calc(1px + 0%)'],
|
||||
['border-top-right-radius', 'calc(1px + 0%)', 'calc(1px + 0%) calc(1px + 0%)'],
|
||||
['border-bottom-right-radius', 'calc(1px + 0%)', 'calc(1px + 0%) calc(1px + 0%)'],
|
||||
['transform-origin', 'calc(1px + 0%)', 'calc(0% + 1px) center 0px'],
|
||||
['perspective-origin', 'calc(1px + 0%)', 'calc(0% + 1px) center'],
|
||||
['background-size', 'calc(1px + 0%)', 'calc(0% + 1px) auto'],
|
||||
['background-position', 'calc(1px + 0%) calc(2px + 0%)', 'calc(0% + 1px) calc(0% + 2px)'],
|
||||
['border-top-left-radius', 'calc(1px + 0%)', 'calc(0% + 1px) calc(0% + 1px)'],
|
||||
['border-bottom-left-radius', 'calc(1px + 0%)', 'calc(0% + 1px) calc(0% + 1px)'],
|
||||
['border-top-right-radius', 'calc(1px + 0%)', 'calc(0% + 1px) calc(0% + 1px)'],
|
||||
['border-bottom-right-radius', 'calc(1px + 0%)', 'calc(0% + 1px) calc(0% + 1px)'],
|
||||
['counter-increment', 'foo calc(1 + 1)', 'foo calc(2)'],
|
||||
];
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue