Attachment #177283 for bug #103799

View Details Raw Unified Return to Bug 103799

| Differences between



2012-11-30  Julien Chaffraix  <jchaffraix@webkit.org>

        [CSS Grid Layout] Implement CSS parsing and handling for <track-minmax>
        https://bugs.webkit.org/show_bug.cgi?id=103799

        Reviewed by NOBODY (OOPS!).

        This change adds support for:
        <track-minmax> => minmax( <track-breadth> , <track-breadth> ) | auto | <track-breadth>
        (note that we already supported auto | <track-breadth>).

        The change is mostly mechanical, the only newness is that GridTrackSize was updated to
        hold 2 Lengths internally and we map the single Length case to 2 by duplicating the value
        as this matches the rendering algorithm in the spec.

        Tests: fast/css-grid-layout/grid-columns-rows-get-set-multiple.html
               fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js

        * css/CSSComputedStyleDeclaration.cpp:
        (WebCore::valueForGridTrackBreadth):
        Changed the function to do the conversion of one track breadth (one Length).
        This was forgotten in the preparatory change in bug 103703.

        (WebCore::valueForGridTrackMinMax):
        Convert the value back using valueForGridTrackBreadth.

        * css/CSSFunctionValue.cpp:
        (WebCore::CSSFunctionValue::CSSFunctionValue):
        * css/CSSFunctionValue.h:
        (WebCore::CSSFunctionValue::create):
        (CSSFunctionValue):
        Added a new constructor. This enables us to return minmax(..., ...) when queried
        from JavaScript. I couldn't find a better way to serialize inside CSSComputedStyleDeclaration
        so that it properly match the function output.

        * css/CSSParser.cpp:
        (WebCore::CSSParser::parseGridTrackMinMax):
        Added parsing for the new syntax. We convert the 2 values into a Pair if we manage to
        parse both values correctly.

        * css/StyleResolver.cpp:
        (WebCore::createGridTrackMinMax):
        Updated to handle a Pair - for minmax - and set the 2 values on GridTrackSize.

        * rendering/RenderGrid.cpp:
        (WebCore::RenderGrid::computedUsedBreadthOfGridTracks):
        Updated to check the style. For now, we don't handle minmax values.

        * rendering/style/GridTrackSize.h:
        (WebCore::GridTrackSize::GridTrackSize):
        (WebCore::GridTrackSize::length):
        (WebCore::GridTrackSize::setLength):
        (WebCore::GridTrackSize::minTrackBreadth):
        (WebCore::GridTrackSize::maxTrackBreadth):
        (WebCore::GridTrackSize::setMinMax):
        (WebCore::GridTrackSize::operator==):
        Updated the class to handle minmax values. This means that we now always store
        2 values (the <length> case being a subset of minmax, however we kept the distinction
        to be able to reconstruct a <length> for getComputedStyle).

2012-11-30  Beth Dakin  <bdakin@apple.com>

        https://bugs.webkit.org/show_bug.cgi?id=103790



#include "CSSAspectRatioValue.h"
#include "CSSBasicShapes.h"
#include "CSSBorderImage.h"
#include "CSSFunctionValue.h"
#include "CSSLineBoxContainValue.h"
#include "CSSParser.h"
#include "CSSPrimitiveValue.h"

}
#endif

static PassRefPtr<CSSValue> valueForGridTrackBreadth(const Length& trackBreadth, const RenderStyle* style)
{
    if (trackBreadth.isPercent())
        return cssValuePool().createValue(trackBreadth);
    if (trackBreadth.isAuto())
        return cssValuePool().createIdentifierValue(CSSValueAuto);
    return zoomAdjustedPixelValue(trackBreadth.value(), style);
}

static PassRefPtr<CSSValue> valueForGridTrackMinMax(const GridTrackSize& trackSize, const RenderStyle* style)
{
    switch (trackSize.type()) {
    case LengthTrackSizing:
        return valueForGridTrackBreadth(trackSize.length(), style);
    case MinMaxTrackSizing:
        RefPtr<CSSValueList> minMaxTrackBreadths = CSSValueList::createCommaSeparated();
        minMaxTrackBreadths->append(valueForGridTrackBreadth(trackSize.minTrackBreadth(), style));
        minMaxTrackBreadths->append(valueForGridTrackBreadth(trackSize.maxTrackBreadth(), style));
        return CSSFunctionValue::create("minmax(", minMaxTrackBreadths);
    }
    ASSERT_NOT_REACHED();
    return 0;
}

static PassRefPtr<CSSValue> valueForGridTrackGroup(const Vector<GridTrackSize>& trackSizes, const RenderStyle* style)

Lines 42-47 CSSFunctionValue::CSSFunctionValue(CSSParserFunction* function) a/Source/WebCore/css/CSSFunctionValue.cpp_sec1
- a/Source/WebCore/css/CSSFunctionValue.cpp +7 lines
42	m_args = CSSValueList::createFromParserValueList(function->args.get());	42	m_args = CSSValueList::createFromParserValueList(function->args.get());
43	}	43	}
44		44
		45	CSSFunctionValue::CSSFunctionValue(String name, PassRefPtr<CSSValueList> args)
		46	: CSSValue(FunctionClass)
		47	, m_name(name)
		48	, m_args(args)
		49	{
		50	}
		51
45	String CSSFunctionValue::customCssText() const	52	String CSSFunctionValue::customCssText() const
46	{	53	{
47	StringBuilder result;	54	StringBuilder result;



        return adoptRef(new CSSFunctionValue(function));
    }

    static PassRefPtr<CSSFunctionValue> create(String name, PassRefPtr<CSSValueList> args)
    {
        return adoptRef(new CSSFunctionValue(name, args));
    }

    String customCssText() const;

    void reportDescendantMemoryUsage(MemoryObjectInfo*) const;

private:
    explicit CSSFunctionValue(CSSParserFunction*);
    explicit CSSFunctionValue(String, PassRefPtr<CSSValueList>);

    String m_name;
    RefPtr<CSSValueList> m_args;



        RefPtr<CSSPrimitiveValue> autoValue = cssValuePool().createIdentifierValue(CSSValueAuto);
        values->append(autoValue.release());
        return true;
    } else if (currentValue->unit == CSSParserValue::Function && equalIgnoringCase(currentValue->function->name, "minmax(")) {
        // We only accept the following grammar: minmax( <track-breadth> , <track-breadth> )
        CSSParserValueList* arguments = currentValue->function->args.get();
        if (!arguments || arguments->size() != 3 || !isComma(arguments->valueAt(1)))
            return false;

        RefPtr<CSSPrimitiveValue> minTrackBreadth = parseGridBreadth(arguments->valueAt(0));
        if (!minTrackBreadth)
            return false;

        RefPtr<CSSPrimitiveValue> maxTrackBreadth = parseGridBreadth(arguments->valueAt(2));
        if (!maxTrackBreadth)
            return false;

        values->append(createPrimitiveValuePair(minTrackBreadth, maxTrackBreadth));
        return true;
    }

    if (PassRefPtr<CSSPrimitiveValue> trackBreadth = parseGridBreadth(currentValue)) {




static bool createGridTrackMinMax(CSSPrimitiveValue* primitiveValue, StyleResolver* selector, GridTrackSize& trackSize)
{
    Pair* minMaxTrackBreadth = primitiveValue->getPairValue();
    if (!minMaxTrackBreadth) {
        Length workingLength;
        if (!createGridTrackBreadth(primitiveValue, selector, workingLength))
            return false;

        trackSize.setLength(workingLength);
        return true;
    }

    Length minTrackBreadth;
    Length maxTrackBreadth;
    if (!createGridTrackBreadth(minMaxTrackBreadth->first(), selector, minTrackBreadth) || !createGridTrackBreadth(minMaxTrackBreadth->second(), selector, maxTrackBreadth))
        return false;

    trackSize.setMinMax(minTrackBreadth, maxTrackBreadth);
    return true;
}




    const Vector<GridTrackSize>& trackStyles = (direction == ForColumns) ? style()->gridColumns() : style()->gridRows();
    for (size_t i = 0; i < trackStyles.size(); ++i) {
        GridTrack track;
        switch (trackStyles[i].type()) {
        case LengthTrackSizing:
            if (trackStyles[i].length().isFixed())
                track.m_usedBreadth = trackStyles[i].length().getFloatValue();
            else
                notImplemented();

            break;
        case MinMaxTrackSizing:
            // FIXME: Implement support for minmax track sizing (bug 103311).
            notImplemented();
        }
        tracks.append(track);
    }
}



namespace WebCore {

enum GridTrackSizeType {
    LengthTrackSizing,
    MinMaxTrackSizing
};

class GridTrackSize {
public:
    GridTrackSize()
        : m_type(LengthTrackSizing)
        , m_minTrackBreadth(Undefined)
        , m_maxTrackBreadth(Undefined)
    {
    }

    const Length& length() const
    {
        ASSERT(m_type == LengthTrackSizing);
        ASSERT(!m_minTrackBreadth.isUndefined());
        ASSERT(m_minTrackBreadth == m_maxTrackBreadth);
        return m_minTrackBreadth;
    }

    void setLength(const Length& length)
    {
        m_type = LengthTrackSizing;
        m_minTrackBreadth = length;
        m_maxTrackBreadth = length;
    }

    const Length& minTrackBreadth() const
    {
        ASSERT(m_type == MinMaxTrackSizing);
        ASSERT(!m_minTrackBreadth.isUndefined());
        return m_minTrackBreadth;
    }

    const Length& maxTrackBreadth() const
    {
        ASSERT(m_type == MinMaxTrackSizing);
        ASSERT(!m_maxTrackBreadth.isUndefined());
        return m_maxTrackBreadth;
    }

    void setMinMax(const Length& minTrackBreadth, const Length& maxTrackBreadth)
    {
        m_type = MinMaxTrackSizing;
        m_minTrackBreadth = minTrackBreadth;
        m_maxTrackBreadth = maxTrackBreadth;
    }

