Child nodes with YGNodeStyleSetFlexBasisPercent do not get updated between calls to YGNodeCalculateLayout if parent node's size is changed

[georgegerdin]

Report

• I have searched existing issues and this is not a duplicate

Issues and Steps to Reproduce

Child nodes with YGNodeStyleSetFlexBasisPercent do not get updated between calls to YGNodeCalculateLayout if parent node's size is changed. I changed the percentage_flex_basis C++ test below to reflect this behaviour.

Expected Behavior

I would expect YGNodeStyleSetFlexBasisPercent to reflect any changes in the size of the parent node between YGNodeCalculateLayout calls.

Actual Behavior

YGNodeStyleSetFlexBasisPercent reflects the size the parent node had before the first YGNodeCalculateLayout call. This can be tricked by calling YGNodeStyleSetFlexBasisPercent repeatedly between YGNodeCalculateLayout with dummy values like in the code below.

Link to Code

TEST(YogaTest, percentage_flex_basis) {
  const YGConfigRef config = YGConfigNew();

  const YGNodeRef root = YGNodeNewWithConfig(config);
  YGNodeStyleSetFlexDirection(root, YGFlexDirectionRow);
  YGNodeStyleSetWidth(root, 400); //<----Changed width from 200 in the original test
  YGNodeStyleSetHeight(root, 200);

  const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
  YGNodeStyleSetFlexGrow(root_child0, 1);
  YGNodeStyleSetFlexBasisPercent(root_child0, 50);
  YGNodeInsertChild(root, root_child0, 0);

  const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
  YGNodeStyleSetFlexGrow(root_child1, 1);
  YGNodeStyleSetFlexBasisPercent(root_child1, 25);
  YGNodeInsertChild(root, root_child1, 1);

  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

  YGNodeStyleSetWidth(root, 200); //<-----Changed parent width to 200
  YGNodeStyleSetHeight(root, 200);
  //Uncomment this hack to make the test pass:
  /*YGNodeStyleSetFlexBasisPercent(root_child0, 1);
  YGNodeStyleSetFlexBasisPercent(root_child0, 50);
  YGNodeStyleSetFlexBasisPercent(root_child1, 1);
  YGNodeStyleSetFlexBasisPercent(root_child1, 25);*/

  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root));

  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
  ASSERT_FLOAT_EQ(125, YGNodeLayoutGetWidth(root_child0));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child0));

  ASSERT_FLOAT_EQ(125, YGNodeLayoutGetLeft(root_child1));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
  ASSERT_FLOAT_EQ(75, YGNodeLayoutGetWidth(root_child1));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child1));

  YGNodeCalculateLayout(root, 200, 200, YGDirectionRTL);

  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root));

  ASSERT_FLOAT_EQ(75, YGNodeLayoutGetLeft(root_child0));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
  ASSERT_FLOAT_EQ(125, YGNodeLayoutGetWidth(root_child0));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child0));

  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
  ASSERT_FLOAT_EQ(75, YGNodeLayoutGetWidth(root_child1));
  ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child1));

  YGNodeFreeRecursive(root);

  YGConfigFree(config);
}

When applicable, use this fiddle to post a web repro.

[georgegerdin]

YGConfigSetExperimentalFeatureEnabled(
				config, YGExperimentalFeatureWebFlexBasis, true);

was the solution for this problem.