git.iko.soy/typeable/elm-ui
on master help sign in
expand width and height testing to be informed by what the element is that's being tested
commit5f880a79811185c680a8904a6be7b9a82e22b0ae authorElm UI Automation <automation@elm-ui.com> dateWed 6 May 2020, 23:19 (6 years ago) parent4ea86ab
4 files changed+334−142
tests-rendering/cases/open/WeirdCentering.elm+13−3 tests-rendering/src/Testable.elm+94−46 tests-rendering/src/Testable/Element.elm+204−80 tests-rendering/src/Testable/Runner.elm+23−13
tests-rendering/cases/open/WeirdCentering.elm+13−3
@@ -7,13 +7,23 @@ import Testable.Element.Background as Background
77
88main =
99 layout [] <|
10+ -- row [] [ el [] (text "Example with centerX:") ]
1011 column []
1112 [ text "Example with centerX:"
1213 , row
1314 [ width fill ]
14− [ row [ centerX, Background.color <| rgb 0 1 0 ]
15− [ paragraph [ width shrink ] [ text "Hello world" ]
16− , paragraph [ width shrink ] [ text "Hello world" ]
15+ [ row
16+ [ centerX
17+ , Background.color <| rgb 0 1 0
18+ ]
19+ [ paragraph
20+ [ width shrink
21+ ]
22+ [ text "Hello world" ]
23+ , paragraph
24+ [ width shrink
25+ ]
26+ [ text "Hello world" ]
1727 ]
1828 ]
1929 , text "Example without centerX:"
tests-rendering/src/Testable.elm+94−46
@@ -3,6 +3,7 @@ module Testable exposing
33 , AttributeId(..)
44 , BoundingBox
55 , Element(..)
6+ , ElementType(..)
67 , Found
78 , LayoutContext(..)
89 , LayoutExpectation(..)
@@ -10,13 +11,16 @@ module Testable exposing
1011 , Location(..)
1112 , Style
1213 , Surroundings
14+ , TextMetrics
1315 , compareFormattedColor
16+ , elementTypeToString
1417 , equal
1518 , formatColor
1619 , formatColorWithAlpha
1720 , getIds
1821 , getSpacing
1922 , runTests
23+ , textHeight
2024 , toElement
2125 , toHtml
2226 , todo
@@ -43,6 +47,66 @@ type Element msg
4347 | Empty
4448
4549
50+type ElementType
51+ = ElType
52+ | RowType
53+ | ColumnType
54+ | TextColumnType
55+ | ParagraphType
56+ | TextType
57+ | EmptyType
58+
59+
60+elementTypeToString : ElementType -> String
61+elementTypeToString elem =
62+ case elem of
63+ ElType ->
64+ "El"
65+
66+ RowType ->
67+ "Row"
68+
69+ ColumnType ->
70+ "Column"
71+
72+ TextColumnType ->
73+ "TextColumn"
74+
75+ ParagraphType ->
76+ "Paragraph"
77+
78+ TextType ->
79+ "Text"
80+
81+ EmptyType ->
82+ "Empty"
83+
84+
85+toElementType : Element msg -> ElementType
86+toElementType elem =
87+ case elem of
88+ El _ _ ->
89+ ElType
90+
91+ Row _ _ ->
92+ RowType
93+
94+ Column _ _ ->
95+ ColumnType
96+
97+ TextColumn _ _ ->
98+ TextColumnType
99+
100+ Paragraph _ _ ->
101+ ParagraphType
102+
103+ Text _ ->
104+ TextType
105+
106+ Empty ->
107+ EmptyType
108+
109+
46110{-| We have an attribute id in order to remove tests when an overriding attribtue is assigned.
47111
48112Basically, we want to implictly test for height/width shrink.
@@ -61,7 +125,7 @@ type AttributeId
61125type Attr msg
62126 = Attr (Element.Attribute msg)
63127 | AttrTest
64− { test : Surroundings -> List LayoutExpectation
128+ { test : Surroundings msg -> List LayoutExpectation
65129 , label : String
66130 , id : AttributeId
67131 }
@@ -70,11 +134,11 @@ type Attr msg
70134 | Nearby
71135 { location : Location
72136 , element : Element msg
73− , test : Surroundings -> List LayoutExpectation
137+ , test : Surroundings msg -> List LayoutExpectation
74138 , label : String
75139 }
76140 | LabeledTest
77− { test : Surroundings -> List LayoutExpectation
141+ { test : Surroundings msg -> List LayoutExpectation
78142 , label : String
79143 , attr : Element.Attribute msg
80144 , id : AttributeId
@@ -97,14 +161,15 @@ type LayoutContext
97161 | InColumn
98162
99163
100−type alias Surroundings =
164+type alias Surroundings msg =
101165 { siblings : List Found
102166 , parent : Found
103167 , children : List Found
104168 , self : Found
169+ , selfElement : Element msg
105170
106171 -- These values are needed to perform some types of tests.
107− , location : LayoutContext
172+ , parentLayout : LayoutContext
108173 , parentSpacing : Int
109174 }
110175
@@ -113,9 +178,24 @@ type alias Found =
113178 { bbox : BoundingBox
114179 , style : Style
115180 , isVisible : Bool
181+ , textMetrics : List TextMetrics
182+ }
183+
184+
185+type alias TextMetrics =
186+ { actualBoundingBoxAscent : Float
187+ , actualBoundingBoxDescent : Float
188+ , actualBoundingBoxLeft : Float
189+ , actualBoundingBoxRight : Float
190+ , width : Float
116191 }
117192
118193
194+textHeight metrics =
195+ metrics.actualBoundingBoxAscent
196+ + metrics.actualBoundingBoxDescent
197+
198+
119199{-| -}
120200type alias Style =
121201 Dict String String
@@ -147,6 +227,7 @@ type LayoutExpectation
147227
148228type alias LayoutTest =
149229 { elementDomId : String
230+ , elementType : ElementType
150231 , label : String
151232 , expectations : List LayoutExpectation
152233 }
@@ -351,6 +432,7 @@ runTests harvested el =
351432 case maybeFound of
352433 Nothing ->
353434 [ { elementDomId = "se-0"
435+ , elementType = EmptyType
354436 , label = "Finding root element"
355437 , expectations =
356438 [ Expect
@@ -548,8 +630,9 @@ createTest { siblings, parent, cache, level, element, location, parentSpacing }
548630 { siblings = siblings
549631 , parent = parent
550632 , self = self
633+ , selfElement = element
551634 , children = childrenFoundData
552− , location = location
635+ , parentLayout = location
553636 , parentSpacing = parentSpacing
554637 }
555638 attr
@@ -570,6 +653,7 @@ createTest { siblings, parent, cache, level, element, location, parentSpacing }
570653
571654 _ ->
572655 [ { elementDomId = id
656+ , elementType = EmptyType
573657 , label = "Finding element in DOM"
574658 , expectations =
575659 [ Expect
@@ -609,7 +693,7 @@ createAttributeTest :
609693 -> Dict String Found
610694 -> List Int
611695 -> Int
612− -> Surroundings
696+ -> Surroundings msg
613697 -> Attr msg
614698 -> List LayoutTest
615699createAttributeTest parent cache level attrIndex surroundings attr =
@@ -626,6 +710,8 @@ createAttributeTest parent cache level attrIndex surroundings attr =
626710
627711 AttrTest details ->
628712 [ { elementDomId = domId
713+ , elementType =
714+ toElementType surroundings.selfElement
629715 , label = details.label
630716 , expectations = details.test surroundings
631717 }
@@ -658,6 +744,7 @@ createAttributeTest parent cache level attrIndex surroundings attr =
658744
659745 LabeledTest { label, test } ->
660746 [ { elementDomId = domId
747+ , elementType = toElementType surroundings.selfElement
661748 , label = label
662749 , expectations = test surroundings
663750 }
@@ -689,45 +776,6 @@ addAttribute attr el =
689776 Text str
690777
691778
692−
693−-- runTests :
694−-- Random.Seed
695−-- -> Test
696−-- ->
697−-- List
698−-- ( String
699−-- , Maybe
700−-- { given : Maybe String
701−-- , description : String
702−-- , reason : Test.Runner.Failure.Reason
703−-- }
704−-- )
705−-- runTests seed tests =
706−-- let
707−-- run runner =
708−-- let
709−-- ran =
710−-- List.map Test.Runner.getFailureReason (runner.run ())
711−-- in
712−-- List.map2 Tuple.pair runner.labels ran
713−-- results =
714−-- case Test.Runner.fromTest 100 seed tests of
715−-- Test.Runner.Plain rnrs ->
716−-- List.map run rnrs
717−-- Test.Runner.Only rnrs ->
718−-- List.map run rnrs
719−-- Test.Runner.Skipping rnrs ->
720−-- List.map run rnrs
721−-- Test.Runner.Invalid invalid ->
722−-- let
723−-- _ =
724−-- Debug.log "Invalid tests" invalid
725−-- in
726−-- []
727−-- in
728−-- List.concat results
729−
730−
731779compareFormattedColor : Color -> String -> Bool
732780compareFormattedColor color expected =
733781 formatColor color == expected || formatColorWithAlpha color == expected
tests-rendering/src/Testable/Element.elm+204−80
@@ -96,8 +96,8 @@ none =
9696
9797
9898paragraph : List (Testable.Attr msg) -> List (Testable.Element msg) -> Testable.Element msg
99−paragraph =
100− Testable.Paragraph
99+paragraph attrs =
100+ Testable.Paragraph (implicitWidthHeightShrink attrs)
101101
102102
103103textColumn : List (Testable.Attr msg) -> List (Testable.Element msg) -> Testable.Element msg
@@ -366,7 +366,7 @@ widthHelper maybeMin maybeMax len =
366366 )
367367 , test =
368368 \context ->
369− if List.member context.location [ Testable.IsNearby Testable.OnRight, Testable.IsNearby Testable.OnLeft ] then
369+ if List.member context.parentLayout [ Testable.IsNearby Testable.OnRight, Testable.IsNearby Testable.OnLeft ] then
370370 [ Testable.true "width fill doesn't apply to onright/onleft elements" True ]
371371
372372 else
@@ -374,7 +374,7 @@ widthHelper maybeMin maybeMax len =
374374 parentAvailableWidth =
375375 context.parent.bbox.width - (context.self.bbox.padding.left + context.self.bbox.padding.right)
376376 in
377− [ case context.location of
377+ [ case context.parentLayout of
378378 Testable.IsNearby _ ->
379379 Testable.true "Nearby Element has fill width"
380380 ((floor context.parent.bbox.width == floor context.self.bbox.width)
@@ -415,36 +415,110 @@ widthHelper maybeMin maybeMax len =
415415 , id = Testable.IsWidth
416416 , test =
417417 \context ->
418− let
419− childWidth child =
420− -- TODO: add margin values to widths
421− child.bbox.width
422−
423− totalChildren =
424− context.children
425− |> List.map childWidth
426− |> List.sum
427−
428− horizontalPadding =
429− context.self.bbox.padding.left + context.self.bbox.padding.right
430−
431− spacingValue =
432− toFloat context.parentSpacing * (toFloat (List.length context.children) - 1)
433− in
434− if totalChildren == 0 then
435− -- TODO: The issue is that we have a hard time measuring `text` elements
436− -- So if a element has a text child, then it's width isn't going to show up in the system.
437− [ Testable.Todo "Calculate text size for width-shrink calculation"
438− ]
418+ case context.selfElement of
419+ Testable.El _ _ ->
420+ let
421+ childWidth child =
422+ child.bbox.width
423+
424+ totalChildren =
425+ context.children
426+ |> List.map childWidth
427+ |> List.append (List.map .width context.self.textMetrics)
428+ |> List.sum
429+
430+ horizontalPadding =
431+ context.self.bbox.padding.left + context.self.bbox.padding.right
432+ in
433+ [ expectRoundedEquality
434+ { expected = totalChildren + horizontalPadding
435+ , found = context.self.bbox.width
436+ }
437+ ]
438+
439+ Testable.Row _ _ ->
440+ -- width of row is the sum of all children widths
441+ -- both text elements and others.
442+ let
443+ childWidth child =
444+ child.bbox.width
445+
446+ totalChildren =
447+ context.children
448+ |> List.map childWidth
449+ |> List.append (List.map .width context.self.textMetrics)
450+ |> List.sum
451+
452+ horizontalPadding =
453+ context.self.bbox.padding.left + context.self.bbox.padding.right
454+
455+ spacingValue =
456+ toFloat context.parentSpacing * (toFloat (List.length context.children) - 1)
457+ in
458+ [ expectRoundedEquality
459+ { expected = totalChildren + horizontalPadding + spacingValue
460+ , found = context.self.bbox.width
461+ }
462+ ]
463+
464+ Testable.Column _ _ ->
465+ -- The width of the column is the width of the widest child.
466+ let
467+ childWidth child =
468+ child.bbox.width
469+ + context.self.bbox.padding.left
470+ + context.self.bbox.padding.right
471+
472+ textChildren =
473+ List.map
474+ (\txt ->
475+ txt.width
476+ + context.self.bbox.padding.left
477+ + context.self.bbox.padding.right
478+ )
479+ context.self.textMetrics
480+
481+ allChildren =
482+ context.children
483+ |> List.map childWidth
484+ |> List.append textChildren
485+ in
486+ [ expectRoundedEquality
487+ { expected = Maybe.withDefault 0 (List.maximum allChildren)
488+ , found = context.self.bbox.width
489+ }
490+ ]
491+
492+ Testable.TextColumn _ _ ->
493+ []
439494
440− else
441− -- This fails if this element is actually a column
442− -- So we need to capture what this element is in order to do this calculation.
443− [ expectRoundedEquality
444− { expected = totalChildren + horizontalPadding + spacingValue
445− , found = context.self.bbox.width
446− }
447− ]
495+ Testable.Paragraph _ _ ->
496+ -- This should be the size it's text,
497+ -- unless it takes up all available space, in which case it should wrap.
498+ let
499+ childWidth child =
500+ child.bbox.width
501+
502+ totalChildren =
503+ context.children
504+ |> List.map childWidth
505+ |> List.append (List.map .width context.self.textMetrics)
506+ |> List.sum
507+
508+ horizontalPadding =
509+ context.self.bbox.padding.left + context.self.bbox.padding.right
510+ in
511+ [ expectRoundedEquality
512+ { expected = totalChildren + horizontalPadding
513+ , found = context.self.bbox.width
514+ }
515+ ]
516+
517+ Testable.Text _ ->
518+ []
519+
520+ Testable.Empty ->
521+ []
448522 }
449523
450524
@@ -535,7 +609,7 @@ heightHelper maybeMin maybeMax len =
535609 , id = Testable.IsHeight
536610 , test =
537611 \context ->
538− [ if List.member context.location [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
612+ [ if List.member context.parentLayout [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
539613 Testable.true "height fill doesn't apply to above/below elements" True
540614
541615 else
@@ -543,7 +617,7 @@ heightHelper maybeMin maybeMax len =
543617 parentAvailableHeight =
544618 context.parent.bbox.height - (context.self.bbox.padding.top + context.self.bbox.padding.bottom)
545619 in
546− case context.location of
620+ case context.parentLayout of
547621 Testable.IsNearby _ ->
548622 Testable.true "Nearby Element has fill height"
549623 ((floor context.parent.bbox.height == floor context.self.bbox.height)
@@ -584,36 +658,86 @@ heightHelper maybeMin maybeMax len =
584658 , id = Testable.IsHeight
585659 , test =
586660 \context ->
587− let
588− childHeight child =
589− -- TODO: add margin values to heights
590− child.bbox.height
591−
592− totalChildren =
593− context.children
594− |> List.map childHeight
595− |> List.sum
596−
597− verticalPadding =
598− context.self.bbox.padding.top + context.self.bbox.padding.bottom
599−
600− spacingValue =
601− toFloat context.parentSpacing * (toFloat (List.length context.children) - 1)
602− in
603− if totalChildren == 0 then
604− -- TODO: The issue is that we have a hard time measuring `text` elements
605− -- So if a element has a text child, then it's height isn't going to show up in the system.
606− [ Testable.Todo "Calculate expected height shrink"
607− ]
661+ case context.selfElement of
662+ Testable.El _ _ ->
663+ let
664+ childHeight child =
665+ -- TODO: add margin values to heights
666+ child.bbox.height
667+
668+ totalChildren =
669+ context.children
670+ |> List.map childHeight
671+ |> List.append (List.map Testable.textHeight context.self.textMetrics)
672+ |> List.sum
673+
674+ verticalPadding =
675+ context.self.bbox.padding.top + context.self.bbox.padding.bottom
676+
677+ spacingValue =
678+ toFloat context.parentSpacing * (toFloat (List.length context.children) - 1)
679+ in
680+ [ expectRoundedEquality
681+ { expected = totalChildren + verticalPadding + spacingValue
682+ , found = context.self.bbox.height
683+ }
684+ ]
685+
686+ Testable.Row _ _ ->
687+ let
688+ childHeight child =
689+ child.bbox.height
690+
691+ totalChildren =
692+ context.children
693+ |> List.map childHeight
694+ |> List.append (List.map Testable.textHeight context.self.textMetrics)
695+ |> List.maximum
696+ |> Maybe.withDefault 0
697+
698+ verticalPadding =
699+ context.self.bbox.padding.top + context.self.bbox.padding.bottom
700+ in
701+ [ expectRoundedEquality
702+ { expected = totalChildren + verticalPadding
703+ , found = context.self.bbox.height
704+ }
705+ ]
706+
707+ Testable.Column _ _ ->
708+ let
709+ childHeight child =
710+ child.bbox.height
711+
712+ totalChildren =
713+ context.children
714+ |> List.map childHeight
715+ |> List.append (List.map Testable.textHeight context.self.textMetrics)
716+ |> List.sum
717+
718+ verticalPadding =
719+ context.self.bbox.padding.top + context.self.bbox.padding.bottom
720+
721+ spacingValue =
722+ toFloat context.parentSpacing * (toFloat (List.length context.children) - 1)
723+ in
724+ [ expectRoundedEquality
725+ { expected = totalChildren + verticalPadding + spacingValue
726+ , found = context.self.bbox.height
727+ }
728+ ]
729+
730+ Testable.TextColumn _ _ ->
731+ []
608732
609− else
610− -- This fails if this element is actually a column
611− -- So we need to capture what this element is in order to do this calculation.
612− [ expectRoundedEquality
613− { expected = totalChildren + verticalPadding + spacingValue
614− , found = context.self.bbox.height
615− }
616− ]
733+ Testable.Paragraph _ _ ->
734+ []
735+
736+ Testable.Text _ ->
737+ []
738+
739+ Testable.Empty ->
740+ []
617741 }
618742
619743
@@ -716,11 +840,11 @@ alignLeft =
716840 , id = Testable.NoId
717841 , test =
718842 \found ->
719− [ if List.member found.location [ Testable.IsNearby Testable.OnLeft, Testable.IsNearby Testable.OnRight ] then
843+ [ if List.member found.parentLayout [ Testable.IsNearby Testable.OnLeft, Testable.IsNearby Testable.OnRight ] then
720844 Testable.true "alignLeft doesn't apply to elements that are onLeft or onRight" True
721845
722846 else if
723− List.member found.location
847+ List.member found.parentLayout
724848 [ Testable.IsNearby Testable.InFront
725849 , Testable.IsNearby Testable.Behind
726850 , Testable.IsNearby Testable.Above
@@ -739,7 +863,7 @@ alignLeft =
739863 }
740864
741865 else
742− case found.location of
866+ case found.parentLayout of
743867 Testable.InRow ->
744868 let
745869 siblingsOnLeft =
@@ -785,7 +909,7 @@ centerX =
785909 parentCenter =
786910 found.parent.bbox.left + (found.parent.bbox.width / 2)
787911 in
788− if List.member found.location [ Testable.IsNearby Testable.OnRight, Testable.IsNearby Testable.OnLeft ] then
912+ if List.member found.parentLayout [ Testable.IsNearby Testable.OnRight, Testable.IsNearby Testable.OnLeft ] then
789913 [ Testable.true "centerX doesn't apply to elements that are onLeft or onRight" True ]
790914
791915 else if List.length found.siblings == 0 then
@@ -796,7 +920,7 @@ centerX =
796920 ]
797921
798922 else
799− case found.location of
923+ case found.parentLayout of
800924 Testable.InRow ->
801925 let
802926 siblingsOnLeft =
@@ -850,11 +974,11 @@ alignRight =
850974 , id = Testable.NoId
851975 , test =
852976 \found ->
853− if List.member found.location [ Testable.IsNearby Testable.OnLeft, Testable.IsNearby Testable.OnRight ] then
977+ if List.member found.parentLayout [ Testable.IsNearby Testable.OnLeft, Testable.IsNearby Testable.OnRight ] then
854978 [ Testable.true "alignRight doesn't apply to elements that are onLeft or onRight" True ]
855979
856980 else if
857− List.member found.location
981+ List.member found.parentLayout
858982 [ Testable.IsNearby Testable.InFront
859983 , Testable.IsNearby Testable.Behind
860984 , Testable.IsNearby Testable.Above
@@ -875,7 +999,7 @@ alignRight =
875999 ]
8761000
8771001 else
878− case found.location of
1002+ case found.parentLayout of
8791003 Testable.InRow ->
8801004 let
8811005 siblingsOnRight =
@@ -913,11 +1037,11 @@ alignTop =
9131037 , id = Testable.NoId
9141038 , test =
9151039 \found ->
916− if List.member found.location [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
1040+ if List.member found.parentLayout [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
9171041 [ Testable.true "alignTop doesn't apply to elements that are above or below" True ]
9181042
9191043 else if
920− List.member found.location
1044+ List.member found.parentLayout
9211045 [ Testable.IsNearby Testable.InFront
9221046 , Testable.IsNearby Testable.Behind
9231047 , Testable.IsNearby Testable.OnRight
@@ -938,7 +1062,7 @@ alignTop =
9381062 ]
9391063
9401064 else
941− case found.location of
1065+ case found.parentLayout of
9421066 Testable.InColumn ->
9431067 let
9441068 siblingsAbove =
@@ -976,11 +1100,11 @@ alignBottom =
9761100 , id = Testable.NoId
9771101 , test =
9781102 \found ->
979− if List.member found.location [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
1103+ if List.member found.parentLayout [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
9801104 [ Testable.true "alignBottom doesn't apply to elements that are above or below" True ]
9811105
9821106 else if
983− List.member found.location
1107+ List.member found.parentLayout
9841108 [ Testable.IsNearby Testable.InFront
9851109 , Testable.IsNearby Testable.Behind
9861110 , Testable.IsNearby Testable.OnRight
@@ -1001,7 +1125,7 @@ alignBottom =
10011125 ]
10021126
10031127 else
1004− case found.location of
1128+ case found.parentLayout of
10051129 Testable.InColumn ->
10061130 let
10071131 siblingsBelow =
@@ -1058,7 +1182,7 @@ centerY =
10581182 parentCenter =
10591183 found.parent.bbox.top + (found.parent.bbox.height / 2)
10601184 in
1061− if List.member found.location [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
1185+ if List.member found.parentLayout [ Testable.IsNearby Testable.Above, Testable.IsNearby Testable.Below ] then
10621186 [ Testable.true "centerY doesn't apply to elements that are above or below" True ]
10631187
10641188 else if List.length found.siblings == 0 then
@@ -1069,7 +1193,7 @@ centerY =
10691193 ]
10701194
10711195 else
1072− case found.location of
1196+ case found.parentLayout of
10731197 Testable.InColumn ->
10741198 let
10751199 siblingsOnTop =
tests-rendering/src/Testable/Runner.elm+23−13
@@ -138,7 +138,7 @@ type Msg
138138 , bbox : Testable.BoundingBox
139139 , style : List ( String, String )
140140 , isVisible : Bool
141− , textMetrics : List TextMetrics
141+ , textMetrics : List Testable.TextMetrics
142142 }
143143 )
144144
@@ -180,6 +180,7 @@ update msg model =
180180 , { style = Dict.fromList box.style
181181 , bbox = box.bbox
182182 , isVisible = box.isVisible
183+ , textMetrics = box.textMetrics
183184 }
184185 )
185186
@@ -339,11 +340,26 @@ viewResult testable =
339340 [ Element.alignLeft, Element.spacing 16 ]
340341 (testable.results
341342 |> groupBy .elementDomId
342− |> List.map viewLayoutTestGroup
343+ |> List.map (expandDetails >> viewLayoutTestGroup)
343344 )
344345 ]
345346
346347
348+expandDetails group =
349+ case group.members of
350+ [] ->
351+ { id = group.id
352+ , elementType = Testable.EmptyType
353+ , members = group.members
354+ }
355+
356+ top :: _ ->
357+ { id = group.id
358+ , elementType = top.elementType
359+ , members = group.members
360+ }
361+
362+
347363groupBy fn list =
348364 groupWhile (\one two -> fn one == fn two) list
349365 |> List.map
@@ -387,7 +403,10 @@ viewLayoutTestGroup group =
387403 , Events.onMouseLeave (HighlightDomID Nothing)
388404 , Element.htmlAttribute (Html.Attributes.style "user-select" "none")
389405 ]
390− [ Element.el [ Font.color palette.lightGrey ] (Element.text group.id)
406+ [ Element.row [ Element.spacing 16 ]
407+ [ Element.el [] (Element.text (Testable.elementTypeToString group.elementType))
408+ , Element.el [ Font.color palette.lightGrey ] (Element.text group.id)
409+ ]
391410 , Element.column
392411 [ Element.spacing 8
393412 , Element.paddingXY 32 0
@@ -484,17 +503,8 @@ port styles :
484503 , bbox : Testable.BoundingBox
485504 , style : List ( String, String )
486505 , isVisible : Bool
487− , textMetrics : List TextMetrics
506+ , textMetrics : List Testable.TextMetrics
488507 }
489508 -> msg
490509 )
491510 -> Sub msg
492−
493−
494−type alias TextMetrics =
495− { actualBoundingBoxAscent : Float
496− , actualBoundingBoxDescent : Float
497− , actualBoundingBoxLeft : Float
498− , actualBoundingBoxRight : Float
499− , width : Float
500− }