Skip to content

Commit

Permalink
Make 'tab-size' property interpolable
Browse files Browse the repository at this point in the history
The property should be interpolable.
https://drafts.csswg.org/css-text-3/#tab-size-property

Bug: 1124184
Change-Id: Ic298057b17a78717df08dde4f82d8d860e230612
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2392164
Reviewed-by: Anders Hartvoll Ruud <andruud@chromium.org>
Reviewed-by: Robert Flack <flackr@chromium.org>
Commit-Queue: Sang Woo Ko <sangwoo108@chromium.org>
Cr-Commit-Position: refs/heads/master@{#805177}
  • Loading branch information
sangwoo108 authored and Commit Bot committed Sep 9, 2020
1 parent c534089 commit 3fa31f4
Show file tree
Hide file tree
Showing 7 changed files with 151 additions and 3 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -199,6 +199,7 @@ const InterpolationTypes& CSSInterpolationTypesMap::Get(
std::make_unique<CSSNumberInterpolationType>(used_property));
break;
case CSSPropertyID::kLineHeight:
case CSSPropertyID::kTabSize:
applicable_types->push_back(
std::make_unique<CSSLengthInterpolationType>(used_property));
applicable_types->push_back(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ ValueRange LengthPropertyFunctions::GetValueRange(const CSSProperty& property) {
case CSSPropertyID::kRowGap:
case CSSPropertyID::kColumnWidth:
case CSSPropertyID::kWidth:
case CSSPropertyID::kTabSize:
return kValueRangeNonNegative;
default:
return kValueRangeAll;
Expand Down Expand Up @@ -286,6 +287,11 @@ bool LengthPropertyFunctions::GetLength(const CSSProperty& property,
return false;
result = style.SpecifiedLineHeight();
return true;
case CSSPropertyID::kTabSize:
if (style.GetTabSize().IsSpaces())
return false;
result = Length::Fixed(style.GetTabSize().float_value_);
return true;
case CSSPropertyID::kPerspective:
if (!style.HasPerspective())
return false;
Expand Down Expand Up @@ -445,6 +451,9 @@ bool LengthPropertyFunctions::SetLength(const CSSProperty& property,
case CSSPropertyID::kColumnWidth:
case CSSPropertyID::kWebkitTransformOriginZ:
case CSSPropertyID::kWordSpacing:
case CSSPropertyID::kTabSize:
return false;

return false;

default:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,12 @@ base::Optional<double> NumberPropertyFunctions::GetNumber(
return value / 100;
}

case CSSPropertyID::kTabSize: {
if (!style.GetTabSize().IsSpaces())
return base::nullopt;
return style.GetTabSize().float_value_;
}

default:
return base::Optional<double>();
}
Expand All @@ -99,6 +105,7 @@ double NumberPropertyFunctions::ClampNumber(const CSSProperty& property,
case CSSPropertyID::kFlexShrink:
case CSSPropertyID::kFontSizeAdjust:
case CSSPropertyID::kLineHeight:
case CSSPropertyID::kTabSize:
case CSSPropertyID::kTextSizeAdjust:
return clampTo<float>(value, 0);

Expand Down Expand Up @@ -139,6 +146,9 @@ bool NumberPropertyFunctions::SetNumber(const CSSProperty& property,
case CSSPropertyID::kLineHeight:
style.SetLineHeight(Length::Percent(value * 100));
return true;
case CSSPropertyID::kTabSize:
style.SetTabSize(TabSize(value));
return true;
case CSSPropertyID::kOpacity:
style.SetOpacity(value);
return true;
Expand Down
1 change: 1 addition & 0 deletions third_party/blink/renderer/core/css/css_properties.json5
Original file line number Diff line number Diff line change
Expand Up @@ -3515,6 +3515,7 @@
{
name: "tab-size",
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
interpolable: true,
inherited: true,
field_group: "*",
field_template: "external",
Expand Down
2 changes: 2 additions & 0 deletions third_party/blink/renderer/core/css/css_property_equality.cc
Original file line number Diff line number Diff line change
Expand Up @@ -184,6 +184,8 @@ bool CSSPropertyEquality::PropertiesEqual(const PropertyHandle& property,
return a.LightingColor() == b.LightingColor();
case CSSPropertyID::kLineHeight:
return a.SpecifiedLineHeight() == b.SpecifiedLineHeight();
case CSSPropertyID::kTabSize:
return a.GetTabSize() == b.GetTabSize();
case CSSPropertyID::kListStyleImage:
return DataEquivalent(a.ListStyleImage(), b.ListStyleImage());
case CSSPropertyID::kMarginBottom:
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
This is a testharness.js-based test.
Found 76 tests; 68 PASS, 8 FAIL, 0 TIMEOUT, 0 NOTRUN.
Found 76 tests; 70 PASS, 6 FAIL, 0 TIMEOUT, 0 NOTRUN.
PASS Animation of font in ::marker
PASS Animation of font-family in ::marker
PASS Animation of font-feature-settings in ::marker
Expand All @@ -26,7 +26,7 @@ PASS Animation of hyphens in ::marker
PASS Animation of letter-spacing in ::marker
PASS Animation of line-break in ::marker
PASS Animation of overflow-wrap in ::marker
FAIL Animation of tab-size in ::marker assert_equals: expected "10px" but got "20px"
PASS Animation of tab-size in ::marker
PASS Animation of text-transform in ::marker
PASS Animation of word-break in ::marker
PASS Animation of word-spacing in ::marker
Expand Down Expand Up @@ -64,7 +64,7 @@ PASS Transition of hyphens in ::marker
PASS Transition of letter-spacing in ::marker
PASS Transition of line-break in ::marker
PASS Transition of overflow-wrap in ::marker
FAIL Transition of tab-size in ::marker assert_equals: expected "10px" but got "20px"
PASS Transition of tab-size in ::marker
PASS Transition of text-transform in ::marker
PASS Transition of word-break in ::marker
PASS Transition of word-spacing in ::marker
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
<meta name="test" content="tab-size supports animation by computed value type">

<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>

<style>
.parent {
tab-size: 20;
}
.target {
font: 10px sans-serif;
tab-size: 5;
}
.expected {
color: green;
}
</style>

<body>
<template id="target-template">T</template>
</body>

<script>
test_interpolation({
property: 'tab-size',
from: neutralKeyframe,
to: 10,
}, [
{at: -0.3, expect: '3.5'},
{at: 0, expect: '5'},
{at: 0.3, expect: '6.5'},
{at: 0.6, expect: '8'},
{at: 1, expect: '10'},
{at: 1.5, expect: '12.5'},
]);

test_interpolation({
property: 'tab-size',
from: 'initial',
to: 10,
}, [
{at: -0.3, expect: '7.4'},
{at: 0, expect: '8'},
{at: 0.3, expect: '8.6'},
{at: 0.6, expect: '9.2'},
{at: 1, expect: '10'},
{at: 1.5, expect: '11'},
]);

test_interpolation({
property: 'tab-size',
from: 'inherit',
to: 10,
}, [
{at: -0.3, expect: '23'},
{at: 0, expect: '20'},
{at: 0.3, expect: '17'},
{at: 0.6, expect: '14'},
{at: 1, expect: '10'},
{at: 1.5, expect: '5'},
]);

test_interpolation({
property: 'tab-size',
from: 'unset',
to: 10,
}, [
{at: -0.3, expect: '23'},
{at: 0, expect: '20'},
{at: 0.3, expect: '17'},
{at: 0.6, expect: '14'},
{at: 1, expect: '10'},
{at: 1.5, expect: '5'},
]);

test_interpolation({
property: 'tab-size',
from: 0,
to: 10,
}, [
{at: -0.3, expect: '0'},
{at: 0, expect: '0'},
{at: 0.3, expect: '3'},
{at: 0.6, expect: '6'},
{at: 1, expect: '10'},
{at: 1.5, expect: '15'},
]);

test_interpolation({
property: 'tab-size',
from: 4,
to: 10,
}, [
{at: -0.3, expect: '2.2'},
{at: 0, expect: '4'},
{at: 0.3, expect: '5.8'},
{at: 0.6, expect: '7.6'},
{at: 1, expect: '10'},
{at: 1.5, expect: '13'},
]);

test_interpolation({
property: 'tab-size',
from: '1px',
to: '10px',
}, [
{at: -0.3, expect: '0px'},
{at: 0, expect: '1px'},
{at: 0.3, expect: '3.7px'},
{at: 0.6, expect: '6.4px'},
{at: 1, expect: '10px'},
{at: 1.5, expect: '14.5px'},
]);

test_no_interpolation({
property: 'tab-size',
from: '1',
to: '10px',
});

</script>

0 comments on commit 3fa31f4

Please sign in to comment.