[css-grid] Implement repeat(auto-fit)

third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp

 /*
  * Copyright (C) 2004 Zack Rusin <zack@kde.org>
  * Copyright (C) 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012 Apple Inc. All rights reserved.
  * Copyright (C) 2007 Alexey Proskuryakov <ap@webkit.org>
  * Copyright (C) 2007 Nicholas Shanks <webkit@nickshanks.com>
  * Copyright (C) 2011 Sencha, Inc. All rights reserved.
  * Copyright (C) 2015 Google Inc. All rights reserved.
  *
  * This library is free software; you can redistribute it and/or
  * modify it under the terms of the GNU Lesser General Public
@@ skipping 725 matching lines @@
 class OrderedNamedLinesCollector {
     STACK_ALLOCATED();
     WTF_MAKE_NONCOPYABLE(OrderedNamedLinesCollector);
 public:
     OrderedNamedLinesCollector(const ComputedStyle& style, bool isRowAxis, size_t repetitions)
         : m_orderedNamedGridLines(isRowAxis ? style.orderedNamedGridColumnLines() : style.orderedNamedGridRowLines())
         , m_orderedNamedAutoRepeatGridLines(isRowAxis ? style.autoRepeatOrderedNamedGridColumnLines() : style.autoRepeatOrderedNamedGridRowLines())
         , m_insertionPoint(isRowAxis ? style.gridAutoRepeatColumnsInsertionPoint() : style.gridAutoRepeatRowsInsertionPoint())
         , m_repetitions(repetitions)
     {
+        auto autoRepeatTrackSizes = isRowAxis ? style.gridAutoRepeatColumns() : style.gridAutoRepeatRows();
+        auto autoRepeatType = isRowAxis ? style.gridAutoRepeatColumnsType() : style.gridAutoRepeatRowsType();
+        m_hasRepeatAutoFit = autoRepeatTrackSizes.size() && autoRepeatType == AutoFit;
     }
 
     bool isEmpty() const { return m_orderedNamedGridLines.isEmpty() && m_orderedNamedAutoRepeatGridLines.isEmpty(); }
     void collectLineNamesForIndex(CSSGridLineNamesValue&, size_t index) const;
 
 private:
 
     enum NamedLinesType { NamedLines, AutoRepeatNamedLines };
     void appendLines(CSSGridLineNamesValue&, size_t index, NamedLinesType) const;
 
     const OrderedNamedGridLines& m_orderedNamedGridLines;
     const OrderedNamedGridLines& m_orderedNamedAutoRepeatGridLines;
     size_t m_insertionPoint;
     size_t m_repetitions;
+    bool m_hasRepeatAutoFit;
 };
 
 void OrderedNamedLinesCollector::appendLines(CSSGridLineNamesValue& lineNamesValue, size_t index, NamedLinesType type) const
 {
     auto iter = type == NamedLines ? m_orderedNamedGridLines.find(index) : m_orderedNamedAutoRepeatGridLines.find(index);
     auto endIter = type == NamedLines ? m_orderedNamedGridLines.end() : m_orderedNamedAutoRepeatGridLines.end();
     if (iter == endIter)
         return;
 
     for (auto lineName : iter->value)
         lineNamesValue.append(*CSSCustomIdentValue::create(lineName));
 }
 
 void OrderedNamedLinesCollector::collectLineNamesForIndex(CSSGridLineNamesValue& lineNamesValue, size_t i) const
 {
     DCHECK(!isEmpty());
-    if (m_orderedNamedAutoRepeatGridLines.isEmpty() || i < m_insertionPoint) {
-        appendLines(lineNamesValue, i, NamedLines);
+    if (m_orderedNamedAutoRepeatGridLines.isEmpty() || i < m_insertionPoint || !m_repetitions) {
+        if (!m_hasRepeatAutoFit || m_repetitions || i < m_insertionPoint) {

[Manuel Rego, 2016/06/21 21:57:37]

Do we really need to check if m_hasRepeatAutoFit?
I think the only important thing to know here is if m_repetitions
is 0 or not, maybe I'm missing something.

[svillar, 2016/06/23 08:09:42]

Yes we do.

If m_repetitions is 0 then there are 2 possibilities:
1) there is no auto repeat with auto-fit
2) there is an auto-fit which dropped all the tracks.

You need a way to differentiate between these two cases.

+            appendLines(lineNamesValue, i, NamedLines);
+            return;
+        }
+
+        // If all the repetitions were dropped we should merge the line names surrounding the repeat()
+        // function. We should also take the removed tracks into account for the following lines.

[Manuel Rego, 2016/06/21 21:57:37]

I guess we could add an assert here to check that m_repetitions is 0.

[svillar, 2016/06/23 08:09:42]

Do we? There is an if (m_repetitions) with an early return just above so I guess
is pretty obvious from the code.

+        if (i == m_insertionPoint) {
+            appendLines(lineNamesValue, i, NamedLines);
+            appendLines(lineNamesValue, i + 1, NamedLines);
+        } else {
+            appendLines(lineNamesValue, i + 1, NamedLines);

[Manuel Rego, 2016/06/21 21:57:37]

I don't understand this else part.

I guess that here i > m_insertionPoint
(otherwise it should have gone through the previous ifs).
I don't get why we want the "i + 1" line.

[svillar, 2016/06/23 08:09:42]

So we're in the case of having dropped all the repetitions. For something like
this

[a] repeat(auto-fit, 10px) [b] 20px [c]

the way we store line names is more or less a hash map like this:
(0, a)
(1, b)
(2, c)

if we drop all the auto repetitions we should end up with something like this

[a b] 20px [c]

as you can see when we ask for lines at index 1 (remember that they start on 0)
we should not return  'b' (line 1) but 'c' (line 1+1). 

They key is that when we store the line names we assume that there is always 1
repetition for autorepeat (which is true for auto-fill but might be false for
auto-fit), that's why we need to readjust the code here.

+        }
         return;
     }
 
     DCHECK(m_repetitions);
     if (i > m_insertionPoint + m_repetitions) {
         appendLines(lineNamesValue, i - (m_repetitions - 1), NamedLines);
         return;
     }
 
     if (i == m_insertionPoint) {
@@ skipping 23 matching lines @@
         list.append(*lineNames);
 }
 
 static CSSValue* valueForGridTrackList(GridTrackSizingDirection direction, const LayoutObject* layoutObject, const ComputedStyle& style)
 {
     bool isRowAxis = direction == ForColumns;
     const Vector<GridTrackSize>& trackSizes = isRowAxis ? style.gridTemplateColumns() : style.gridTemplateRows();
     const Vector<GridTrackSize>& autoRepeatTrackSizes = isRowAxis ? style.gridAutoRepeatColumns() : style.gridAutoRepeatRows();
     bool isLayoutGrid = layoutObject && layoutObject->isLayoutGrid();
 
-    // Handle the 'none' case.
-    bool trackListIsEmpty = trackSizes.isEmpty() && autoRepeatTrackSizes.isEmpty();
+    // auto-fit might eventually remove all the tracks, we should consider the grid empty in that case too.
+    size_t repetitions = isLayoutGrid ? toLayoutGrid(layoutObject)->autoRepeatCountForDirection(direction) : 0;
+    bool trackListIsEmpty = trackSizes.isEmpty() && (autoRepeatTrackSizes.isEmpty() || !repetitions);

[Manuel Rego, 2016/06/21 21:57:37]

I guess checking !repetitions is enough:
   bool trackListIsEmpty = trackSizes.isEmpty() && !repetitions;

If I'm not wrong if autoRepeatTrackSizes.isEmpty()
autoRepeatCountForDirection() will return 0.

[svillar, 2016/06/23 08:09:42]

Yes we can do that in this case.

     if (isLayoutGrid && trackListIsEmpty) {
         // For grids we should consider every listed track, whether implicitly or explicitly
         // created. Empty grids have a sole grid line per axis.
         auto& positions = isRowAxis ? toLayoutGrid(layoutObject)->columnPositions() : toLayoutGrid(layoutObject)->rowPositions();
         trackListIsEmpty = positions.size() == 1;
     }
 
     if (trackListIsEmpty)
         return CSSPrimitiveValue::createIdentifier(CSSValueNone);
 
-    size_t repetitions = isLayoutGrid ? toLayoutGrid(layoutObject)->autoRepeatCountForDirection(direction) : 0;
     OrderedNamedLinesCollector collector(style, isRowAxis, repetitions);
     CSSValueList* list = CSSValueList::createSpaceSeparated();
     size_t insertionIndex;
     if (isLayoutGrid) {
         const auto* grid = toLayoutGrid(layoutObject);
         const Vector<LayoutUnit>& trackPositions = direction == ForColumns ? grid->columnPositions() : grid->rowPositions();
         // There are at least #tracks + 1 grid lines (trackPositions). Apart from that, the grid container can generate implicit grid tracks,
         // so we'll have more trackPositions than trackSizes as the latter only contain the explicit grid.
         ASSERT(trackPositions.size() - 1 >= trackSizes.size());
 
@@ skipping 2159 matching lines @@
     case CSSPropertyAll:
         return nullptr;
     default:
         break;
     }
     ASSERT_NOT_REACHED();
     return nullptr;
 }
 
 } // namespace blink