Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-09 11:25:00 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1764126 - Part 4: Add parsing for linear easing function and gate it behind pref. r=emilio

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D146839
This commit is contained in:
David Shin 2022-06-07 11:51:24 +00:00
parent e46f5534e2
commit 14611a24e8
6 changed files with 113 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
layout/style/test/mochitest.ini
View File

@ -21,6 +21,7 @@ prefs =
layout.css.d-property.enabled=true
layout.css.scroll-linked-animations.enabled=true
layout.css.scrollbar-gutter.enabled=true
layout.css.linear-easing-function.enabled=true
support-files =
animation_utils.js
bug1729861.js

29
layout/style/test/property_database.js
View File

@ -13390,6 +13390,35 @@ if (IsCSSPropertyPrefEnabled("layout.css.step-position-jump.enabled")) {
);
}
if (IsCSSPropertyPrefEnabled("layout.css.linear-easing-function.enabled")) {
let linear_function_other_values = [
"linear()",
"linear(0.5)",
"linear(0, 1)",
"linear(0 0% 50%, 1 50% 100%)",
];
let linear_function_invalid_values = ["linear(0% 0 100%)", "linear(0,)"];
gCSSProperties["animation-timing-function"].other_values.push(
...linear_function_other_values
);
gCSSProperties["animation-timing-function"].invalid_values.push(
...linear_function_invalid_values
);
gCSSProperties["transition-timing-function"].other_values.push(
...linear_function_other_values
);
gCSSProperties["transition-timing-function"].invalid_values.push(
...linear_function_invalid_values
);
gCSSProperties["animation"].other_values.push(
"1s 2s linear() bounce",
"4s linear(0, 0.5 25% 75%, 1 100% 100%)"
);
}
if (
IsCSSPropertyPrefEnabled("layout.css.backdrop-filter.enabled") &&
IsWebRenderEnabled()

6
modules/libpref/init/StaticPrefList.yaml
View File

@ -7552,6 +7552,12 @@
mirror: always
rust: true
- name: layout.css.linear-easing-function.enabled
type: RelaxedAtomicBool
value: false
mirror: always
rust: true
# Is support for color-mix on content enabled?
- name: layout.css.color-mix.enabled
type: RelaxedAtomicBool

39
servo/components/style/values/specified/easing.rs
View File

@ -7,7 +7,9 @@ use crate::parser::{Parse, ParserContext};
use crate::values::computed::easing::ComputedLinearStop;
use crate::values::computed::easing::TimingFunction as ComputedTimingFunction;
use crate::values::computed::Percentage as ComputedPercentage;
use crate::values::generics::easing::TimingFunction as GenericTimingFunction;
use crate::values::generics::easing::{
LinearStop as GenericLinearStop, TimingFunction as GenericTimingFunction,
};
use crate::values::generics::easing::{StepPosition, TimingKeyword};
use crate::values::specified::{Integer, Number, Percentage};
use cssparser::Parser;
@ -18,6 +20,16 @@ use style_traits::{ParseError, StyleParseErrorKind};
/// A specified timing function.
pub type TimingFunction = GenericTimingFunction<Integer, Number, Percentage>;
#[cfg(feature = "gecko")]
fn linear_timing_function_enabled() -> bool {
static_prefs::pref!("layout.css.linear-easing-function.enabled")
}
#[cfg(feature = "servo")]
fn linear_timing_function_enabled() -> bool {
false
}
impl Parse for TimingFunction {
fn parse<'i, 't>(
context: &ParserContext,
@ -75,6 +87,31 @@ impl Parse for TimingFunction {
}
Ok(GenericTimingFunction::Steps(steps, position))
},
"linear" => {
if !linear_timing_function_enabled() {
return Err(i.new_custom_error(StyleParseErrorKind::ExperimentalProperty));
}
if i.is_exhausted() {
return Ok(GenericTimingFunction::LinearFunction(crate::OwnedSlice::default()))
}
let entries = i.parse_comma_separated(|i| {
let mut input_start = i.try_parse(|i| Percentage::parse(context, i)).ok();
let mut input_end = i.try_parse(|i| Percentage::parse(context, i)).ok();
let output = Number::parse(context, i)?;
if input_start.is_none() {
debug_assert!(input_end.is_none(), "Input end parsed without input start?");
input_start = i.try_parse(|i| Percentage::parse(context, i)).ok();
input_end = i.try_parse(|i| Percentage::parse(context, i)).ok();
}
Ok(GenericLinearStop {
output,
input_start: input_start.into(),
input_end: input_end.into()
})
})?;
Ok(GenericTimingFunction::LinearFunction(crate::OwnedSlice::from(entries)))
},
_ => Err(()),
})
.map_err(|()| {

1
testing/web-platform/meta/css/css-animations/parsing/animation-timing-function-linear.tentative.html.ini Normal file
View File

@ -0,0 +1 @@
prefs: [layout.css.linear-easing-function.enabled:true]

38
testing/web-platform/tests/css/css-animations/parsing/animation-timing-function-linear.tentative.html Normal file
View File

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Animations: getComputedStyle().animationTimingFunction with linear(...)</title>
<link rel="help" href="https://github.com/w3c/csswg-drafts/pull/6533">
<meta name="assert" content="animation-timing-function: linear(...) parsing tests">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_valid_value("animation-timing-function", "linear()");
test_valid_value("animation-timing-function", "linear(0)");
test_valid_value("animation-timing-function", "linear(0, 1)");
test_valid_value("animation-timing-function", "linear(0 0% 100%)");
test_valid_value("animation-timing-function", "linear(0% 100% 0)", "linear(0 0% 100%)");
test_valid_value("animation-timing-function", "linear(0 0% 50%, 1 50% 100%)");
test_valid_value("animation-timing-function", "linear(0, 0.5 25% 75%, 1 100% 100%)");
test_valid_value("animation-timing-function", "linear(0, 1.3, 1, 0.92, 1, 0.99, 1, 1.004, 0.998, 1 100% 100%)");
test_invalid_value("animation-timing-function", "linear(100%)");
test_invalid_value("animation-timing-function", "linear(0% 1 50%)");
test_computed_value("animation-timing-function", "linear()");
test_computed_value("animation-timing-function", "linear(0)");
test_computed_value("animation-timing-function", "linear(0, 1)");
test_computed_value("animation-timing-function", "linear(0 0% 100%)");
test_computed_value("animation-timing-function", "linear(0% 100% 0)", "linear(0 0% 100%)");
test_computed_value("animation-timing-function", "linear(0 0% 50%, 1 50% 100%)");
test_computed_value("animation-timing-function", "linear(0, 0.5 25% 75%, 1 100% 100%)");
test_computed_value("animation-timing-function", "linear(0, 1.3, 1, 0.92, 1, 0.99, 1, 1.004, 0.998, 1 100% 100%)");
</script>
</body>
</html>