Commit Graph

13 Commits

Author SHA1 Message Date
Joe Vilches
289b62732b Fix issue with alternating flex direction and percent postions (#1663)
Summary:
X-link: https://github.com/facebook/react-native/pull/44792

Pull Request resolved: https://github.com/facebook/yoga/pull/1663

Fixing https://github.com/facebook/yoga/issues/1658. We had a problem where if a child had a different flex direction than its parent, and it also set a position as a percent, it would look at the wrong axis to evaluate the percent. What was happening was we were passing in the container's mainAxis size and crossAxis size to use to evaluate the position size if it was a percent. However, we matched these sizes with the main/cross axis of the child - which is wrong if the flex direction is different.

I changed it so that the function just takes in ownerWidth and ownerHeight then calls isRow to determine which one to use for the main/cross axis position. This reduces the ambiguity quite a bit imo.

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D58172416

fbshipit-source-id: eafd8069e03493fc56c41a76879d1ad9b7e9236d
2024-06-10 18:25:19 -07:00
Joe Vilches
c93734f579 Fix issue in gentest where border-<edge> would add a border to test (#1496)
Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1496

Gentest code has a problem where we try to apply a border in our test when the web browser is not actually adding one. This happens when we do something like `border-top: 10px`. This will actually set the style of the border to `initial` which is just `none`, so nothing renders. This is causing at least 1 test to pass when it actually fails.

I changed it so we ignore setting this value if the style is one of these values. I then re-ran the gentest code and excluded the now failing test (which gets fixed in my static stack).

Reviewed By: NickGerleman

Differential Revision: D51831754

fbshipit-source-id: a325e4a42b2d7cd6f19efc6cd5a2445574467fb7
2023-12-05 13:30:03 -08:00
Joe Vilches
283e3203f6 Fix issue where absolute children of row-reverse containers would inset on the wrong side (#1446)
Summary:
X-link: https://github.com/facebook/react-native/pull/41293

Pull Request resolved: https://github.com/facebook/yoga/pull/1446

NickGerleman pointed out that my recent changes to fix the slew of row-reverse problems in Yoga actually ended up regressing some parts. Specifically, absolute children of row-reverse containers would have their insets set to the wrong side. So if you set left: 10 it would apply it to the right.

Turns out, in `layoutAbsoluteChild` there were cases where we were applying inlineStart/End values to the flexStart/End edge, which can never be right. So I changed the values to also be flexStart/End as the fix here.

Reviewed By: NickGerleman

Differential Revision: D50945475

fbshipit-source-id: 290de06dcc04e8e644a3a32c127af12fdabb2f75
2023-11-07 11:02:20 -08:00
Joe Vilches
7e91004b90 Remove skips on passing position tests and add errata tests
Summary: Now that the tests are passing let's not skip it anymore. Also adding errata tests to make sure most prod builds are still protected.

Reviewed By: NickGerleman

Differential Revision: D50390993

fbshipit-source-id: cb91a7a377e919eaca24fb25e3d73d3c92eb8931
2023-10-18 17:30:18 -07:00
Joe Vilches
2668e8e70c Fix row-reverse flex direction fixtures
Summary:
These tests were a bit weird for testing something with position. The gentest setup makes it so that the fixtures are wrapped in a absolutely positioned container with height and width bot 0. However, the generated yoga tests do NOT do this and instead have the root node as the fixture itself with no wrapping container.

This causes a problem when testing left/right/top/bottom position insets. Because left/right/top/bottom will position the element relative to its containing block when position is absolute, we will get different values on yoga and chrome even if the implementation is correct: https://developer.mozilla.org/en-US/docs/Web/CSS/right#description

To fix this, we just wrap the fixture in a set size div that is also absolutely positioned.

The file was also formatted.

Reviewed By: NickGerleman

Differential Revision: D50389229

fbshipit-source-id: ecd23939b973225cfb0611dc87f30c262952c5fc
2023-10-18 17:30:18 -07:00
Joe Vilches
2e2c124c28 Revamp tests for row reverse + padding after fix
Summary: no longer skip passing tests + add errata tests

Reviewed By: NickGerleman

Differential Revision: D50282417

fbshipit-source-id: 515600111c1ad7b15e40cfe5a3894e40c241c559
2023-10-17 20:30:16 -07:00
Joe Vilches
b558059b74 Revamp tests for row reverse + border after fix
Summary: this is fixed now so we can turn it on

Reviewed By: NickGerleman

Differential Revision: D50348206

fbshipit-source-id: 61c2a72164c6f0ee91b1b5b576d3f129e8cfbe40
2023-10-17 20:30:16 -07:00
Joe Vilches
3fbd92bc3b No longer skip margin_start and margin_end row reverse tests
Summary: These are fixed now!

Reviewed By: NickGerleman

Differential Revision: D50200030

fbshipit-source-id: ac3e80e33d8c35440e342a10cfd3246161ee9018
2023-10-12 16:22:27 -07:00
Joe Vilches
bac658b4f5 Add row reverse tests for position
Summary: after looking into the issue described in https://github.com/facebook/yoga/issues/1208 it seems to apply to position too, so adding tests to confirm

Reviewed By: NickGerleman

Differential Revision: D50154056

fbshipit-source-id: 64dd04ce3ad765526a547fe60b699b664f251c06
2023-10-11 14:02:39 -07:00
Joe Vilches
799624b9a5 Add row reverse tests for border
Summary: after looking into the issue described in https://github.com/facebook/yoga/issues/1208 it seems to apply to border too, so adding tests to confirm

Reviewed By: NickGerleman

Differential Revision: D50153472

fbshipit-source-id: a50f3e040153086b6a573924b513919dbb94f3c0
2023-10-11 14:02:39 -07:00
Joe Vilches
9d9b1f0874 Add row reverse tests for padding
Summary: after looking into the issue described in https://github.com/facebook/yoga/issues/1208 it seems to apply to padding too, so adding tests to confirm

Reviewed By: NickGerleman

Differential Revision: D50153085

fbshipit-source-id: bad0ef50389a71a45ec3a58d87c1dea0c2b26024
2023-10-11 14:02:39 -07:00
Joe Vilches
e60ae290ea Add fixtures to test proper margins with reverse flex directions
Summary:
Yoga has a known bug where marginStart and marginEnd will swap with row-reverse flex direction. This is not the intended behavior. On Paper this is also an issue with marginLeft and marginRight (at least we think Paper is the culprit, not exactly clear yet).

margin-start (and end) is not actually valid css. The gentest.rb script will just turn this into margin-left, but the cpp generated will properly test marginStart. This seems a bit weird to be since marginStart != marginLeft AFAIK. Things like RTL and LTR modes might make this test not exactly right. But given how many other tests depend on this quirk I think it is fine to add as is - the end result is the same after all. If not, a followup would be to add support for mapping margin-inline-start (valid css) to marginStart.

Anyway, this diff is to add test coverage for this scenario. Next stop is to actually try to fix this problem, which may be a bit harder :P

See https://github.com/facebook/yoga/issues/1208 for more info.

Reviewed By: NickGerleman

Differential Revision: D49744271

fbshipit-source-id: 75b8dd0cc5c53b2f338476fb70b60006aaa89054
2023-10-03 11:31:34 -07:00
Emil Sjolander
6339467b6d Rename tests
Summary: Rename test files to use new name

Reviewed By: gkassabli

Differential Revision: D4265235

fbshipit-source-id: 0090d3949828058baf7435f33d4068de92756bad
2016-12-03 04:53:39 -08:00