- Revision
- 239571
- Author
- [email protected]
- Date
- 2019-01-02 11:24:48 -0800 (Wed, 02 Jan 2019)
Log Message
Handle calc() expressions in gradient color stops
https://bugs.webkit.org/show_bug.cgi?id=193066
rdar://problem/46961985
Reviewed by Sam Weinig.
Source/WebCore:
Fix two issues that prevented calc() expressions from working in conic-gradient color stops,
for the angle or percent value. First, consumeAngleOrPercent() needs to look for CalculationCategory::Percent
calc values as well as angle ones.
Second, CSSPrimitiveValue::isAngle() needs to use primitiveType() (which takes calc into account),
just as isPx() etc do.
Test: fast/gradients/conic-calc-stop-position.html
* css/CSSPrimitiveValue.h:
(WebCore::CSSPrimitiveValue::isAngle const):
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::consumeAngleOrPercent):
(WebCore::CSSPropertyParserHelpers::consumeGradientColorStops):
LayoutTests:
* fast/gradients/conic-calc-stop-position-expected.html: Added.
* fast/gradients/conic-calc-stop-position.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (239570 => 239571)
--- trunk/LayoutTests/ChangeLog 2019-01-02 18:50:16 UTC (rev 239570)
+++ trunk/LayoutTests/ChangeLog 2019-01-02 19:24:48 UTC (rev 239571)
@@ -1,3 +1,14 @@
+2019-01-02 Simon Fraser <[email protected]>
+
+ Handle calc() expressions in gradient color stops
+ https://bugs.webkit.org/show_bug.cgi?id=193066
+ rdar://problem/46961985
+
+ Reviewed by Sam Weinig.
+
+ * fast/gradients/conic-calc-stop-position-expected.html: Added.
+ * fast/gradients/conic-calc-stop-position.html: Added.
+
2018-12-31 Carlos Garcia Campos <[email protected]>
Unreviewed. Support PHP 7.3 in Debian.
Added: trunk/LayoutTests/fast/gradients/conic-calc-stop-position-expected.html (0 => 239571)
--- trunk/LayoutTests/fast/gradients/conic-calc-stop-position-expected.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-calc-stop-position-expected.html 2019-01-02 19:24:48 UTC (rev 239571)
@@ -0,0 +1,20 @@
+<html>
+<head>
+ <style>
+ .box {
+ margin: 10px;
+ height: 200px;
+ width: 200px;
+ border: 1px solid black;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>All boxes should look the same.</p>
+ <div class="box" style="background-image: conic-gradient(green, 90deg, transparent 0)"></div>
+ <div class="box" style="background-image: conic-gradient(green, 90deg, transparent 0)"></div>
+ <div class="box" style="background-image: conic-gradient(green, 90deg, transparent 0)"></div>
+ <div class="box" style="background-image: conic-gradient(green, 90deg, transparent 0)"></div>
+</body>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-calc-stop-position.html (0 => 239571)
--- trunk/LayoutTests/fast/gradients/conic-calc-stop-position.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-calc-stop-position.html 2019-01-02 19:24:48 UTC (rev 239571)
@@ -0,0 +1,20 @@
+<html>
+<head>
+ <style>
+ .box {
+ margin: 10px;
+ height: 200px;
+ width: 200px;
+ border: 1px solid black;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>All boxes should look the same.</p>
+ <div class="box" style="background-image: conic-gradient(green, 25%, transparent 0deg)"></div>
+ <div class="box" style="background-image: conic-gradient(green, 90deg, transparent 0)"></div>
+ <div class="box" style="background-image: conic-gradient(green, calc(1 * 100% / 4), transparent 0)"></div>
+ <div class="box" style="background-image: conic-gradient(green, calc(360deg / 4), transparent 0deg)"></div>
+</body>
+</html>
Modified: trunk/Source/WebCore/ChangeLog (239570 => 239571)
--- trunk/Source/WebCore/ChangeLog 2019-01-02 18:50:16 UTC (rev 239570)
+++ trunk/Source/WebCore/ChangeLog 2019-01-02 19:24:48 UTC (rev 239571)
@@ -1,3 +1,26 @@
+2019-01-02 Simon Fraser <[email protected]>
+
+ Handle calc() expressions in gradient color stops
+ https://bugs.webkit.org/show_bug.cgi?id=193066
+ rdar://problem/46961985
+
+ Reviewed by Sam Weinig.
+
+ Fix two issues that prevented calc() expressions from working in conic-gradient color stops,
+ for the angle or percent value. First, consumeAngleOrPercent() needs to look for CalculationCategory::Percent
+ calc values as well as angle ones.
+
+ Second, CSSPrimitiveValue::isAngle() needs to use primitiveType() (which takes calc into account),
+ just as isPx() etc do.
+
+ Test: fast/gradients/conic-calc-stop-position.html
+
+ * css/CSSPrimitiveValue.h:
+ (WebCore::CSSPrimitiveValue::isAngle const):
+ * css/parser/CSSPropertyParserHelpers.cpp:
+ (WebCore::CSSPropertyParserHelpers::consumeAngleOrPercent):
+ (WebCore::CSSPropertyParserHelpers::consumeGradientColorStops):
+
2018-12-31 Keith Miller <[email protected]>
SourceProviders should use an actual URL instead of a string
Modified: trunk/Source/WebCore/css/CSSPrimitiveValue.h (239570 => 239571)
--- trunk/Source/WebCore/css/CSSPrimitiveValue.h 2019-01-02 18:50:16 UTC (rev 239570)
+++ trunk/Source/WebCore/css/CSSPrimitiveValue.h 2019-01-02 19:24:48 UTC (rev 239571)
@@ -352,10 +352,11 @@
inline bool CSSPrimitiveValue::isAngle() const
{
- return m_primitiveUnitType == CSS_DEG
- || m_primitiveUnitType == CSS_RAD
- || m_primitiveUnitType == CSS_GRAD
- || m_primitiveUnitType == CSS_TURN;
+ auto primitiveType = this->primitiveType();
+ return primitiveType == CSS_DEG
+ || primitiveType == CSS_RAD
+ || primitiveType == CSS_GRAD
+ || primitiveType == CSS_TURN;
}
inline bool CSSPrimitiveValue::isFontRelativeLength(UnitType type)
Modified: trunk/Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp (239570 => 239571)
--- trunk/Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp 2019-01-02 18:50:16 UTC (rev 239570)
+++ trunk/Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp 2019-01-02 19:24:48 UTC (rev 239571)
@@ -77,7 +77,6 @@
// FIXME: consider pulling in the parsing logic from CSSCalculationValue.cpp.
class CalcParser {
-
public:
explicit CalcParser(CSSParserTokenRange& range, CalculationCategory destinationCategory, ValueRange valueRange = ValueRangeAll)
: m_sourceRange(range)
@@ -376,11 +375,17 @@
if (token.type() == PercentageToken)
return consumePercent(range, valueRange);
- CalcParser calcParser(range, CalculationCategory::Angle, valueRange);
- if (const CSSCalcValue* calculation = calcParser.value()) {
+ CalcParser angleCalcParser(range, CalculationCategory::Angle, valueRange);
+ if (const CSSCalcValue* calculation = angleCalcParser.value()) {
if (calculation->category() == CalculationCategory::Angle)
- return calcParser.consumeValue();
+ return angleCalcParser.consumeValue();
}
+
+ CalcParser percentCalcParser(range, CalculationCategory::Percent, valueRange);
+ if (const CSSCalcValue* calculation = percentCalcParser.value()) {
+ if (calculation->category() == CalculationCategory::Percent)
+ return percentCalcParser.consumeValue();
+ }
return nullptr;
}
@@ -967,7 +972,7 @@
{
bool supportsColorHints = gradient.gradientType() == CSSLinearGradient || gradient.gradientType() == CSSRadialGradient || gradient.gradientType() == CSSConicGradient;
- bool isAngularGradient = gradient.gradientType() == CSSConicGradient;
+ bool isConicGradient = gradient.gradientType() == CSSConicGradient;
// The first color stop cannot be a color hint.
bool previousStopWasColorHint = true;
@@ -983,7 +988,7 @@
// FIXME-NEWPARSER: This boolean could be removed. Null checking color would be sufficient.
stop.isMidpoint = !stop.m_color;
- if (isAngularGradient)
+ if (isConicGradient)
stop.m_position = consumeAngleOrPercent(range, cssParserMode, ValueRangeAll, UnitlessQuirk::Forbid);
else
stop.m_position = consumeLengthOrPercent(range, cssParserMode, ValueRangeAll);
@@ -994,7 +999,7 @@
// See if there is a second color hint, which is optional.
CSSGradientColorStop secondStop;
- if (isAngularGradient)
+ if (isConicGradient)
secondStop.m_position = consumeAngleOrPercent(range, cssParserMode, ValueRangeAll, UnitlessQuirk::Forbid);
else
secondStop.m_position = consumeLengthOrPercent(range, cssParserMode, ValueRangeAll);