    GridTrackSizeType type() const { return m_type; }

    bool operator==(const GridTrackSize& other) const
    {
        return m_type == other.m_type && m_minTrackBreadth == other.m_minTrackBreadth && m_maxTrackBreadth == m_maxTrackBreadth;
    }

private:
    GridTrackSizeType m_type;
    Length m_minTrackBreadth;
    Length m_maxTrackBreadth;
};

} // namespace WebCore



2012-11-30  Julien Chaffraix  <jchaffraix@webkit.org>

        [CSS Grid Layout] Implement CSS parsing and handling for <track-minmax>
        https://bugs.webkit.org/show_bug.cgi?id=103799

        Reviewed by NOBODY (OOPS!).

        * fast/css-grid-layout/grid-columns-rows-get-set-expected.txt:
        * fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt:
        * fast/css-grid-layout/grid-columns-rows-get-set-multiple.html:
        * fast/css-grid-layout/grid-columns-rows-get-set.html:
        * fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js:
        * fast/css-grid-layout/resources/grid-columns-rows-get-set.js:
        Extended the following tests to cover the new grammar.

2012-11-30  Jer Noble  <jer.noble@apple.com>

        Add support for the 'unpause()' method on MediaController.

Lines 14-19 PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-co a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-expected.txt_sec1
- a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-expected.txt +12 lines
14	PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows') is 'auto'	14	PASS getComputedStyle(gridWithAutoElement, '').getPropertyValue('-webkit-grid-rows') is 'auto'
15	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns') is '100px'	15	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns') is '100px'
16	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px'	16	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px'
		17	PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-columns') is 'minmax(10%, 15px)'
		18	PASS getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-rows') is 'minmax(20px, 50%)'
17		19
18	Test the initial value	20	Test the initial value
19	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'	21	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
Lines 26-31 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is ' a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-expected.txt_sec2
26	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '40%'	28	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '40%'
27	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto'	29	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto'
28	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto'	30	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto'
		31	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'minmax(55%, 45px)'
		32	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(30px, 40%)'
		33
		34	Test setting grid-columns and grid-rows back to bad minmax value through JS
		35	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
		36	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
		37	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
		38	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
		39	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
		40	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'none'
29		41
30	Test setting grid-columns and grid-rows back to 'none' through JS	42	Test setting grid-columns and grid-rows back to 'none' through JS
31	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '18px'	43	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '18px'

Lines 14-19 PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-colu a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt_sec1
- a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt +4 lines
14	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px 170px'	14	PASS getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows') is '150px 170px'
15	PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns') is '15px auto 100px'	15	PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns') is '15px auto 100px'
16	PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows') is '120px 18px auto'	16	PASS getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows') is '120px 18px auto'
		17	PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-columns') is 'minmax(45px, 30%) 15px'
		18	PASS getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-rows') is '120px minmax(35%, 10px)'
17		19
18	Test the initial value	20	Test the initial value
19	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'	21	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'none'
Lines 28-33 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is ' a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt_sec2
28	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto auto'	30	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'auto auto'
29	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto 160px 22px'	31	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is 'auto 160px 22px'
30	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '56% 100px auto'	32	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is '56% 100px auto'
		33	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns') is '160px minmax(16px, 20px)'
		34	PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows') is 'minmax(10%, 15%) auto'
31		35
32	Test getting wrong values set from CSS	36	Test getting wrong values set from CSS
33	PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-columns') is 'none'	37	PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-columns') is 'none'

Lines 44-49 if (window.testRunner) a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html_sec1
- a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html +8 lines
44	-webkit-grid-rows: 12em 18px auto;	44	-webkit-grid-rows: 12em 18px auto;
45	font: 10px Ahem;	45	font: 10px Ahem;
46	}	46	}
		47	.gridWithMinMaxAndFixed {
		48	display: -webkit-grid;
		49	-webkit-grid-columns: minmax(45px, 30%) 15px;
		50	-webkit-grid-rows: 12em minmax(35%, 10px);
		51	font: 10px Ahem;
		52	}
		53
47	</style>	54	</style>
48	<script src="../js/resources/js-test-pre.js"></script>	55	<script src="../js/resources/js-test-pre.js"></script>
49	</head>	56	</head>
Lines 55-60 if (window.testRunner) a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html_sec2
55	<div class="gridWithNoneAndAuto" id="gridWithNoneAndAuto"></div>	62	<div class="gridWithNoneAndAuto" id="gridWithNoneAndAuto"></div>
56	<div class="gridWithNoneAndFixed" id="gridWithNoneAndFixed"></div>	63	<div class="gridWithNoneAndFixed" id="gridWithNoneAndFixed"></div>
57	<div class="gridWithThreeItems" id="gridWithThreeItems"></div>	64	<div class="gridWithThreeItems" id="gridWithThreeItems"></div>
		65	<div class="gridWithMinMaxAndFixed" id="gridWithMinMaxAndFixed"></div>
58	<script src="resources/grid-columns-rows-get-set-multiple.js"></script>	66	<script src="resources/grid-columns-rows-get-set-multiple.js"></script>
59	<script src="../js/resources/js-test-post.js"></script>	67	<script src="../js/resources/js-test-post.js"></script>
60	</body>	68	</body>

Lines 32-37 if (window.testRunner) a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set.html_sec1
- a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set.html +8 lines
32	-webkit-grid-rows: 15em;	32	-webkit-grid-rows: 15em;
33	font: 10px Ahem;	33	font: 10px Ahem;
34	}	34	}
		35
		36	.gridWithMinMax {
		37	display: -webkit-grid;
		38	-webkit-grid-columns: minmax(10%, 15px);
		39	-webkit-grid-rows: minmax(20px, 50%);
		40	};
		41
35	</style>	42	</style>
36	<script src="../js/resources/js-test-pre.js"></script>	43	<script src="../js/resources/js-test-pre.js"></script>
37	</head>	44	</head>
Lines 41-46 if (window.testRunner) a/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set.html_sec2
41	<div class="gridWithPercent" id="gridWithPercentElement"></div>	48	<div class="gridWithPercent" id="gridWithPercentElement"></div>
42	<div class="gridWithAuto" id="gridWithAutoElement"></div>	49	<div class="gridWithAuto" id="gridWithAutoElement"></div>
43	<div class="gridWithEM" id="gridWithEMElement"></div>	50	<div class="gridWithEM" id="gridWithEMElement"></div>
		51	<div class="gridWithMinMax" id="gridWithMinMax"></div>
44	<script src="resources/grid-columns-rows-get-set.js"></script>	52	<script src="resources/grid-columns-rows-get-set.js"></script>
45	<script src="../js/resources/js-test-post.js"></script>	53	<script src="../js/resources/js-test-post.js"></script>
46	</body>	54	</body>

Lines 21-26 var gridWithThreeItems = document.getElementById("gridWithThreeItems"); a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js_sec1
- a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js +12 lines
21	shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns')", "'15px auto 100px'");	21	shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-columns')", "'15px auto 100px'");
22	shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows')", "'120px 18px auto'");	22	shouldBe("getComputedStyle(gridWithThreeItems, '').getPropertyValue('-webkit-grid-rows')", "'120px 18px auto'");
23		23
		24	var gridWithMinMaxAndFixed = document.getElementById("gridWithMinMaxAndFixed");
		25	shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-columns')", "'minmax(45px, 30%) 15px'");
		26	shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('-webkit-grid-rows')", "'120px minmax(35%, 10px)'");
		27
24	debug("");	28	debug("");
25	debug("Test the initial value");	29	debug("Test the initial value");
26	var element = document.createElement("div");	30	var element = document.createElement("div");
Lines 57-62 element.style.webkitGridRows = "56% 10em auto"; a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js_sec2
57	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto 160px 22px'");	61	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto 160px 22px'");
58	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'56% 100px auto'");	62	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'56% 100px auto'");
59		63
		64	element = document.createElement("div");
		65	document.body.appendChild(element);
		66	element.style.font = "10px Ahem";
		67	element.style.webkitGridColumns = "16em minmax(16px, 20px)";
		68	element.style.webkitGridRows = "minmax(10%, 15%) auto";
		69	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'160px minmax(16px, 20px)'");
		70	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(10%, 15%) auto'");
		71
60	debug("");	72	debug("");
61	debug("Test getting wrong values set from CSS");	73	debug("Test getting wrong values set from CSS");
62	var gridWithNoneAndAuto = document.getElementById("gridWithNoneAndAuto");	74	var gridWithNoneAndAuto = document.getElementById("gridWithNoneAndAuto");



shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns')", "'100px'");
shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows')", "'150px'");

var gridWithMinMax = document.getElementById("gridWithMinMax");
shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-columns')", "'minmax(10%, 15px)'");
shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-rows')", "'minmax(20px, 50%)'");

debug("");
debug("Test the initial value");
var element = document.createElement("div");

shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto'");
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'auto'");

element = document.createElement("div");
document.body.appendChild(element);
element.style.webkitGridColumns = "minmax(55%, 45px)";
element.style.webkitGridRows = "minmax(30px, 40%)";
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(55%, 45px)'");
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(30px, 40%)'");

debug("");
debug("Test setting grid-columns and grid-rows back to bad minmax value through JS");
element = document.createElement("div");
document.body.appendChild(element);
// No comma.
element.style.webkitGridColumns = "minmax(10px 20px)";
// Only 1 argument provided.
element.style.webkitGridRows = "minmax(10px)";
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");

element = document.createElement("div");
document.body.appendChild(element);
// Nested minmax.
element.style.webkitGridColumns = "minmax(minmax(10px, 20px), 20px)";
// Only 2 arguments are allowed.
element.style.webkitGridRows = "minmax(10px, 20px, 30px)";
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");

element = document.createElement("div");
document.body.appendChild(element);
// No breadth value.
element.style.webkitGridColumns = "minmax()";
// No comma.
element.style.webkitGridRows = "minmax(30px 30% 30em)";
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");

