+2013-11-26 Sergio Villar Senin <svillar@igalia.com>
+
+ [CSS Grid Layout] Support grid-definition-{rows|columns} repeat() syntax
+ https://bugs.webkit.org/show_bug.cgi?id=103312
+
+ Reviewed by Andreas Kling.
+
+ Based on Blink r153155 by <jchaffraix@chromium.org>. Some code was
+ refactored in a helper function to have a more compact test.
+
+ * fast/css-grid-layout/grid-element-repeat-get-set-expected.txt: Added.
+ * fast/css-grid-layout/grid-element-repeat-get-set.html: Added.
+
2013-11-26 Ryosuke Niwa <rniwa@webkit.org>
Windows rebaselines after r158547.
--- /dev/null
+Test that setting and getting grid-definition-columns and grid-definition-rows with repeat() works as expected
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+Test getting grid-definition-columns and grid-definition-rows set through CSS
+PASS window.getComputedStyle(singleSingleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "15%"
+PASS window.getComputedStyle(singleSingleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "18px"
+PASS window.getComputedStyle(twoSingleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "minmax(15px, 50%) minmax(15px, 50%)"
+PASS window.getComputedStyle(twoSingleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "auto auto"
+PASS window.getComputedStyle(twoDoubleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "auto minmax(100px, 120px) auto minmax(100px, 120px)"
+PASS window.getComputedStyle(twoDoubleTrackRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "minmax(5px, 10px) auto minmax(5px, 10px) auto"
+PASS window.getComputedStyle(twoDoubleTrackWithNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "auto middle 250px end auto middle 250px end"
+PASS window.getComputedStyle(twoDoubleTrackWithNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "10px start auto end 10px start auto end"
+PASS window.getComputedStyle(twoDoubleTrackWithTrailingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "before auto before auto"
+PASS window.getComputedStyle(twoDoubleTrackWithTrailingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "before 10px before 10px"
+PASS window.getComputedStyle(trailingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "250px end"
+PASS window.getComputedStyle(trailingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "10px end"
+PASS window.getComputedStyle(leadingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "start 250px 250px"
+PASS window.getComputedStyle(leadingNamedGridLineRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "start 10px 10px"
+PASS window.getComputedStyle(mixRepeatAfterNonRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "start 140px 250px 250px"
+PASS window.getComputedStyle(mixRepeatAfterNonRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "auto 10px 10px"
+PASS window.getComputedStyle(mixNonRepeatAfterRepeat, '').getPropertyValue('-webkit-grid-definition-columns') is "250px 250px 15% last"
+PASS window.getComputedStyle(mixNonRepeatAfterRepeat, '').getPropertyValue('-webkit-grid-definition-rows') is "10px 10px end auto"
+
+Test invalid repeat syntax.
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns') is "none"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<script>
+if (window.testRunner)
+ testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1);
+</script>
+<link href="resources/grid.css" rel="stylesheet">
+<style>
+#singleSingleTrackRepeat {
+ -webkit-grid-definition-rows: repeat(1, 18px);
+ -webkit-grid-definition-columns: repeat(1, 15%);
+}
+
+#twoSingleTrackRepeat {
+ -webkit-grid-definition-rows: repeat(2, auto);
+ -webkit-grid-definition-columns: repeat(2, minmax(15px, 50%));
+}
+
+#twoDoubleTrackRepeat {
+ -webkit-grid-definition-rows: repeat(2, minmax(5px, 10px) auto);
+ -webkit-grid-definition-columns: repeat(2, auto minmax(100px, 120px));
+}
+
+#twoDoubleTrackWithNamedGridLineRepeat {
+ -webkit-grid-definition-rows: repeat(2, 10px 'start' auto 'end');
+ -webkit-grid-definition-columns: repeat(2, auto 'middle' 250px 'end');
+}
+
+#twoDoubleTrackWithTrailingNamedGridLineRepeat {
+ -webkit-grid-definition-rows: repeat(2, 'before' 10px);
+ -webkit-grid-definition-columns: repeat(2, 'before' auto);
+}
+
+#trailingNamedGridLineRepeat {
+ -webkit-grid-definition-rows: repeat(1, 10px) 'end';
+ -webkit-grid-definition-columns: repeat(1, 250px) 'end';
+}
+
+#leadingNamedGridLineRepeat {
+ -webkit-grid-definition-rows: 'start' repeat(2, 10px);
+ -webkit-grid-definition-columns: 'start' repeat(2, 250px);
+}
+
+#mixRepeatAfterNonRepeat {
+ -webkit-grid-definition-rows: auto repeat(2, 10px);
+ -webkit-grid-definition-columns: 'start' 140px repeat(2, 250px);
+}
+
+#mixNonRepeatAfterRepeat {
+ -webkit-grid-definition-rows: repeat(2, 10px) 'end' auto;
+ -webkit-grid-definition-columns: repeat(2, 250px) 15% 'last';
+}
+</style>
+<script src="../../resources/js-test-pre.js"></script>
+</head>
+<body>
+<div class="grid" id="singleSingleTrackRepeat"></div>
+<div class="grid" id="twoSingleTrackRepeat"></div>
+<div class="grid" id="twoDoubleTrackRepeat"></div>
+<div class="grid" id="twoDoubleTrackWithNamedGridLineRepeat"></div>
+<div class="grid" id="twoDoubleTrackWithTrailingNamedGridLineRepeat"></div>
+<div class="grid" id="trailingNamedGridLineRepeat"></div>
+<div class="grid" id="leadingNamedGridLineRepeat"></div>
+<div class="grid" id="mixRepeatAfterNonRepeat"></div>
+<div class="grid" id="mixNonRepeatAfterRepeat"></div>
+<script>
+ description('Test that setting and getting grid-definition-columns and grid-definition-rows with repeat() works as expected');
+
+ function testGridDefinitionsValues(element, columnValue, rowValue)
+ {
+ window.element = element;
+ var elementID = element.id || "element";
+ shouldBeEqualToString("window.getComputedStyle(" + elementID + ", '').getPropertyValue('-webkit-grid-definition-columns')", columnValue);
+ shouldBeEqualToString("window.getComputedStyle(" + elementID + ", '').getPropertyValue('-webkit-grid-definition-rows')", rowValue);
+ }
+
+ debug("Test getting grid-definition-columns and grid-definition-rows set through CSS");
+ testGridDefinitionsValues(document.getElementById("singleSingleTrackRepeat"), "15%", "18px");
+ testGridDefinitionsValues(document.getElementById("twoSingleTrackRepeat"), "minmax(15px, 50%) minmax(15px, 50%)", "auto auto");
+ testGridDefinitionsValues(document.getElementById("twoDoubleTrackRepeat"), "auto minmax(100px, 120px) auto minmax(100px, 120px)", "minmax(5px, 10px) auto minmax(5px, 10px) auto");
+ testGridDefinitionsValues(document.getElementById("twoDoubleTrackWithNamedGridLineRepeat"), "auto middle 250px end auto middle 250px end", "10px start auto end 10px start auto end");
+ testGridDefinitionsValues(document.getElementById("twoDoubleTrackWithTrailingNamedGridLineRepeat"), "before auto before auto", "before 10px before 10px");
+ testGridDefinitionsValues(document.getElementById("trailingNamedGridLineRepeat"), "250px end", "10px end");
+ testGridDefinitionsValues(document.getElementById("leadingNamedGridLineRepeat"), "start 250px 250px", "start 10px 10px");
+ testGridDefinitionsValues(document.getElementById("mixRepeatAfterNonRepeat"), "start 140px 250px 250px", "auto 10px 10px");
+ testGridDefinitionsValues(document.getElementById("mixNonRepeatAfterRepeat"), "250px 250px 15% last", "10px 10px end auto");
+
+ debug("");
+ debug("Test invalid repeat syntax.");
+ function testInvalidSyntax(gridColumn) {
+ element = document.createElement("div");
+ document.body.appendChild(element);
+ element.style.gridColumns = gridColumn;
+ shouldBeEqualToString("window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-definition-columns')", "none");
+ document.body.removeChild(element);
+ }
+ testInvalidSyntax("repeat(");
+ testInvalidSyntax("repeat()");
+ testInvalidSyntax("repeat(3 / auto)");
+ testInvalidSyntax("repeat(3 , ,)");
+ testInvalidSyntax("repeat(0, 15px)");
+ testInvalidSyntax("repeat(-1, auto)");
+ // Nesting is no allowed.
+ testInvalidSyntax("repeat(2, repeat(1, auto))");
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</body>
+</html>
+2013-11-26 Sergio Villar Senin <svillar@igalia.com>
+
+ [CSS Grid Layout] Support grid-definition-{rows|columns} repeat() syntax
+ https://bugs.webkit.org/show_bug.cgi?id=103312
+
+ Reviewed by Andreas Kling.
+
+ Use the repeat() syntax to build the huge grids used by the
+ performance tests.
+
+ * Layout/auto-grid-lots-of-data.html:
+ * Layout/fixed-grid-lots-of-data.html:
+
2013-11-26 Ryosuke Niwa <rniwa@webkit.org>
Record subtest values in Dromaeo tests
body {
display: -webkit-grid;
- /* FIXME: change to repeat(100, auto) when repeat() syntax becomes available. */
- -webkit-grid-definition-rows: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;
- -webkit-grid-definition-columns: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;
+ -webkit-grid-definition-rows: repeat(100, auto);
+ -webkit-grid-definition-columns: repeat(20, auto);
}
.gridItem {
}
body {
- /* FIXME: replace by repeat() syntax when available */
display: -webkit-grid;
- -webkit-grid-definition-rows: 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px;
- -webkit-grid-definition-columns: 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px 200px;
+ -webkit-grid-definition-rows: repeat(100, 200px);
+ -webkit-grid-definition-columns: repeat(20, 200px);
}
.gridItem {
+2013-11-26 Sergio Villar Senin <svillar@igalia.com>
+
+ [CSS Grid Layout] Support grid-definition-{rows|columns} repeat() syntax
+ https://bugs.webkit.org/show_bug.cgi?id=103312
+
+ Reviewed by Andreas Kling.
+
+ Added support for the repeat() syntax inside
+ grid-definition-{rows|columns} by just adding the repeated values
+ to our list of column|row definitions.
+
+ The parsing of <track-name> was refactored in a new function as
+ it's used now in three different places. The <track-size> parsing
+ was also refactored to share it with the repeat() parsing.
+
+ Test: fast/css-grid-layout/grid-element-repeat-get-set.html
+
+ * css/CSSParser.cpp:
+ (WebCore::CSSParser::parseValue):
+ (WebCore::CSSParser::parseGridTrackNames):
+ (WebCore::CSSParser::parseGridTrackList):
+ (WebCore::CSSParser::parseGridTrackRepeatFunction):
+ (WebCore::CSSParser::parseGridTrackSize):
+ * css/CSSParser.h:
+
2013-11-26 Marcelo Lira <marcelo.lira@openbossa.org>
Nix upstreaming - Adding build files and supporting scripts
case CSSPropertyWebkitGridAutoRows:
if (!cssGridLayoutEnabled())
return false;
- parsedValue = parseGridTrackSize();
+ parsedValue = parseGridTrackSize(*m_valueList);
break;
case CSSPropertyWebkitGridDefinitionColumns:
return true;
}
+void CSSParser::parseGridTrackNames(CSSParserValueList& parserValues, CSSValueList& values)
+{
+ do {
+ RefPtr<CSSPrimitiveValue> name = createPrimitiveStringValue(parserValues.current());
+ values.append(name.release());
+ parserValues.next();
+ } while (parserValues.current() && parserValues.current()->unit == CSSPrimitiveValue::CSS_STRING);
+}
+
bool CSSParser::parseGridTrackList(CSSPropertyID propId, bool important)
{
CSSParserValue* value = m_valueList->current();
RefPtr<CSSValueList> values = CSSValueList::createSpaceSeparated();
// Handle leading track names
- while (m_valueList->current() && m_valueList->current()->unit == CSSPrimitiveValue::CSS_STRING) {
- RefPtr<CSSPrimitiveValue> name = createPrimitiveStringValue(m_valueList->current());
- values->append(name.release());
- m_valueList->next();
- }
-
- bool seenTrackSize = false;
- while (m_valueList->current()) {
- RefPtr<CSSPrimitiveValue> primitiveValue = parseGridTrackSize();
- if (!primitiveValue)
- return false;
+ if (m_valueList->current() && m_valueList->current()->unit == CSSPrimitiveValue::CSS_STRING)
+ parseGridTrackNames(*m_valueList, *values);
- seenTrackSize = true;
- values->append(primitiveValue.release());
-
- while (m_valueList->current() && m_valueList->current()->unit == CSSPrimitiveValue::CSS_STRING) {
- RefPtr<CSSPrimitiveValue> name = createPrimitiveStringValue(m_valueList->current());
- values->append(name.release());
- m_valueList->next();
+ bool seenTrackSizeOrRepeatFunction = false;
+ while (CSSParserValue* currentValue = m_valueList->current()) {
+ if (currentValue->unit == CSSParserValue::Function && equalIgnoringCase(currentValue->function->name, "repeat(")) {
+ if (!parseGridTrackRepeatFunction(*values))
+ return false;
+ } else {
+ RefPtr<CSSPrimitiveValue> primitiveValue = parseGridTrackSize(*m_valueList);
+ if (!primitiveValue)
+ return false;
+ values->append(primitiveValue.release());
}
+ seenTrackSizeOrRepeatFunction = true;
+
+ if (m_valueList->current() && m_valueList->current()->unit == CSSPrimitiveValue::CSS_STRING)
+ parseGridTrackNames(*m_valueList, *values);
}
- if (!seenTrackSize)
+ if (!seenTrackSizeOrRepeatFunction)
return false;
addProperty(propId, values.release(), important);
return true;
}
-PassRefPtr<CSSPrimitiveValue> CSSParser::parseGridTrackSize()
+bool CSSParser::parseGridTrackRepeatFunction(CSSValueList& list)
{
- CSSParserValue* currentValue = m_valueList->current();
+ CSSParserValueList* arguments = m_valueList->current()->function->args.get();
+ if (!arguments || arguments->size() < 3 || !validUnit(arguments->valueAt(0), FPositiveInteger) || !isComma(arguments->valueAt(1)))
+ return false;
+
+ ASSERT_WITH_SECURITY_IMPLICATION(arguments->valueAt(0)->fValue > 0);
+ size_t repetitions = arguments->valueAt(0)->fValue;
+ RefPtr<CSSValueList> repeatedValues = CSSValueList::createSpaceSeparated();
+ arguments->next(); // Skip the repetition count.
+ arguments->next(); // Skip the comma.
+
+ while (arguments->current()) {
+ if (arguments->current()->unit == CSSPrimitiveValue::CSS_STRING)
+ parseGridTrackNames(*arguments, *repeatedValues);
+
+ if (!arguments->current())
+ break;
+
+ RefPtr<CSSPrimitiveValue> trackSize = parseGridTrackSize(*arguments);
+ if (!trackSize)
+ return false;
+
+ repeatedValues->append(trackSize.release());
+ }
+
+ for (size_t i = 0; i < repetitions; ++i) {
+ for (size_t j = 0; j < repeatedValues->length(); ++j)
+ list.append(repeatedValues->itemWithoutBoundsCheck(j));
+ }
+
m_valueList->next();
+ return true;
+}
+
+PassRefPtr<CSSPrimitiveValue> CSSParser::parseGridTrackSize(CSSParserValueList& inputList)
+{
+ CSSParserValue* currentValue = inputList.current();
+ inputList.next();
if (currentValue->id == CSSValueAuto)
return cssValuePool().createIdentifierValue(CSSValueAuto);
return createPrimitiveValuePair(minTrackBreadth, maxTrackBreadth);
}
- if (PassRefPtr<CSSPrimitiveValue> trackBreadth = parseGridBreadth(currentValue))
- return trackBreadth;
-
- return 0;
+ return parseGridBreadth(currentValue);
}
PassRefPtr<CSSPrimitiveValue> CSSParser::parseGridBreadth(CSSParserValue* currentValue)
bool parseGridAreaShorthand(bool important);
bool parseSingleGridAreaLonghand(RefPtr<CSSValue>&);
bool parseGridTrackList(CSSPropertyID, bool important);
- PassRefPtr<CSSPrimitiveValue> parseGridTrackSize();
+ bool parseGridTrackRepeatFunction(CSSValueList&);
+ PassRefPtr<CSSPrimitiveValue> parseGridTrackSize(CSSParserValueList& inputList);
PassRefPtr<CSSPrimitiveValue> parseGridBreadth(CSSParserValue*);
PassRefPtr<CSSValue> parseGridTemplate();
+ void parseGridTrackNames(CSSParserValueList& inputList, CSSValueList& values);
bool parseDashboardRegions(CSSPropertyID, bool important);
git://git.webkit.org / WebKit-https.git / commitdiff