[css-grid] Fix positioned children in RTL

[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html

Committed: https://crrev.com/ee6041d32d93b5fcc4915f8280b6a7e09187650b
Cr-Commit-Position: refs/heads/master@{#384539}

[Manuel Rego, 2016-03-29 15:24:08]

rego@igalia.com changed reviewers:
+ cbiesinger@chromium.org, jfernandez@igalia.com, svillar@igalia.com

[Manuel Rego, 2016-03-29 15:24:09]

This is the 2nd part of: http://crrev.com/1824323002/

The 1st part has already landed: http://crrev.com/1838173002/

[Manuel Rego, 2016-03-29 16:31:20]

On 2016/03/29 15:24:09, Manuel Rego wrote:
> This is the 2nd part of: http://crrev.com/1824323002/
> 
> The 1st part has already landed: http://crrev.com/1838173002/

I've realized that I messed it up and uploaded the expectations file
for the new test I'm adding here in the previous CL:
LayoutTests/fast/css-grid-layout/grid-positioned-items-background-rtl-expected.html

I guess that if this gets reviewed and landed quickly it's not a big deal,
otherwise I can do a small CL to remove that -expected file and add it back
here.

[svillar, 2016-04-01 08:55:49]

lgtm.

The values we store in the vectors are starting to make no sense at all, we
should definitely work on that.

BTW change the description, remove the first line completely (the last issue :)
??? are you sure :P). Also join the two sentences in the second paragraph so it
becomes actually a paragraph. And finally you might probably simplify the last
sentence (you don't need to mention that the new tests are passing with this
patch, we take if for granted usually).

https://codereview.chromium.org/1841073002/diff/1/third_party/WebKit/LayoutTe...
File
third_party/WebKit/LayoutTests/fast/css-grid-layout/absolute-positioning-grid-container-containing-block.html
(right):

https://codereview.chromium.org/1841073002/diff/1/third_party/WebKit/LayoutTe...
third_party/WebKit/LayoutTests/fast/css-grid-layout/absolute-positioning-grid-container-containing-block.html:300:
<div class="sizedToGridArea absolute autoRowAutoColumn offsetLeft25 offsetTop75"
Do we need all the sizedToGridArea?

[Manuel Rego, 2016-04-01 09:15:34]

Description was changed from

==========
[css-grid] Fix positioned children in RTL

This patch fixes last issue with positioned items and RTL.

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto").
In this particular case we need to compute the "offset" from the left,
so we need a specific condition and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests,
all of them are now passing with this patch.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html
==========

to

==========
[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html
==========

[Manuel Rego, 2016-04-01 09:17:05]

Thanks for the review.

https://codereview.chromium.org/1841073002/diff/1/third_party/WebKit/LayoutTe...
File
third_party/WebKit/LayoutTests/fast/css-grid-layout/absolute-positioning-grid-container-containing-block.html
(right):

https://codereview.chromium.org/1841073002/diff/1/third_party/WebKit/LayoutTe...
third_party/WebKit/LayoutTests/fast/css-grid-layout/absolute-positioning-grid-container-containing-block.html:300:
<div class="sizedToGridArea absolute autoRowAutoColumn offsetLeft25 offsetTop75"
On 2016/04/01 08:55:49, svillar wrote:
> Do we need all the sizedToGridArea?

Yes we need them to do the "width: 100%; height: 100%;"
which is not done by default in positioned items.

[Manuel Rego, 2016-04-01 09:17:09]

The CQ bit was checked by rego@igalia.com

[commit-bot: I haz the power, 2016-04-01 09:17:29]

CQ is trying da patch. Follow status at
 https://chromium-cq-status.appspot.com/patch-status/1841073002/1
View timeline at
 https://chromium-cq-status.appspot.com/patch-timeline/1841073002/1

[commit-bot: I haz the power, 2016-04-01 10:34:26]

Description was changed from

==========
[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html
==========

to

==========
[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html
==========

[commit-bot: I haz the power, 2016-04-01 10:34:27]

Committed patchset #1 (id:1)

[commit-bot: I haz the power, 2016-04-01 10:35:33]

Description was changed from

==========
[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html
==========

to

==========
[css-grid] Fix positioned children in RTL

The problem is only affecting the items without
a static inline position (i.e. "left" and/or "right" properties
are not "auto"). In this particular case we need to compute
the "offset" from the left, so we need a specific condition
and computation.

Let's use an example to understand what it's fixing:
<div style="display: grid; grid-template-columns: 100px 50px; width: 300px;
            position: relative; direction: rtl;">
    <div style="position: absolute; left: 0; grid-column: 1 / 2;">item</div>
</div>

In this case the item has to be placed in the first column
(the one on the right as we're in RTL).
For this we need to calculate the offset from the left, which is 200px:
150px (alignment offset) + 50px (offset from line 3 to 2).

Added more RTL cases for the positioned tests.

BUG=568882
TEST=fast/css-grid-layout/grid-positioned-items-background-rtl.html

Committed: https://crrev.com/ee6041d32d93b5fcc4915f8280b6a7e09187650b
Cr-Commit-Position: refs/heads/master@{#384539}
==========

[commit-bot: I haz the power, 2016-04-01 10:35:39]

Patchset 1 (id:??) landed as
https://crrev.com/ee6041d32d93b5fcc4915f8280b6a7e09187650b
Cr-Commit-Position: refs/heads/master@{#384539}