debug("");
debug("Test setting grid-columns and grid-rows back to 'none' through JS");
element.style.webkitGridColumns = "18px";

Return to Bug 103799

Lines 30-35 a/Source/WebCore/css/CSSComputedStyleDeclaration.cpp_sec1
- a/Source/WebCore/css/CSSComputedStyleDeclaration.cpp -6 / +17 lines
30	#include "CSSAspectRatioValue.h"	30	#include "CSSAspectRatioValue.h"
31	#include "CSSBasicShapes.h"	31	#include "CSSBasicShapes.h"
32	#include "CSSBorderImage.h"	32	#include "CSSBorderImage.h"
		33	#include "CSSFunctionValue.h"
33	#include "CSSLineBoxContainValue.h"	34	#include "CSSLineBoxContainValue.h"
34	#include "CSSParser.h"	35	#include "CSSParser.h"
35	#include "CSSPrimitiveValue.h"	36	#include "CSSPrimitiveValue.h"
Lines 983-1000 PassRefPtr<CSSValue> CSSComputedStyleDeclaration::valueForFilter(const RenderObj a/Source/WebCore/css/CSSComputedStyleDeclaration.cpp_sec2
983	}	984	}
984	#endif	985	#endif
985		986
986	static PassRefPtr<CSSValue> valueForGridTrackBreadth(const GridTrackSize& trackSize, const RenderStyle* style)	987	static PassRefPtr<CSSValue> valueForGridTrackBreadth(const Length& trackBreadth, const RenderStyle* style)
987	{	988	{
988	if (trackSize.length().isPercent())	989	if (trackBreadth.isPercent())
989	return cssValuePool().createValue(trackSize.length());	990	return cssValuePool().createValue(trackBreadth);
990	if (trackSize.length().isAuto())	991	if (trackBreadth.isAuto())
991	return cssValuePool().createIdentifierValue(CSSValueAuto);	992	return cssValuePool().createIdentifierValue(CSSValueAuto);
992	return zoomAdjustedPixelValue(trackSize.length().value(), style);	993	return zoomAdjustedPixelValue(trackBreadth.value(), style);
993	}	994	}
994		995
995	static PassRefPtr<CSSValue> valueForGridTrackMinMax(const GridTrackSize& trackSize, const RenderStyle* style)	996	static PassRefPtr<CSSValue> valueForGridTrackMinMax(const GridTrackSize& trackSize, const RenderStyle* style)
996	{	997	{
997	return valueForGridTrackBreadth(trackSize, style);	998	switch (trackSize.type()) {
		999	case LengthTrackSizing:
		1000	return valueForGridTrackBreadth(trackSize.length(), style);
		1001	case MinMaxTrackSizing:
		1002	RefPtr<CSSValueList> minMaxTrackBreadths = CSSValueList::createCommaSeparated();
		1003	minMaxTrackBreadths->append(valueForGridTrackBreadth(trackSize.minTrackBreadth(), style));
		1004	minMaxTrackBreadths->append(valueForGridTrackBreadth(trackSize.maxTrackBreadth(), style));
		1005	return CSSFunctionValue::create("minmax(", minMaxTrackBreadths);
		1006	}
		1007	ASSERT_NOT_REACHED();
		1008	return 0;
998	}	1009	}
999		1010
1000	static PassRefPtr<CSSValue> valueForGridTrackGroup(const Vector<GridTrackSize>& trackSizes, const RenderStyle* style)	1011	static PassRefPtr<CSSValue> valueForGridTrackGroup(const Vector<GridTrackSize>& trackSizes, const RenderStyle* style)

Lines 4534-4539 bool CSSParser::parseGridTrackMinMax(CSSValueList* values) a/Source/WebCore/css/CSSParser.cpp_sec1
- a/Source/WebCore/css/CSSParser.cpp +16 lines
4534	RefPtr<CSSPrimitiveValue> autoValue = cssValuePool().createIdentifierValue(CSSValueAuto);	4534	RefPtr<CSSPrimitiveValue> autoValue = cssValuePool().createIdentifierValue(CSSValueAuto);
4535	values->append(autoValue.release());	4535	values->append(autoValue.release());
4536	return true;	4536	return true;
		4537	} else if (currentValue->unit == CSSParserValue::Function && equalIgnoringCase(currentValue->function->name, "minmax(")) {
		4538	// We only accept the following grammar: minmax( <track-breadth> , <track-breadth> )
		4539	CSSParserValueList* arguments = currentValue->function->args.get();
		4540	if (!arguments \|\| arguments->size() != 3 \|\| !isComma(arguments->valueAt(1)))
		4541	return false;
		4542
		4543	RefPtr<CSSPrimitiveValue> minTrackBreadth = parseGridBreadth(arguments->valueAt(0));
		4544	if (!minTrackBreadth)
		4545	return false;
		4546
		4547	RefPtr<CSSPrimitiveValue> maxTrackBreadth = parseGridBreadth(arguments->valueAt(2));
		4548	if (!maxTrackBreadth)
		4549	return false;
		4550
		4551	values->append(createPrimitiveValuePair(minTrackBreadth, maxTrackBreadth));
		4552	return true;
4537	}	4553	}
4538		4554
4539	if (PassRefPtr<CSSPrimitiveValue> trackBreadth = parseGridBreadth(currentValue)) {	4555	if (PassRefPtr<CSSPrimitiveValue> trackBreadth = parseGridBreadth(currentValue)) {

Lines 2673-2683 static bool createGridTrackBreadth(CSSPrimitiveValue* primitiveValue, StyleResol a/Source/WebCore/css/StyleResolver.cpp_sec1
- a/Source/WebCore/css/StyleResolver.cpp -3 / +14 lines
2673		2673
2674	static bool createGridTrackMinMax(CSSPrimitiveValue* primitiveValue, StyleResolver* selector, GridTrackSize& trackSize)	2674	static bool createGridTrackMinMax(CSSPrimitiveValue* primitiveValue, StyleResolver* selector, GridTrackSize& trackSize)
2675	{	2675	{
2676	Length workingLength;	2676	Pair* minMaxTrackBreadth = primitiveValue->getPairValue();
2677	if (!createGridTrackBreadth(primitiveValue, selector, workingLength))	2677	if (!minMaxTrackBreadth) {
		2678	Length workingLength;
		2679	if (!createGridTrackBreadth(primitiveValue, selector, workingLength))
		2680	return false;
		2681
		2682	trackSize.setLength(workingLength);
		2683	return true;
		2684	}
		2685
		2686	Length minTrackBreadth;
		2687	Length maxTrackBreadth;
		2688	if (!createGridTrackBreadth(minMaxTrackBreadth->first(), selector, minTrackBreadth) \|\| !createGridTrackBreadth(minMaxTrackBreadth->second(), selector, maxTrackBreadth))
2678	return false;	2689	return false;
2679		2690
2680	trackSize.setLength(workingLength);	2691	trackSize.setMinMax(minTrackBreadth, maxTrackBreadth);
2681	return true;	2692	return true;
2682	}	2693	}
2683		2694

Lines 141-151 void RenderGrid::computedUsedBreadthOfGridTracks(TrackSizingDirection direction, a/Source/WebCore/rendering/RenderGrid.cpp_sec1
- a/Source/WebCore/rendering/RenderGrid.cpp -4 / +11 lines
141	const Vector<GridTrackSize>& trackStyles = (direction == ForColumns) ? style()->gridColumns() : style()->gridRows();	141	const Vector<GridTrackSize>& trackStyles = (direction == ForColumns) ? style()->gridColumns() : style()->gridRows();
142	for (size_t i = 0; i < trackStyles.size(); ++i) {	142	for (size_t i = 0; i < trackStyles.size(); ++i) {
143	GridTrack track;	143	GridTrack track;
144	if (trackStyles[i].length().isFixed())	144	switch (trackStyles[i].type()) {
145	track.m_usedBreadth = trackStyles[i].length().getFloatValue();	145	case LengthTrackSizing:
146	else	146	if (trackStyles[i].length().isFixed())
		147	track.m_usedBreadth = trackStyles[i].length().getFloatValue();
		148	else
		149	notImplemented();
		150
		151	break;
		152	case MinMaxTrackSizing:
		153	// FIXME: Implement support for minmax track sizing (bug 103311).
147	notImplemented();	154	notImplemented();
148		155	}
149	tracks.append(track);	156	tracks.append(track);
150	}	157	}
151	}	158	}

Lines 1-3 a/Source/WebCore/ChangeLog_sec1
- a/Source/WebCore/ChangeLog +60 lines
		1	2012-11-30 Julien Chaffraix <jchaffraix@webkit.org>
		2
		3	[CSS Grid Layout] Implement CSS parsing and handling for <track-minmax>
		4	https://bugs.webkit.org/show_bug.cgi?id=103799
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	This change adds support for:
		9	<track-minmax> => minmax( <track-breadth> , <track-breadth> ) \| auto \| <track-breadth>
		10	(note that we already supported auto \| <track-breadth>).
		11
		12	The change is mostly mechanical, the only newness is that GridTrackSize was updated to
		13	hold 2 Lengths internally and we map the single Length case to 2 by duplicating the value
		14	as this matches the rendering algorithm in the spec.
		15
		16	Tests: fast/css-grid-layout/grid-columns-rows-get-set-multiple.html
		17	fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js
		18
		19	* css/CSSComputedStyleDeclaration.cpp:
		20	(WebCore::valueForGridTrackBreadth):
		21	Changed the function to do the conversion of one track breadth (one Length).
		22	This was forgotten in the preparatory change in bug 103703.
		23
		24	(WebCore::valueForGridTrackMinMax):
		25	Convert the value back using valueForGridTrackBreadth.
		26
		27	* css/CSSFunctionValue.cpp:
		28	(WebCore::CSSFunctionValue::CSSFunctionValue):
		29	* css/CSSFunctionValue.h:
		30	(WebCore::CSSFunctionValue::create):
		31	(CSSFunctionValue):
		32	Added a new constructor. This enables us to return minmax(..., ...) when queried
		33	from JavaScript. I couldn't find a better way to serialize inside CSSComputedStyleDeclaration
		34	so that it properly match the function output.
		35
		36	* css/CSSParser.cpp:
		37	(WebCore::CSSParser::parseGridTrackMinMax):
		38	Added parsing for the new syntax. We convert the 2 values into a Pair if we manage to
		39	parse both values correctly.
		40
		41	* css/StyleResolver.cpp:
		42	(WebCore::createGridTrackMinMax):
		43	Updated to handle a Pair - for minmax - and set the 2 values on GridTrackSize.
		44
		45	* rendering/RenderGrid.cpp:
		46	(WebCore::RenderGrid::computedUsedBreadthOfGridTracks):
		47	Updated to check the style. For now, we don't handle minmax values.
		48
		49	* rendering/style/GridTrackSize.h:
		50	(WebCore::GridTrackSize::GridTrackSize):
		51	(WebCore::GridTrackSize::length):
		52	(WebCore::GridTrackSize::setLength):
		53	(WebCore::GridTrackSize::minTrackBreadth):
		54	(WebCore::GridTrackSize::maxTrackBreadth):
		55	(WebCore::GridTrackSize::setMinMax):
		56	(WebCore::GridTrackSize::operator==):
		57	Updated the class to handle minmax values. This means that we now always store
		58	2 values (the <length> case being a subset of minmax, however we kept the distinction
		59	to be able to reconstruct a <length> for getComputedStyle).
		60
1	2012-11-30 Beth Dakin <bdakin@apple.com>	61	2012-11-30 Beth Dakin <bdakin@apple.com>
2		62
3	https://bugs.webkit.org/show_bug.cgi?id=103790	63	https://bugs.webkit.org/show_bug.cgi?id=103790

Lines 40-51 public: a/Source/WebCore/css/CSSFunctionValue.h_sec1
- a/Source/WebCore/css/CSSFunctionValue.h +6 lines
40	return adoptRef(new CSSFunctionValue(function));	40	return adoptRef(new CSSFunctionValue(function));
41	}	41	}
42		42
		43	static PassRefPtr<CSSFunctionValue> create(String name, PassRefPtr<CSSValueList> args)
		44	{
		45	return adoptRef(new CSSFunctionValue(name, args));
		46	}
		47
