flow layout: compute overflow hull

src/base/fresnel.dom.pas

@@ -1077,8 +1077,7 @@ type
   TFreIntrinsicContentSize = record
     Width: TFresnelLength;
     Height: TFresnelLength;
-    OverflowWidth: TFresnelLength;
-    OverflowHeight: TFresnelLength;
+    Overflow: TFresnelRect;
     NeedGutterHorizontal, NeedGutterVertical: boolean;
     function ToString: string;
     procedure SetSize(const p: TFresnelPoint);
@@ -6629,11 +6628,32 @@ end;
 { TFreIntrinsicContentSize }
 
 function TFreIntrinsicContentSize.ToString: string;
+var
+  HasOverflow: boolean;
+
+  procedure AddOverflow(c: char; Value: TFresnelLength);
+  begin
+    if HasOverflow then
+      Result:=Result+','
+    else begin
+      Result:=Result+' Overflow=';
+      HasOverflow:=true;
+    end;
+    Result:=Result+c+'='+FloatToCSSStr(Value);
+  end;
+
 begin
   Result:='Size='+FloatToCSSStr(Width)
-    +'x'+FloatToCSSStr(Height)
-    +' OverflSize='+FloatToCSSStr(OverflowWidth)
-    +'x'+FloatToCSSStr(OverflowHeight);
+    +'x'+FloatToCSSStr(Height);
+  HasOverflow:=false;
+  if Overflow.Left<0 then
+    AddOverflow('L',Overflow.Left);
+  if Overflow.Top<0 then
+    AddOverflow('T',Overflow.Top);
+  if Overflow.Right<>Width then
+    AddOverflow('R',Overflow.Right);
+  if Overflow.Bottom<>Height then
+    AddOverflow('B',Overflow.Bottom);
   if NeedGutterHorizontal then
     Result+=' NeedGutterHorz';
   if NeedGutterVertical then
@@ -6649,8 +6669,10 @@ procedure TFreIntrinsicContentSize.SetSize(W, H: TFresnelLength);
 begin
   Width:=W;
   Height:=H;
-  OverflowWidth:=W;
-  OverflowHeight:=H;
+  Overflow.Left:=0;
+  Overflow.Top:=0;
+  Overflow.Right:=W;
+  Overflow.Bottom:=H;
   NeedGutterHorizontal:=false;
   NeedGutterVertical:=false;
 end;

tests/base/TCFlowLayout.pas

@@ -25,7 +25,7 @@ type
 
     // scroll
     procedure TestFL_PositionAbsolute_Left_ScrollWidth;
-    procedure TestFL_OverflowSizeNested; // todo
+    procedure TestFL_OverflowSizeNested;
     // todo procedure TestPositionAbsolute_DivTop100Percent;
 
     // todo: test break line aka fragments
@@ -577,13 +577,13 @@ begin
 
   if Div1.LayoutNode.Container<>Body then
     Fail('Div1.LayoutNode.Container<>Body');
-  AssertEquals('Div1.UsedBorderBox.Left',142,Div1.UsedBorderBox.Left);
-  AssertEquals('Div1.UsedBorderBox.Top',2,Div1.UsedBorderBox.Top);
-  AssertEquals('Div1.UsedBorderBox.Width',40,Div1.UsedBorderBox.Width);
-  AssertEquals('Div1.UsedBorderBox.Height',30,Div1.UsedBorderBox.Height);
+  AssertEquals('Div1.UsedBorderBox.Left',142,Div1.UsedBorderBox.Left); // left 140px + margin 2px
+  AssertEquals('Div1.UsedBorderBox.Top',2,Div1.UsedBorderBox.Top); // top 0px + margin 2px
+  AssertEquals('Div1.UsedBorderBox.Width',40,Div1.UsedBorderBox.Width); // width 30px + 2*1px border + 2*4px padding
+  AssertEquals('Div1.UsedBorderBox.Height',30,Div1.UsedBorderBox.Height); // height 20px + 2*1px border + 2*4px padding
 
-  AssertEquals('Body.LayoutNode.ScrollWidth',184,Body.LayoutNode.ScrollWidth);
-  AssertEquals('Body.LayoutNode.ScrollHeight',34,Body.LayoutNode.ScrollHeight);
+  AssertEquals('Body.ScrollWidth',184,Body.ScrollWidth);
+  AssertEquals('Body.ScrollHeight',34,Body.ScrollHeight);
 end;
 
 procedure TTestFlowLayout.TestFL_OverflowSizeNested;
@@ -591,7 +591,6 @@ var
   Div1, Div2, Div3, Div4: TDiv;
 begin
   // test, if overflow size is propagated, except when clipping
-  exit;
 
   Div1:=TDiv.Create(Viewport);
   Div1.Name:='Div1';
@@ -620,7 +619,7 @@ begin
     '  height: 50px;',
     '  overflow: auto;',
     '}',
-    // Div2 fits into Div1, but its content (100x100) does not
+    // Div2 fits into Div1, but its content (120x120) does not
     '#Div2 {',
     '  width: 30px;',
     '  height: 20px;',
@@ -646,8 +645,18 @@ begin
 
   AssertEquals('Div3.UsedBorderBox.Width',116,Div3.UsedBorderBox.Width);
   AssertEquals('Div3.UsedBorderBox.Height',116,Div3.UsedBorderBox.Height);
-  AssertEquals('Div3.ScrollWidth',220,Div3.ScrollWidth);
+  AssertEquals('Div3.ScrollWidth',220,Div3.ScrollWidth); // 220 = Div4 Width of 216 + 2*2px Margin
   AssertEquals('Div3.ScrollHeight',220,Div3.ScrollHeight);
+
+  AssertEquals('Div2.UsedBorderBox.Width',46,Div2.UsedBorderBox.Width);
+  AssertEquals('Div2.UsedBorderBox.Height',36,Div2.UsedBorderBox.Height);
+  AssertEquals('Div2.ScrollWidth',120,Div2.ScrollWidth); // 120 = Div3 Width of 116 + 2*2px Margin
+  AssertEquals('Div2.ScrollHeight',120,Div2.ScrollHeight);
+
+  AssertEquals('Div1.UsedBorderBox.Width',66,Div1.UsedBorderBox.Width);
+  AssertEquals('Div1.UsedBorderBox.Height',66,Div1.UsedBorderBox.Height);
+  AssertEquals('Div1.ScrollWidth',50,Div1.ScrollWidth); // 50 = Div2 Width of 46 + 2*2px Margin
+  AssertEquals('Div1.ScrollHeight',50,Div1.ScrollHeight); // 50 = Max(Div1.Width is 50 , Div2 Height of 36 + 2*2px Margin)
 end;
 
 Initialization