Skip to content

GitLab

T
tangled
Commit b681cabb authored by Patrick Brosset's avatar Patrick Brosset Committed by Commit Bot
Browse files
Options

DevTools: Fully support RTL direction in the grid overlay 

The DevTools grid overlay was recently modified to support RTL
direction. The fix included the required changes for lines and gaps to
be drawn correctly (see
https://chromium-review.googlesource.com/c/chromium/src/+/2213530).

However it did not include changes for the labels to appear in the right
places (line numbers, line names, area names, track sizes).

This is what this change is about.
In it, I also updated the web test for RTL grids as the expected label
positions were now wrong.

Bug: 1096971
Change-Id: Ib4ed28462ab3bd5ad746d955da4d56db5f95dcfc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2375687
Commit-Queue: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: default avatarAndrey Kosyakov <caseq@chromium.org>
Cr-Commit-Position: refs/heads/master@{#801730}
parent ab883338
Show whitespace changes
Inline Side-by-side
Showing with 127 additions and 85 deletions
third_party/blink/renderer/core/inspector/inspector_highlight.cc
View file @ b681cabb
......@@ -421,6 +421,35 @@ PhysicalOffset Transpose(PhysicalOffset& offset) {
return PhysicalOffset(offset.top, offset.left);
}
size_t GetTrackCount(const LayoutGrid* layout_grid,
GridTrackSizingDirection direction) {
return direction == kForRows ? layout_grid->RowPositions().size()
: layout_grid->ColumnPositions().size();
}
LayoutUnit GetPositionForTrackAt(const LayoutGrid* layout_grid,
size_t index,
GridTrackSizingDirection direction) {
if (direction == kForRows)
return layout_grid->RowPositions().at(index);
LayoutUnit position = layout_grid->ColumnPositions().at(index);
return layout_grid->StyleRef().IsLeftToRightDirection()
? position
: layout_grid->TranslateRTLCoordinate(position);
}
LayoutUnit GetPositionForFirstTrack(const LayoutGrid* layout_grid,
GridTrackSizingDirection direction) {
return GetPositionForTrackAt(layout_grid, 0, direction);
}
LayoutUnit GetPositionForLastTrack(const LayoutGrid* layout_grid,
GridTrackSizingDirection direction) {
size_t index = GetTrackCount(layout_grid, direction) - 1;
return GetPositionForTrackAt(layout_grid, index, direction);
}
PhysicalOffset LocalToAbsolutePoint(Node* node,
PhysicalOffset local,
float scale) {
......@@ -451,20 +480,26 @@ std::unique_ptr<protocol::ListValue> BuildGridTrackSizes(
const Vector<String>* authored_values) {
LayoutObject* layout_object = node->GetLayoutObject();
LayoutGrid* layout_grid = ToLayoutGrid(layout_object);
bool is_rtl = direction == kForColumns &&
!layout_grid->StyleRef().IsLeftToRightDirection();
std::unique_ptr<protocol::ListValue> sizes = protocol::ListValue::create();
const Vector<LayoutUnit>& positions = direction == kForRows
? layout_grid->RowPositions()
: layout_grid->ColumnPositions();
const Vector<LayoutUnit>& alt_positions = direction == kForRows
? layout_grid->ColumnPositions()
: layout_grid->RowPositions();
LayoutUnit alt_axis_pos = alt_positions.front();
for (unsigned i = 1; i < positions.size(); i++) {
LayoutUnit current_position = positions.at(i);
LayoutUnit prev_position = positions.at(i - 1);
LayoutUnit gap_offset = i < positions.size() - 1 ? gap : LayoutUnit();
size_t track_count = GetTrackCount(layout_grid, direction);
LayoutUnit alt_axis_pos = GetPositionForFirstTrack(
layout_grid, direction == kForRows ? kForColumns : kForRows);
for (size_t i = 1; i < track_count; i++) {
LayoutUnit current_position =
GetPositionForTrackAt(layout_grid, i, direction);
LayoutUnit prev_position =
GetPositionForTrackAt(layout_grid, i - 1, direction);
LayoutUnit gap_offset = i < track_count - 1 ? gap : LayoutUnit();
LayoutUnit width = current_position - prev_position - gap_offset;
if (is_rtl)
width = prev_position - current_position - gap_offset;
LayoutUnit main_axis_pos = prev_position + width / 2;
if (is_rtl)
main_axis_pos = prev_position - width / 2;
auto adjusted_size = AdjustForAbsoluteZoom::AdjustFloat(
width * scale, layout_grid->StyleRef());
PhysicalOffset track_size_pos(main_axis_pos, alt_axis_pos);
......@@ -484,20 +519,20 @@ std::unique_ptr<protocol::ListValue> BuildGridTrackSizes(
std::unique_ptr<protocol::ListValue> BuildGridPositiveLineNumberPositions(
Node* node,
const Vector<LayoutUnit>& track_positions,
const LayoutUnit& grid_gap,
GridTrackSizingDirection direction,
float scale) {
LayoutObject* layout_object = node->GetLayoutObject();
LayoutGrid* layout_grid = ToLayoutGrid(layout_object);
bool is_rtl = direction == kForColumns &&
!layout_grid->StyleRef().IsLeftToRightDirection();
std::unique_ptr<protocol::ListValue> number_positions =
protocol::ListValue::create();
const Vector<LayoutUnit>& alt_positions = direction == kForRows
? layout_grid->ColumnPositions()
: layout_grid->RowPositions();
LayoutUnit alt_axis_pos = alt_positions.front();
size_t track_count = GetTrackCount(layout_grid, direction);
LayoutUnit alt_axis_pos = GetPositionForFirstTrack(
layout_grid, direction == kForRows ? kForColumns : kForRows);
// Find index of the first explicit Grid Line.
size_t first_explicit_index =
......@@ -505,15 +540,17 @@ std::unique_ptr<protocol::ListValue> BuildGridPositiveLineNumberPositions(
// Go line by line, calculating the offset to fall in the middle of gaps
// if needed.
for (size_t i = first_explicit_index; i < track_positions.size(); ++i) {
for (size_t i = first_explicit_index; i < track_count; ++i) {
LayoutUnit gapOffset = grid_gap / 2;
if (is_rtl)
gapOffset *= -1;
// No need for a gap offset if there is no gap, or the first line is
// explicit, or this is the last line.
if (grid_gap == 0 || i == 0 || i == track_positions.size() - 1) {
if (grid_gap == 0 || i == 0 || i == track_count - 1) {
gapOffset = LayoutUnit();
}
PhysicalOffset number_position(track_positions.at(i) - gapOffset,
alt_axis_pos);
LayoutUnit offset = GetPositionForTrackAt(layout_grid, i, direction);
PhysicalOffset number_position(offset - gapOffset, alt_axis_pos);
if (direction == kForRows)
number_position = Transpose(number_position);
number_positions->pushValue(
......@@ -525,27 +562,27 @@ std::unique_ptr<protocol::ListValue> BuildGridPositiveLineNumberPositions(
std::unique_ptr<protocol::ListValue> BuildGridNegativeLineNumberPositions(
Node* node,
const Vector<LayoutUnit>& trackPositions,
const LayoutUnit& grid_gap,
GridTrackSizingDirection direction,
float scale) {
LayoutObject* layout_object = node->GetLayoutObject();
LayoutGrid* layout_grid = ToLayoutGrid(layout_object);
bool is_rtl = direction == kForColumns &&
!layout_grid->StyleRef().IsLeftToRightDirection();
std::unique_ptr<protocol::ListValue> number_positions =
protocol::ListValue::create();
const Vector<LayoutUnit>& alt_positions = direction == kForRows
? layout_grid->ColumnPositions()
: layout_grid->RowPositions();
LayoutUnit alt_axis_pos = alt_positions.back();
size_t track_count = GetTrackCount(layout_grid, direction);
LayoutUnit alt_axis_pos = GetPositionForLastTrack(
layout_grid, direction == kForRows ? kForColumns : kForRows);
// This is the number of tracks from the start of the grid, to the end of the
// explicit grid (including any leading implicit tracks).
size_t explicit_grid_end_track_count =
layout_grid->ExplicitGridEndForDirection(direction);
LayoutUnit first_offset = trackPositions.front();
LayoutUnit first_offset = GetPositionForFirstTrack(layout_grid, direction);
// Always start negative numbers at the first line.
std::unique_ptr<protocol::DictionaryValue> pos =
......@@ -560,12 +597,14 @@ std::unique_ptr<protocol::ListValue> BuildGridNegativeLineNumberPositions(
// if needed.
for (size_t i = 1; i <= explicit_grid_end_track_count; i++) {
LayoutUnit gapOffset = grid_gap / 2;
if (grid_gap == 0 || (i == explicit_grid_end_track_count &&
i == trackPositions.size() - 1)) {
if (is_rtl)
gapOffset *= -1;
if (grid_gap == 0 ||
(i == explicit_grid_end_track_count && i == track_count - 1)) {
gapOffset = LayoutUnit();
}
PhysicalOffset number_position(trackPositions.at(i) - gapOffset,
alt_axis_pos);
LayoutUnit offset = GetPositionForTrackAt(layout_grid, i, direction);
PhysicalOffset number_position(offset - gapOffset, alt_axis_pos);
if (direction == kForRows)
number_position = Transpose(number_position);
number_positions->pushValue(
......@@ -580,6 +619,7 @@ std::unique_ptr<protocol::DictionaryValue> BuildAreaNamePaths(Node* node,
LayoutObject* layout_object = node->GetLayoutObject();
LayoutGrid* layout_grid = ToLayoutGrid(layout_object);
LocalFrameView* containing_view = node->GetDocument().View();
bool is_rtl = !layout_grid->StyleRef().IsLeftToRightDirection();
std::unique_ptr<protocol::DictionaryValue> area_paths =
protocol::DictionaryValue::create();
......@@ -594,10 +634,14 @@ std::unique_ptr<protocol::DictionaryValue> BuildAreaNamePaths(Node* node,
const GridArea& area = item.value;
const String& name = item.key;
LayoutUnit start_column = columns.at(area.columns.StartLine());
LayoutUnit end_column = columns.at(area.columns.EndLine());
LayoutUnit start_row = rows.at(area.rows.StartLine());
LayoutUnit end_row = rows.at(area.rows.EndLine());
LayoutUnit start_column = GetPositionForTrackAt(
layout_grid, area.columns.StartLine(), kForColumns);
LayoutUnit end_column =
GetPositionForTrackAt(layout_grid, area.columns.EndLine(), kForColumns);
LayoutUnit start_row =
GetPositionForTrackAt(layout_grid, area.rows.StartLine(), kForRows);
LayoutUnit end_row =
GetPositionForTrackAt(layout_grid, area.rows.EndLine(), kForRows);
// Only subtract the gap size if the end line isn't the last line in the
// container.
......@@ -606,6 +650,8 @@ std::unique_ptr<protocol::DictionaryValue> BuildAreaNamePaths(Node* node,
LayoutUnit column_gap_offset = area.columns.EndLine() == columns.size() - 1
? LayoutUnit()
: column_gap;
if (is_rtl)
column_gap_offset *= -1;
PhysicalOffset position(start_column, start_row);
PhysicalSize size(end_column - start_column - column_gap_offset,
......@@ -628,6 +674,8 @@ std::unique_ptr<protocol::ListValue> BuildGridLineNames(
float scale) {
LayoutObject* layout_object = node->GetLayoutObject();
LayoutGrid* layout_grid = ToLayoutGrid(layout_object);
bool is_rtl = direction == kForColumns &&
!layout_grid->StyleRef().IsLeftToRightDirection();
std::unique_ptr<protocol::ListValue> lines = protocol::ListValue::create();
......@@ -638,19 +686,19 @@ std::unique_ptr<protocol::ListValue> BuildGridLineNames(
direction == kForColumns ? layout_grid->StyleRef().NamedGridColumnLines()
: layout_grid->StyleRef().NamedGridRowLines();
LayoutUnit gap = layout_grid->GridGap(direction);
const Vector<LayoutUnit>& alt_positions = direction == kForRows
? layout_grid->ColumnPositions()
: layout_grid->RowPositions();
LayoutUnit alt_axis_pos = alt_positions.front();
LayoutUnit alt_axis_pos = GetPositionForFirstTrack(
layout_grid, direction == kForRows ? kForColumns : kForRows);
for (const auto& item : named_lines_map) {
const String& name = item.key;
for (const size_t index : item.value) {
LayoutUnit track = tracks.at(index);
LayoutUnit track = GetPositionForTrackAt(layout_grid, index, direction);
LayoutUnit gap_offset =
index > 0 && index < tracks.size() - 1 ? gap / 2 : LayoutUnit();
if (is_rtl)
gap_offset *= -1;
LayoutUnit main_axis_pos = track - gap_offset;
PhysicalOffset line_name_pos(main_axis_pos, alt_axis_pos);
......@@ -753,13 +801,6 @@ Vector<String> GetAuthoredGridTrackSizes(const CSSValue* value,
return result;
}
LayoutUnit GetColumnPosition(const LayoutGrid* layout_grid, size_t index) {
LayoutUnit position = layout_grid->ColumnPositions().at(index);
return layout_grid->StyleRef().IsLeftToRightDirection()
? position
: layout_grid->TranslateRTLCoordinate(position);
}
std::unique_ptr<protocol::DictionaryValue> BuildGridInfo(
Node* node,
const InspectorGridHighlightConfig& grid_highlight_config,
......@@ -850,8 +891,9 @@ std::unique_ptr<protocol::DictionaryValue> BuildGridInfo(
if (i != columns.size() - 1)
size.width -= column_gap;
LayoutUnit line_left =
is_ltr ? GetColumnPosition(layout_grid, i - 1)
: GetColumnPosition(layout_grid, i - 1) - size.width;
GetPositionForTrackAt(layout_grid, i - 1, kForColumns);
if (!is_ltr)
line_left -= size.width;
PhysicalOffset position(line_left, column_top);
PhysicalRect column(position, size);
FloatQuad column_quad = layout_grid->LocalRectToAbsoluteQuad(column);
......@@ -861,9 +903,9 @@ std::unique_ptr<protocol::DictionaryValue> BuildGridInfo(
ColumnQuadToPath(column_quad, draw_end_line || column_gap > 0), scale);
// Column Gaps
if (i != columns.size() - 1) {
LayoutUnit gap_left = is_ltr
? GetColumnPosition(layout_grid, i) - column_gap
: GetColumnPosition(layout_grid, i);
LayoutUnit gap_left = GetPositionForTrackAt(layout_grid, i, kForColumns);
if (is_ltr)
gap_left -= column_gap;
PhysicalOffset gap_position(gap_left, column_top);
PhysicalSize gap_size(column_gap, column_height);
PhysicalRect gap(gap_position, gap_size);
......@@ -877,22 +919,22 @@ std::unique_ptr<protocol::DictionaryValue> BuildGridInfo(
// Positive Row and column Line positions
if (grid_highlight_config.show_positive_line_numbers) {
grid_info->setValue("positiveRowLineNumberPositions",
BuildGridPositiveLineNumberPositions(
node, rows, row_gap, kForRows, scale));
grid_info->setValue(
"positiveRowLineNumberPositions",
BuildGridPositiveLineNumberPositions(node, row_gap, kForRows, scale));
grid_info->setValue("positiveColumnLineNumberPositions",
BuildGridPositiveLineNumberPositions(
node, columns, column_gap, kForColumns, scale));
node, column_gap, kForColumns, scale));
}
// Negative Row and column Line positions
if (grid_highlight_config.show_negative_line_numbers) {
grid_info->setValue("negativeRowLineNumberPositions",
BuildGridNegativeLineNumberPositions(
node, rows, row_gap, kForRows, scale));
grid_info->setValue(
"negativeRowLineNumberPositions",
BuildGridNegativeLineNumberPositions(node, row_gap, kForRows, scale));
grid_info->setValue("negativeColumnLineNumberPositions",
BuildGridNegativeLineNumberPositions(
node, columns, column_gap, kForColumns, scale));
node, column_gap, kForColumns, scale));
}
// Area names
......
third_party/blink/web_tests/http/tests/devtools/elements/highlight/highlight-css-grid-direction-expected.txt
View file @ b681cabb
......@@ -362,13 +362,13 @@ rtlGrid{
"writingMode": "horizontal-tb",
"columnTrackSizes": [
{
"x": 48,
"x": 98,
"y": 44,
"computedSize": 20,
"authoredSize": "20px"
},
{
"x": 83,
"x": 63,
"y": 44,
"computedSize": 50,
"authoredSize": "50px"
......@@ -376,7 +376,7 @@ rtlGrid{
],
"rowTrackSizes": [
{
"x": 38,
"x": 108,
"y": 94,
"computedSize": 100,
"authoredSize": "100px"
......@@ -434,49 +434,49 @@ rtlGrid{
],
"positiveRowLineNumberPositions": [
{
"x": 38,
"x": 108,
"y": 44
},
{
"x": 38,
"x": 108,
"y": 144
}
],
"positiveColumnLineNumberPositions": [
{
"x": 38,
"x": 108,
"y": 44
},
{
"x": 58,
"x": 88,
"y": 44
},
{
"x": 108,
"x": 38,
"y": 44
}
],
"negativeRowLineNumberPositions": [
{
"x": 108,
"x": 38,
"y": 44
},
{
"x": 108,
"x": 38,
"y": 144
}
],
"negativeColumnLineNumberPositions": [
{
"x": 38,
"x": 108,
"y": 144
},
{
"x": 58,
"x": 88,
"y": 144
},
{
"x": 108,
"x": 38,
"y": 144
}
],
......@@ -888,13 +888,13 @@ rtlGridGap{
"writingMode": "horizontal-tb",
"columnTrackSizes": [
{
"x": 32,
"x": 98,
"y": 44,
"computedSize": 20,
"authoredSize": "20px"
},
{
"x": 83,
"x": 47,
"y": 44,
"computedSize": 50,
"authoredSize": "50px"
......@@ -902,7 +902,7 @@ rtlGridGap{
],
"rowTrackSizes": [
{
"x": 22,
"x": 108,
"y": 94,
"computedSize": 100,
"authoredSize": "100px"
......@@ -966,49 +966,49 @@ rtlGridGap{
],
"positiveRowLineNumberPositions": [
{
"x": 22,
"x": 108,
"y": 44
},
{
"x": 22,
"x": 108,
"y": 144
}
],
"positiveColumnLineNumberPositions": [
{
"x": 22,
"x": 108,
"y": 44
},
{
"x": 50,
"x": 80,
"y": 44
},
{
"x": 108,
"x": 22,
"y": 44
}
],
"negativeRowLineNumberPositions": [
{
"x": 108,
"x": 22,
"y": 44
},
{
"x": 108,
"x": 22,
"y": 144
}
],
"negativeColumnLineNumberPositions": [
{
"x": 22,
"x": 108,
"y": 144
},
{
"x": 50,
"x": 80,
"y": 144
},
{
"x": 108,
"x": 22,
"y": 144
}
],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment