Layout wrong with measured nodes, max-width percentage and absolute position #727

New Issue

2018-03-09T11:35:42-08:00

nornagon commented

2018-03-09 11:35:42 -08:00

(Migrated from github.com)

Report

Wrapping text with position: absolute and max-width: 90% computes a parent size smaller than that of its contained content.

I have searched existing issues and this is not a duplicate

Issues and Steps to Reproduce

The following layout exhibits the issue:

<div style="width: 85px">
  <div style="position: absolute; max-width: 90%">
    [some text with a wrap point at x=68]
  </div>
</div>

It results in the following layout being produced by Yoga:

<div layout="width: 80; height: 0; top: 0; left: 0;" style="width: 80px; " >
  <div layout="width: 61; height: 16; top: 0; left: 0;" style="max-width: 90%; position: absolute; " >
    <div layout="width: 62; height: 32; top: 0; left: 0;" style="" has-custom-measure="true"></div>
  </div>
</div>

Note that the text node (with has-custom-measure) has a greater height than its parent, which seems incorrect to me.

Link to Code

This test fails, but I think it ought to succeed:

static YGSize _simulate_wrapping_text(YGNodeRef node,
                                      float width,
                                      YGMeasureMode widthMode,
                                      float height,
                                      YGMeasureMode heightMode) {
  if (widthMode == YGMeasureModeUndefined || width >= 68) {
    return YGSize{.width = 68, .height = 16};
  }

  return YGSize{
      .width = 50, .height = 32,
  };
}

TEST(YogaTest, measure_wrap_in_percent) {
  const YGNodeRef root = YGNodeNew();
  YGNodeStyleSetWidth(root, 80);

  const YGNodeRef root_child0 = YGNodeNew();
  YGNodeStyleSetMaxWidthPercent(root_child0, 90);
  YGNodeStyleSetPositionType(root_child0, YGPositionTypeAbsolute);
  YGNodeInsertChild(root, root_child0, 0);

  const YGNodeRef root_child0_child0 = YGNodeNew();
  //  YGNodeSetMeasureFunc(root_child0, _simulate_wrapping_text);
  root_child0_child0->setMeasureFunc(_simulate_wrapping_text);
  YGNodeInsertChild(root_child0, root_child0_child0, 0);

  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

  ASSERT_FLOAT_EQ(32, YGNodeLayoutGetHeight(root_child0_child0));
  ASSERT_FLOAT_EQ(32, YGNodeLayoutGetHeight(root_child0));

  YGNodeFreeRecursive(root);
}

# Report Wrapping text with `position: absolute` and `max-width: 90%` computes a parent size smaller than that of its contained content. - [x] I have searched [existing issues](https://github.com/facebook/yoga/issues) and this is not a duplicate # Issues and Steps to Reproduce The following layout exhibits the issue: ```html <div style="width: 85px"> <div style="position: absolute; max-width: 90%"> [some text with a wrap point at x=68] </div> </div> ``` It results in the following layout being produced by Yoga: ```html <div layout="width: 80; height: 0; top: 0; left: 0;" style="width: 80px; " > <div layout="width: 61; height: 16; top: 0; left: 0;" style="max-width: 90%; position: absolute; " > <div layout="width: 62; height: 32; top: 0; left: 0;" style="" has-custom-measure="true"></div> </div> </div> ``` Note that the text node (with `has-custom-measure`) has a greater height than its parent, which seems incorrect to me. # Link to Code This test fails, but I think it ought to succeed: ```cpp static YGSize _simulate_wrapping_text(YGNodeRef node, float width, YGMeasureMode widthMode, float height, YGMeasureMode heightMode) { if (widthMode == YGMeasureModeUndefined || width >= 68) { return YGSize{.width = 68, .height = 16}; } return YGSize{ .width = 50, .height = 32, }; } TEST(YogaTest, measure_wrap_in_percent) { const YGNodeRef root = YGNodeNew(); YGNodeStyleSetWidth(root, 80); const YGNodeRef root_child0 = YGNodeNew(); YGNodeStyleSetMaxWidthPercent(root_child0, 90); YGNodeStyleSetPositionType(root_child0, YGPositionTypeAbsolute); YGNodeInsertChild(root, root_child0, 0); const YGNodeRef root_child0_child0 = YGNodeNew(); // YGNodeSetMeasureFunc(root_child0, _simulate_wrapping_text); root_child0_child0->setMeasureFunc(_simulate_wrapping_text); YGNodeInsertChild(root_child0, root_child0_child0, 0); YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR); ASSERT_FLOAT_EQ(32, YGNodeLayoutGetHeight(root_child0_child0)); ASSERT_FLOAT_EQ(32, YGNodeLayoutGetHeight(root_child0)); YGNodeFreeRecursive(root); } ```

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: DaddyFrosty/yoga#727