зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1289200 - Adds GridAreas to grid css dev tools API. r=bz, mats
This commit is contained in:
Родитель
fc07e38ecd
Коммит
3d92babadf
|
@ -6,6 +6,7 @@
|
|||
|
||||
#include "Grid.h"
|
||||
|
||||
#include "GridArea.h"
|
||||
#include "GridDimension.h"
|
||||
#include "mozilla/dom/GridBinding.h"
|
||||
#include "nsGridContainerFrame.h"
|
||||
|
@ -13,7 +14,7 @@
|
|||
namespace mozilla {
|
||||
namespace dom {
|
||||
|
||||
NS_IMPL_CYCLE_COLLECTION_WRAPPERCACHE(Grid, mParent, mRows, mCols)
|
||||
NS_IMPL_CYCLE_COLLECTION_WRAPPERCACHE(Grid, mParent, mRows, mCols, mAreas)
|
||||
NS_IMPL_CYCLE_COLLECTING_ADDREF(Grid)
|
||||
NS_IMPL_CYCLE_COLLECTING_RELEASE(Grid)
|
||||
NS_INTERFACE_MAP_BEGIN_CYCLE_COLLECTION(Grid)
|
||||
|
@ -43,6 +44,40 @@ Grid::Grid(nsISupports* aParent,
|
|||
aFrame->GetComputedTemplateColumnLines();
|
||||
mCols->SetTrackInfo(columnTrackInfo);
|
||||
mCols->SetLineInfo(columnTrackInfo, columnLineInfo);
|
||||
|
||||
// Add implicit areas first.
|
||||
nsGridContainerFrame::ImplicitNamedAreas* implicitAreas =
|
||||
aFrame->GetImplicitNamedAreas();
|
||||
if (implicitAreas) {
|
||||
for (auto iter = implicitAreas->Iter(); !iter.Done(); iter.Next()) {
|
||||
nsStringHashKey* entry = iter.Get();
|
||||
|
||||
GridArea* area = new GridArea(this,
|
||||
nsString(entry->GetKey()),
|
||||
GridDeclaration::Implicit,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0);
|
||||
mAreas.AppendElement(area);
|
||||
}
|
||||
}
|
||||
|
||||
// Add explicit areas next.
|
||||
nsGridContainerFrame::ExplicitNamedAreas* explicitAreas =
|
||||
aFrame->GetExplicitNamedAreas();
|
||||
if (explicitAreas) {
|
||||
for (auto areaInfo : *explicitAreas) {
|
||||
GridArea* area = new GridArea(this,
|
||||
areaInfo.mName,
|
||||
GridDeclaration::Explicit,
|
||||
areaInfo.mRowStart,
|
||||
areaInfo.mRowEnd,
|
||||
areaInfo.mColumnStart,
|
||||
areaInfo.mColumnEnd);
|
||||
mAreas.AppendElement(area);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Grid::~Grid()
|
||||
|
@ -67,5 +102,11 @@ Grid::Cols() const
|
|||
return mCols;
|
||||
}
|
||||
|
||||
void
|
||||
Grid::GetAreas(nsTArray<RefPtr<GridArea>>& aAreas) const
|
||||
{
|
||||
aAreas = mAreas;
|
||||
}
|
||||
|
||||
} // namespace dom
|
||||
} // namespace mozilla
|
||||
|
|
|
@ -7,6 +7,7 @@
|
|||
#ifndef mozilla_dom_Grid_h
|
||||
#define mozilla_dom_Grid_h
|
||||
|
||||
#include "GridArea.h"
|
||||
#include "mozilla/dom/Element.h"
|
||||
#include "nsGridContainerFrame.h"
|
||||
#include "nsISupports.h"
|
||||
|
@ -38,11 +39,13 @@ public:
|
|||
|
||||
GridDimension* Rows() const;
|
||||
GridDimension* Cols() const;
|
||||
void GetAreas(nsTArray<RefPtr<GridArea>>& aAreas) const;
|
||||
|
||||
protected:
|
||||
nsCOMPtr<Element> mParent;
|
||||
RefPtr<GridDimension> mRows;
|
||||
RefPtr<GridDimension> mCols;
|
||||
nsTArray<RefPtr<GridArea>> mAreas;
|
||||
};
|
||||
|
||||
} // namespace dom
|
||||
|
|
|
@ -0,0 +1,86 @@
|
|||
/* -*- Mode: C++; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
||||
/* vim: set ts=8 sts=2 et sw=2 tw=80: */
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#include "GridArea.h"
|
||||
#include "mozilla/dom/GridBinding.h"
|
||||
#include "Grid.h"
|
||||
|
||||
namespace mozilla {
|
||||
namespace dom {
|
||||
|
||||
NS_IMPL_CYCLE_COLLECTION_WRAPPERCACHE(GridArea, mParent)
|
||||
NS_IMPL_CYCLE_COLLECTING_ADDREF(GridArea)
|
||||
NS_IMPL_CYCLE_COLLECTING_RELEASE(GridArea)
|
||||
NS_INTERFACE_MAP_BEGIN_CYCLE_COLLECTION(GridArea)
|
||||
NS_WRAPPERCACHE_INTERFACE_MAP_ENTRY
|
||||
NS_INTERFACE_MAP_ENTRY(nsISupports)
|
||||
NS_INTERFACE_MAP_END
|
||||
|
||||
GridArea::GridArea(Grid* aParent,
|
||||
const nsString& aName,
|
||||
GridDeclaration aType,
|
||||
uint32_t aRowStart,
|
||||
uint32_t aRowEnd,
|
||||
uint32_t aColumnStart,
|
||||
uint32_t aColumnEnd)
|
||||
: mParent(aParent)
|
||||
, mName(aName)
|
||||
, mType(aType)
|
||||
, mRowStart(aRowStart)
|
||||
, mRowEnd(aRowEnd)
|
||||
, mColumnStart(aColumnStart)
|
||||
, mColumnEnd(aColumnEnd)
|
||||
{
|
||||
}
|
||||
|
||||
GridArea::~GridArea()
|
||||
{
|
||||
}
|
||||
|
||||
JSObject*
|
||||
GridArea::WrapObject(JSContext* aCx, JS::Handle<JSObject*> aGivenProto)
|
||||
{
|
||||
return GridAreaBinding::Wrap(aCx, this, aGivenProto);
|
||||
}
|
||||
|
||||
void
|
||||
GridArea::GetName(nsString& aName) const
|
||||
{
|
||||
aName = mName;
|
||||
}
|
||||
|
||||
GridDeclaration
|
||||
GridArea::Type() const
|
||||
{
|
||||
return mType;
|
||||
}
|
||||
|
||||
uint32_t
|
||||
GridArea::RowStart() const
|
||||
{
|
||||
return mRowStart;
|
||||
}
|
||||
|
||||
uint32_t
|
||||
GridArea::RowEnd() const
|
||||
{
|
||||
return mRowEnd;
|
||||
}
|
||||
|
||||
uint32_t
|
||||
GridArea::ColumnStart() const
|
||||
{
|
||||
return mColumnStart;
|
||||
}
|
||||
|
||||
uint32_t
|
||||
GridArea::ColumnEnd() const
|
||||
{
|
||||
return mColumnEnd;
|
||||
}
|
||||
|
||||
} // namespace dom
|
||||
} // namespace mozilla
|
|
@ -0,0 +1,63 @@
|
|||
/* -*- Mode: C++; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
||||
/* vim: set ts=8 sts=2 et sw=2 tw=80: */
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#ifndef mozilla_dom_GridArea_h
|
||||
#define mozilla_dom_GridArea_h
|
||||
|
||||
#include "mozilla/dom/GridBinding.h"
|
||||
#include "nsWrapperCache.h"
|
||||
|
||||
namespace mozilla {
|
||||
namespace dom {
|
||||
|
||||
class Grid;
|
||||
|
||||
class GridArea : public nsISupports
|
||||
, public nsWrapperCache
|
||||
{
|
||||
public:
|
||||
explicit GridArea(Grid *aParent,
|
||||
const nsString& aName,
|
||||
GridDeclaration aType,
|
||||
uint32_t aRowStart,
|
||||
uint32_t aRowEnd,
|
||||
uint32_t aColumnStart,
|
||||
uint32_t aColumnEnd);
|
||||
|
||||
protected:
|
||||
virtual ~GridArea();
|
||||
|
||||
public:
|
||||
NS_DECL_CYCLE_COLLECTING_ISUPPORTS
|
||||
NS_DECL_CYCLE_COLLECTION_SCRIPT_HOLDER_CLASS(GridArea)
|
||||
|
||||
virtual JSObject* WrapObject(JSContext* aCx, JS::Handle<JSObject*> aGivenProto) override;
|
||||
Grid* GetParentObject()
|
||||
{
|
||||
return mParent;
|
||||
}
|
||||
|
||||
void GetName(nsString& aName) const;
|
||||
GridDeclaration Type() const;
|
||||
uint32_t RowStart() const;
|
||||
uint32_t RowEnd() const;
|
||||
uint32_t ColumnStart() const;
|
||||
uint32_t ColumnEnd() const;
|
||||
|
||||
protected:
|
||||
RefPtr<Grid> mParent;
|
||||
const nsString mName;
|
||||
const GridDeclaration mType;
|
||||
const uint32_t mRowStart;
|
||||
const uint32_t mRowEnd;
|
||||
const uint32_t mColumnStart;
|
||||
const uint32_t mColumnEnd;
|
||||
};
|
||||
|
||||
} // namespace dom
|
||||
} // namespace mozilla
|
||||
|
||||
#endif /* mozilla_dom_GridTrack_h */
|
|
@ -24,6 +24,7 @@ GridLine::GridLine(GridLines *aParent)
|
|||
: mParent(aParent)
|
||||
, mStart(0.0)
|
||||
, mBreadth(0.0)
|
||||
, mType(GridDeclaration::Implicit)
|
||||
, mNumber(0)
|
||||
{
|
||||
MOZ_ASSERT(aParent, "Should never be instantiated with a null GridLines");
|
||||
|
@ -57,6 +58,12 @@ GridLine::Breadth() const
|
|||
return mBreadth;
|
||||
}
|
||||
|
||||
GridDeclaration
|
||||
GridLine::Type() const
|
||||
{
|
||||
return mType;
|
||||
}
|
||||
|
||||
uint32_t
|
||||
GridLine::Number() const
|
||||
{
|
||||
|
@ -64,15 +71,17 @@ GridLine::Number() const
|
|||
}
|
||||
|
||||
void
|
||||
GridLine::SetLineValues(double aStart,
|
||||
GridLine::SetLineValues(const nsTArray<nsString>& aNames,
|
||||
double aStart,
|
||||
double aBreadth,
|
||||
uint32_t aNumber,
|
||||
const nsTArray<nsString>& aNames)
|
||||
GridDeclaration aType)
|
||||
{
|
||||
mNames = aNames;
|
||||
mStart = aStart;
|
||||
mBreadth = aBreadth;
|
||||
mNumber = aNumber;
|
||||
mNames = aNames;
|
||||
mType = aType;
|
||||
}
|
||||
|
||||
} // namespace dom
|
||||
|
|
|
@ -7,6 +7,7 @@
|
|||
#ifndef mozilla_dom_GridLine_h
|
||||
#define mozilla_dom_GridLine_h
|
||||
|
||||
#include "mozilla/dom/GridBinding.h"
|
||||
#include "nsString.h"
|
||||
#include "nsTArray.h"
|
||||
#include "nsWrapperCache.h"
|
||||
|
@ -39,19 +40,22 @@ public:
|
|||
|
||||
double Start() const;
|
||||
double Breadth() const;
|
||||
GridDeclaration Type() const;
|
||||
uint32_t Number() const;
|
||||
|
||||
void SetLineValues(double aStart,
|
||||
void SetLineValues(const nsTArray<nsString>& aNames,
|
||||
double aStart,
|
||||
double aBreadth,
|
||||
uint32_t aNumber,
|
||||
const nsTArray<nsString>& aNames);
|
||||
GridDeclaration aType);
|
||||
|
||||
protected:
|
||||
RefPtr<GridLines> mParent;
|
||||
nsTArray<nsString> mNames;
|
||||
double mStart;
|
||||
double mBreadth;
|
||||
GridDeclaration mType;
|
||||
uint32_t mNumber;
|
||||
nsTArray<nsString> mNames;
|
||||
};
|
||||
|
||||
} // namespace dom
|
||||
|
|
|
@ -97,11 +97,22 @@ GridLines::SetLineInfo(const ComputedGridTrackInfo* aTrackInfo,
|
|||
}
|
||||
|
||||
line->SetLineValues(
|
||||
lineNames,
|
||||
nsPresContext::AppUnitsToDoubleCSSPixels(endOfLastTrack),
|
||||
nsPresContext::AppUnitsToDoubleCSSPixels(startOfNextTrack -
|
||||
endOfLastTrack),
|
||||
i + 1,
|
||||
lineNames
|
||||
(
|
||||
// Implicit if there are no explicit tracks, or if the index
|
||||
// is before the first explicit track, or after
|
||||
// a track beyond the last explicit track.
|
||||
(aTrackInfo->mNumExplicitTracks == 0) ||
|
||||
(i < aTrackInfo->mNumLeadingImplicitTracks) ||
|
||||
(i > aTrackInfo->mNumLeadingImplicitTracks +
|
||||
aTrackInfo->mNumExplicitTracks) ?
|
||||
GridDeclaration::Implicit :
|
||||
GridDeclaration::Explicit
|
||||
)
|
||||
);
|
||||
|
||||
if (i < aTrackInfo->mEndFragmentTrack) {
|
||||
|
|
|
@ -24,7 +24,7 @@ GridTrack::GridTrack(GridTracks* aParent)
|
|||
: mParent(aParent)
|
||||
, mStart(0.0)
|
||||
, mBreadth(0.0)
|
||||
, mType(GridTrackType::Implicit)
|
||||
, mType(GridDeclaration::Implicit)
|
||||
, mState(GridTrackState::Static)
|
||||
{
|
||||
MOZ_ASSERT(aParent, "Should never be instantiated with a null GridTracks");
|
||||
|
@ -52,7 +52,7 @@ GridTrack::Breadth() const
|
|||
return mBreadth;
|
||||
}
|
||||
|
||||
GridTrackType
|
||||
GridDeclaration
|
||||
GridTrack::Type() const
|
||||
{
|
||||
return mType;
|
||||
|
@ -67,7 +67,7 @@ GridTrack::State() const
|
|||
void
|
||||
GridTrack::SetTrackValues(double aStart,
|
||||
double aBreadth,
|
||||
GridTrackType aType,
|
||||
GridDeclaration aType,
|
||||
GridTrackState aState)
|
||||
{
|
||||
mStart = aStart;
|
||||
|
|
|
@ -36,16 +36,19 @@ public:
|
|||
|
||||
double Start() const;
|
||||
double Breadth() const;
|
||||
GridTrackType Type() const;
|
||||
GridDeclaration Type() const;
|
||||
GridTrackState State() const;
|
||||
|
||||
void SetTrackValues(double aStart, double aBreadth, GridTrackType aType, GridTrackState aState);
|
||||
void SetTrackValues(double aStart,
|
||||
double aBreadth,
|
||||
GridDeclaration aType,
|
||||
GridTrackState aState);
|
||||
|
||||
protected:
|
||||
RefPtr<GridTracks> mParent;
|
||||
double mStart;
|
||||
double mBreadth;
|
||||
GridTrackType mType;
|
||||
GridDeclaration mType;
|
||||
GridTrackState mState;
|
||||
};
|
||||
|
||||
|
|
|
@ -86,8 +86,8 @@ GridTracks::SetTrackInfo(const ComputedGridTrackInfo* aTrackInfo)
|
|||
(i < aTrackInfo->mNumLeadingImplicitTracks) ||
|
||||
(i >= aTrackInfo->mNumLeadingImplicitTracks +
|
||||
aTrackInfo->mNumExplicitTracks) ?
|
||||
GridTrackType::Implicit :
|
||||
GridTrackType::Explicit
|
||||
GridDeclaration::Implicit :
|
||||
GridDeclaration::Explicit
|
||||
),
|
||||
GridTrackState(aTrackInfo->mStates[i])
|
||||
);
|
||||
|
|
|
@ -8,6 +8,7 @@ MOCHITEST_CHROME_MANIFESTS += ['test/chrome.ini']
|
|||
|
||||
EXPORTS.mozilla.dom += [
|
||||
'Grid.h',
|
||||
'GridArea.h',
|
||||
'GridDimension.h',
|
||||
'GridLine.h',
|
||||
'GridLines.h',
|
||||
|
@ -17,6 +18,7 @@ EXPORTS.mozilla.dom += [
|
|||
|
||||
UNIFIED_SOURCES += [
|
||||
'Grid.cpp',
|
||||
'GridArea.cpp',
|
||||
'GridDimension.cpp',
|
||||
'GridLine.cpp',
|
||||
'GridLines.cpp',
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
[chrome/test_grid_areas.html]
|
||||
[chrome/test_grid_fragmentation.html]
|
||||
[chrome/test_grid_implicit.html]
|
||||
[chrome/test_grid_lines.html]
|
||||
[chrome/test_grid_object.html]
|
||||
[chrome/test_grid_track_state.html]
|
||||
|
|
|
@ -0,0 +1,96 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
|
||||
<style>
|
||||
body {
|
||||
margin: 40px;
|
||||
}
|
||||
.wrapper {
|
||||
display: grid;
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
grid-gap: 20px;
|
||||
grid-template-columns: 50px 1fr 50px;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
grid-template-areas: "areaA areaA ....."
|
||||
"areaB areaC areaC"
|
||||
"areaB areaC areaC";
|
||||
background-color: #f00;
|
||||
}
|
||||
.box {
|
||||
background-color: #444;
|
||||
color: #fff;
|
||||
}
|
||||
.a {
|
||||
grid-area: areaA;
|
||||
}
|
||||
.b {
|
||||
grid-area: areaB;
|
||||
}
|
||||
.c {
|
||||
grid-area: areaC;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
function runTests() {
|
||||
var wrapper = document.getElementById("wrapper");
|
||||
var grid = wrapper.getGridFragments()[0];
|
||||
|
||||
// test existence of property
|
||||
isnot(typeof(grid.areas), "undefined", "Grid.areas property exists.");
|
||||
|
||||
if (typeof(grid.areas) != "undefined") {
|
||||
// test that the right number of areas are reported
|
||||
is(grid.areas.length, 3, "3 areas are reported.");
|
||||
|
||||
if (grid.areas.length == 3) {
|
||||
// test area names
|
||||
is(grid.areas[0].name, "areaA", "Area 0 has proper name.");
|
||||
is(grid.areas[1].name, "areaB", "Area 1 has proper name.");
|
||||
is(grid.areas[2].name, "areaC", "Area 2 has proper name.");
|
||||
|
||||
// test area types
|
||||
is(grid.areas[0].type, "explicit", "Area 0 is explicit.");
|
||||
is(grid.areas[1].type, "explicit", "Area 1 is explicit.");
|
||||
is(grid.areas[2].type, "explicit", "Area 2 is explicit.");
|
||||
|
||||
// test start and end lines
|
||||
is(grid.areas[0].rowStart, 1, "Area 0 has start row line of 1.");
|
||||
is(grid.areas[0].rowEnd, 2, "Area 0 has end row line of 2.");
|
||||
is(grid.areas[0].columnStart, 1, "Area 0 has start column line of 1.");
|
||||
is(grid.areas[0].columnEnd, 3, "Area 0 has end column line of 3.");
|
||||
|
||||
is(grid.areas[1].rowStart, 2, "Area 1 has start row line of 2.");
|
||||
is(grid.areas[1].rowEnd, 4, "Area 1 has end row line of 4.");
|
||||
is(grid.areas[1].columnStart, 1, "Area 1 has start column line of 1.");
|
||||
is(grid.areas[1].columnEnd, 2, "Area 1 has end column line of 2.");
|
||||
|
||||
is(grid.areas[2].rowStart, 2, "Area 2 has start row line of 2.");
|
||||
is(grid.areas[2].rowEnd, 4, "Area 2 has end row line of 4.");
|
||||
is(grid.areas[2].columnStart, 2, "Area 2 has start column line of 2.");
|
||||
is(grid.areas[2].columnEnd, 4, "Area 2 has end column line of 4.");
|
||||
}
|
||||
}
|
||||
|
||||
SimpleTest.finish();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onLoad="runTests();">
|
||||
|
||||
<div id="wrapper" class="wrapper">
|
||||
<div id="boxA" class="box a">A</div>
|
||||
<div id="boxB" class="box b">B</div>
|
||||
<div id="boxC" class="box c">C</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,129 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
|
||||
<style>
|
||||
body {
|
||||
margin: 40px;
|
||||
}
|
||||
.wrapper {
|
||||
display: grid;
|
||||
grid-gap: 10px;
|
||||
grid-template-columns: 100px 50px 100px;
|
||||
grid-template-rows: 50px [areaD-start] 50px [areaD-end];
|
||||
grid-template-areas: "areaA areaA ....."
|
||||
"..... areaC areaC";
|
||||
grid-auto-columns: 20px;
|
||||
grid-auto-rows: 20px;
|
||||
background-color: #f00;
|
||||
}
|
||||
.box {
|
||||
background-color: #444;
|
||||
color: #fff;
|
||||
}
|
||||
.a {
|
||||
grid-area: areaA;
|
||||
}
|
||||
.b {
|
||||
grid-row: span 2 / 2;
|
||||
grid-column: areaA-end / span 2;
|
||||
}
|
||||
.c {
|
||||
grid-area: areaC;
|
||||
}
|
||||
.d {
|
||||
grid-area: areaD;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
function runTests() {
|
||||
var wrapper = document.getElementById("wrapper");
|
||||
var grid = wrapper.getGridFragments()[0];
|
||||
var boxA = document.getElementById("boxA");
|
||||
var boxB = document.getElementById("boxB");
|
||||
var boxC = document.getElementById("boxC");
|
||||
|
||||
// test column and row line counts
|
||||
is(grid.cols.lines.length, 6,
|
||||
"Grid.cols.lines property has length that respects implicit expansion."
|
||||
);
|
||||
is(grid.rows.lines.length, 4,
|
||||
"Grid.rows.lines property has length that respects implicit expansion."
|
||||
);
|
||||
|
||||
if((grid.cols.lines.length == 6) &&
|
||||
(grid.rows.lines.length == 4)) {
|
||||
|
||||
// test explicit / implicit lines
|
||||
is(grid.cols.lines[0].type, "explicit", "Grid column line 1 is explicit.");
|
||||
is(grid.cols.lines[4].type, "implicit", "Grid column line 5 is implicit.");
|
||||
is(grid.cols.lines[5].type, "implicit", "Grid column line 6 is implicit.");
|
||||
|
||||
is(grid.rows.lines[0].type, "implicit", "Grid row line 1 is implicit.");
|
||||
is(grid.rows.lines[1].type, "explicit", "Grid row line 2 is explicit.");
|
||||
is(grid.rows.lines[3].type, "explicit", "Grid row line 4 is explicit.");
|
||||
}
|
||||
|
||||
// test column and row track counts
|
||||
is(grid.cols.tracks.length, 5,
|
||||
"Grid.cols.tracks property has length that respects implicit expansion."
|
||||
);
|
||||
is(grid.rows.tracks.length, 3,
|
||||
"Grid.rows.tracks property has length that respects implicit expansion."
|
||||
);
|
||||
|
||||
if((grid.cols.tracks.length == 5) &&
|
||||
(grid.rows.tracks.length == 3)) {
|
||||
|
||||
// test explicit / implicit tracks
|
||||
is(grid.cols.tracks[0].type, "explicit", "Grid column track 1 is explicit.");
|
||||
is(grid.cols.tracks[3].type, "implicit", "Grid column track 4 is implicit.");
|
||||
is(grid.cols.tracks[4].type, "implicit", "Grid column track 5 is implicit.");
|
||||
|
||||
is(grid.rows.tracks[0].type, "implicit", "Grid row track 1 is implicit.");
|
||||
is(grid.rows.tracks[1].type, "explicit", "Grid row track 2 is explicit.");
|
||||
is(grid.rows.tracks[2].type, "explicit", "Grid row track 3 is explicit.");
|
||||
}
|
||||
|
||||
// test area count
|
||||
is(grid.areas.length, 3,
|
||||
"Grid.areas property has length that respects implicit expansion."
|
||||
);
|
||||
|
||||
for(var i = 0; i < grid.areas.length; i++) {
|
||||
var area = grid.areas[i];
|
||||
if(area.name == "areaD") {
|
||||
is(area.type, "implicit", area.name + " is implicit.");
|
||||
|
||||
// test lines of implicit areas
|
||||
todo_is(area.rowStart, 2, area.name + " has start row line of 2.");
|
||||
todo_is(area.rowEnd, 3, area.name + " has end row line of 3.");
|
||||
todo_is(area.columnStart, 4, area.name + " has start column line of 4.");
|
||||
todo_is(area.columnEnd, 5, area.name + " has end column line of 5.");
|
||||
} else {
|
||||
is(area.type, "explicit", area.name + " is explicit.");
|
||||
}
|
||||
}
|
||||
|
||||
SimpleTest.finish();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onLoad="runTests();">
|
||||
|
||||
<div id="wrapper" class="wrapper">
|
||||
<div id="boxA" class="box a">A</div>
|
||||
<div id="boxB" class="box b">B</div>
|
||||
<div id="boxC" class="box c">C</div>
|
||||
<div id="boxD" class="box d">D</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -1,13 +1,31 @@
|
|||
/* -*- Mode: IDL; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
|
||||
* You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
*/
|
||||
|
||||
/* These objects support visualization of a css-grid by the dev tools. */
|
||||
|
||||
/**
|
||||
* Explicit and implicit types apply to tracks, lines, and areas.
|
||||
* https://drafts.csswg.org/css-grid/#explicit-grids
|
||||
* https://drafts.csswg.org/css-grid/#implicit-grids
|
||||
*/
|
||||
enum GridDeclaration { "explicit", "implicit" };
|
||||
|
||||
/**
|
||||
* Tracks expanded from auto-fill or auto-fit have repeat state, other tracks
|
||||
* are static.
|
||||
*/
|
||||
enum GridTrackState { "static", "repeat" };
|
||||
|
||||
[ChromeOnly]
|
||||
interface Grid
|
||||
{
|
||||
readonly attribute GridDimension rows;
|
||||
readonly attribute GridDimension cols;
|
||||
[Cached, Constant]
|
||||
readonly attribute sequence<GridArea> areas;
|
||||
};
|
||||
|
||||
[ChromeOnly]
|
||||
|
@ -21,34 +39,77 @@ interface GridDimension
|
|||
interface GridLines
|
||||
{
|
||||
readonly attribute unsigned long length;
|
||||
|
||||
/**
|
||||
* This accessor method allows array-like access to lines.
|
||||
* @param index A 0-indexed value.
|
||||
*/
|
||||
getter GridLine? item(unsigned long index);
|
||||
};
|
||||
|
||||
[ChromeOnly]
|
||||
interface GridLine
|
||||
{
|
||||
readonly attribute double start;
|
||||
readonly attribute double breadth;
|
||||
readonly attribute unsigned long number;
|
||||
[Cached, Pure]
|
||||
/**
|
||||
* Names include both explicit names and implicit names, which will be
|
||||
* assigned if the line contributes to a named area.
|
||||
* https://drafts.csswg.org/css-grid/#implicit-named-lines
|
||||
*/
|
||||
[Cached, Constant]
|
||||
readonly attribute sequence<DOMString> names;
|
||||
|
||||
readonly attribute double start;
|
||||
|
||||
/**
|
||||
* Breadth is the gap between the start of this line and the start of the
|
||||
* next track in flow direction. It primarily is set by use of the -gap
|
||||
* properties.
|
||||
* https://drafts.csswg.org/css-grid/#gutters
|
||||
*/
|
||||
readonly attribute double breadth;
|
||||
|
||||
readonly attribute GridDeclaration type;
|
||||
|
||||
/**
|
||||
* Number is the 1-indexed index of the line in flow order.
|
||||
*/
|
||||
readonly attribute unsigned long number;
|
||||
};
|
||||
|
||||
[ChromeOnly]
|
||||
interface GridTracks
|
||||
{
|
||||
readonly attribute unsigned long length;
|
||||
|
||||
/**
|
||||
* This accessor method allows array-like access to tracks.
|
||||
* @param index A 0-indexed value.
|
||||
*/
|
||||
getter GridTrack? item(unsigned long index);
|
||||
};
|
||||
|
||||
enum GridTrackType { "explicit", "implicit" };
|
||||
enum GridTrackState { "static", "repeat" };
|
||||
|
||||
[ChromeOnly]
|
||||
interface GridTrack
|
||||
{
|
||||
readonly attribute double start;
|
||||
readonly attribute double breadth;
|
||||
readonly attribute GridTrackType type;
|
||||
readonly attribute GridDeclaration type;
|
||||
readonly attribute GridTrackState state;
|
||||
};
|
||||
|
||||
[ChromeOnly]
|
||||
interface GridArea
|
||||
{
|
||||
readonly attribute DOMString name;
|
||||
readonly attribute GridDeclaration type;
|
||||
|
||||
/**
|
||||
* These values are 1-indexed line numbers bounding the area.
|
||||
* FIXME: Bug 1297189 - Implicit grid areas need boundary line numbers
|
||||
* exposed to dev tools
|
||||
*/
|
||||
readonly attribute unsigned long rowStart;
|
||||
readonly attribute unsigned long rowEnd;
|
||||
readonly attribute unsigned long columnStart;
|
||||
readonly attribute unsigned long columnEnd;
|
||||
};
|
||||
|
|
|
@ -5764,6 +5764,16 @@ nsGridContainerFrame::Reflow(nsPresContext* aPresContext,
|
|||
ComputedGridLineInfo* rowLineInfo = new ComputedGridLineInfo(
|
||||
Move(rowLineNames));
|
||||
Properties().Set(GridRowLineInfo(), rowLineInfo);
|
||||
|
||||
// Generate area info for explicit areas. Implicit areas are handled
|
||||
// elsewhere.
|
||||
if (gridReflowInput.mGridStyle->mGridTemplateAreas) {
|
||||
nsTArray<css::GridNamedArea>* areas = new nsTArray<css::GridNamedArea>(
|
||||
gridReflowInput.mGridStyle->mGridTemplateAreas->mNamedAreas);
|
||||
Properties().Set(ExplicitNamedAreasProperty(), areas);
|
||||
} else {
|
||||
Properties().Delete(ExplicitNamedAreasProperty());
|
||||
}
|
||||
}
|
||||
|
||||
if (!prevInFlow) {
|
||||
|
|
|
@ -151,6 +151,20 @@ public:
|
|||
return info;
|
||||
}
|
||||
|
||||
typedef nsTHashtable<nsStringHashKey> ImplicitNamedAreas;
|
||||
NS_DECLARE_FRAME_PROPERTY_DELETABLE(ImplicitNamedAreasProperty,
|
||||
ImplicitNamedAreas)
|
||||
ImplicitNamedAreas* GetImplicitNamedAreas() const {
|
||||
return Properties().Get(ImplicitNamedAreasProperty());
|
||||
}
|
||||
|
||||
typedef nsTArray<mozilla::css::GridNamedArea> ExplicitNamedAreas;
|
||||
NS_DECLARE_FRAME_PROPERTY_DELETABLE(ExplicitNamedAreasProperty,
|
||||
ExplicitNamedAreas)
|
||||
ExplicitNamedAreas* GetExplicitNamedAreas() const {
|
||||
return Properties().Get(ExplicitNamedAreasProperty());
|
||||
}
|
||||
|
||||
/**
|
||||
* Return a containing grid frame, and ensure it has computed grid info
|
||||
* @return nullptr if aFrame has no grid container, or frame was destroyed
|
||||
|
@ -195,14 +209,8 @@ protected:
|
|||
* grid-template-columns / grid-template-rows are stored in this frame
|
||||
* property when needed, as a ImplicitNamedAreas* value.
|
||||
*/
|
||||
typedef nsTHashtable<nsStringHashKey> ImplicitNamedAreas;
|
||||
NS_DECLARE_FRAME_PROPERTY_DELETABLE(ImplicitNamedAreasProperty,
|
||||
ImplicitNamedAreas)
|
||||
void InitImplicitNamedAreas(const nsStylePosition* aStyle);
|
||||
void AddImplicitNamedAreas(const nsTArray<nsTArray<nsString>>& aLineNameLists);
|
||||
ImplicitNamedAreas* GetImplicitNamedAreas() const {
|
||||
return Properties().Get(ImplicitNamedAreasProperty());
|
||||
}
|
||||
|
||||
/**
|
||||
* Reflow and place our children.
|
||||
|
|
Загрузка…
Ссылка в новой задаче