43	String customCssText() const;	48	String customCssText() const;
44		49
45	void reportDescendantMemoryUsage(MemoryObjectInfo*) const;	50	void reportDescendantMemoryUsage(MemoryObjectInfo*) const;
46		51
47	private:	52	private:
48	explicit CSSFunctionValue(CSSParserFunction*);	53	explicit CSSFunctionValue(CSSParserFunction*);
		54	explicit CSSFunctionValue(String, PassRefPtr<CSSValueList>);
49		55
50	String m_name;	56	String m_name;
51	RefPtr<CSSValueList> m_args;	57	RefPtr<CSSValueList> m_args;

Lines 36-75 a/Source/WebCore/rendering/style/GridTrackSize.h_sec1
- a/Source/WebCore/rendering/style/GridTrackSize.h -7 / +33 lines
36	namespace WebCore {	36	namespace WebCore {
37		37
38	enum GridTrackSizeType {	38	enum GridTrackSizeType {
39	LengthTrackSizing	39	LengthTrackSizing,
		40	MinMaxTrackSizing
40	};	41	};
41		42
42	class GridTrackSize {	43	class GridTrackSize {
43	public:	44	public:
44	GridTrackSize()	45	GridTrackSize()
45	: m_type(LengthTrackSizing)	46	: m_type(LengthTrackSizing)
46	, m_length(Undefined)	47	, m_minTrackBreadth(Undefined)
		48	, m_maxTrackBreadth(Undefined)
47	{	49	{
48	}	50	}
49		51
50	const Length& length() const	52	const Length& length() const
51	{	53	{
52	ASSERT(m_type == LengthTrackSizing);	54	ASSERT(m_type == LengthTrackSizing);
53	ASSERT(!m_length.isUndefined());	55	ASSERT(!m_minTrackBreadth.isUndefined());
54	return m_length;	56	ASSERT(m_minTrackBreadth == m_maxTrackBreadth);
		57	return m_minTrackBreadth;
55	}	58	}
56		59
57	void setLength(const Length& length)	60	void setLength(const Length& length)
58	{	61	{
59	m_type = LengthTrackSizing;	62	m_type = LengthTrackSizing;
60	m_length = length;	63	m_minTrackBreadth = length;
		64	m_maxTrackBreadth = length;
		65	}
		66
		67	const Length& minTrackBreadth() const
		68	{
		69	ASSERT(m_type == MinMaxTrackSizing);
		70	ASSERT(!m_minTrackBreadth.isUndefined());
		71	return m_minTrackBreadth;
		72	}
		73
		74	const Length& maxTrackBreadth() const
		75	{
		76	ASSERT(m_type == MinMaxTrackSizing);
		77	ASSERT(!m_maxTrackBreadth.isUndefined());
		78	return m_maxTrackBreadth;
		79	}
		80
		81	void setMinMax(const Length& minTrackBreadth, const Length& maxTrackBreadth)
		82	{
		83	m_type = MinMaxTrackSizing;
		84	m_minTrackBreadth = minTrackBreadth;
		85	m_maxTrackBreadth = maxTrackBreadth;
61	}	86	}
62		87
63	GridTrackSizeType type() const { return m_type; }	88	GridTrackSizeType type() const { return m_type; }
64		89
65	bool operator==(const GridTrackSize& other) const	90	bool operator==(const GridTrackSize& other) const
66	{	91	{
67	return m_type == other.m_type && m_length == other.m_length;	92	return m_type == other.m_type && m_minTrackBreadth == other.m_minTrackBreadth && m_maxTrackBreadth == m_maxTrackBreadth;
68	}	93	}
69		94
70	private:	95	private:
71	GridTrackSizeType m_type;	96	GridTrackSizeType m_type;
72	Length m_length;	97	Length m_minTrackBreadth;
		98	Length m_maxTrackBreadth;
73	};	99	};
74		100
75	} // namespace WebCore	101	} // namespace WebCore

Lines 1-3 a/LayoutTests/ChangeLog_sec1
- a/LayoutTests/ChangeLog +15 lines
		1	2012-11-30 Julien Chaffraix <jchaffraix@webkit.org>
		2
		3	[CSS Grid Layout] Implement CSS parsing and handling for <track-minmax>
		4	https://bugs.webkit.org/show_bug.cgi?id=103799
		5
		6	Reviewed by NOBODY (OOPS!).
		7
		8	* fast/css-grid-layout/grid-columns-rows-get-set-expected.txt:
		9	* fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt:
		10	* fast/css-grid-layout/grid-columns-rows-get-set-multiple.html:
		11	* fast/css-grid-layout/grid-columns-rows-get-set.html:
		12	* fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js:
		13	* fast/css-grid-layout/resources/grid-columns-rows-get-set.js:
		14	Extended the following tests to cover the new grammar.
		15
1	2012-11-30 Jer Noble <jer.noble@apple.com>	16	2012-11-30 Jer Noble <jer.noble@apple.com>
2		17
3	Add support for the 'unpause()' method on MediaController.	18	Add support for the 'unpause()' method on MediaController.

Lines 21-26 var gridWithEMElement = document.getElementById("gridWithEMElement"); a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js_sec1
- a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js +40 lines
21	shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns')", "'100px'");	21	shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-columns')", "'100px'");
22	shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows')", "'150px'");	22	shouldBe("getComputedStyle(gridWithEMElement, '').getPropertyValue('-webkit-grid-rows')", "'150px'");
23		23
		24	var gridWithMinMax = document.getElementById("gridWithMinMax");
		25	shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-columns')", "'minmax(10%, 15px)'");
		26	shouldBe("getComputedStyle(gridWithMinMax, '').getPropertyValue('-webkit-grid-rows')", "'minmax(20px, 50%)'");
		27
24	debug("");	28	debug("");
25	debug("Test the initial value");	29	debug("Test the initial value");
26	var element = document.createElement("div");	30	var element = document.createElement("div");
Lines 49-54 element.style.webkitGridRows = "auto"; a/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js_sec2
49	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto'");	53	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'auto'");
50	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'auto'");	54	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'auto'");
51		55
		56	element = document.createElement("div");
		57	document.body.appendChild(element);
		58	element.style.webkitGridColumns = "minmax(55%, 45px)";
		59	element.style.webkitGridRows = "minmax(30px, 40%)";
		60	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'minmax(55%, 45px)'");
		61	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'minmax(30px, 40%)'");
		62
		63	debug("");
		64	debug("Test setting grid-columns and grid-rows back to bad minmax value through JS");
		65	element = document.createElement("div");
		66	document.body.appendChild(element);
		67	// No comma.
		68	element.style.webkitGridColumns = "minmax(10px 20px)";
		69	// Only 1 argument provided.
		70	element.style.webkitGridRows = "minmax(10px)";
		71	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
		72	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
		73
		74	element = document.createElement("div");
		75	document.body.appendChild(element);
		76	// Nested minmax.
		77	element.style.webkitGridColumns = "minmax(minmax(10px, 20px), 20px)";
		78	// Only 2 arguments are allowed.
		79	element.style.webkitGridRows = "minmax(10px, 20px, 30px)";
		80	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
		81	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
		82
		83	element = document.createElement("div");
		84	document.body.appendChild(element);
		85	// No breadth value.
		86	element.style.webkitGridColumns = "minmax()";
		87	// No comma.
		88	element.style.webkitGridRows = "minmax(30px 30% 30em)";
		89	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-columns')", "'none'");
		90	shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-rows')", "'none'");
		91
52	debug("");	92	debug("");
53	debug("Test setting grid-columns and grid-rows back to 'none' through JS");	93	debug("Test setting grid-columns and grid-rows back to 'none' through JS");
54	element.style.webkitGridColumns = "18px";	94	element.style.webkitGridColumns = "18px";