@@ -111,8 +111,57 @@ assert-property: ("#source-sidebar details:first-of-type", {"open": "true"})
111111click: "#source-sidebar details:first-of-type > summary"
112112assert-property: ("#source-sidebar details:first-of-type", {"open": "false"})
113113
114- // Check the spacing.
115- assert-css: ("#source-sidebar > details.dir-entry", {"padding-left": "4px"})
114+ // And open it again, since it'll be the reference we use to check positions.
115+ click: "#source-sidebar details:first-of-type > summary"
116+ assert-property: ("#source-sidebar details:first-of-type", {"open": "true"})
117+
118+ // Check the sidebar directory entries have a marker and spacing (desktop).
119+ store-property: (
120+ link_height,
121+ "#source-sidebar > details:first-of-type.dir-entry[open] > .files > a",
122+ "offsetHeight"
123+ )
124+ define-function: (
125+ "check-sidebar-dir-entry",
126+ (x, y),
127+ [
128+ ("assert", "details:first-of-type.dir-entry[open] > summary::marker"),
129+ ("assert-css", ("#source-sidebar > details:first-of-type.dir-entry", {"padding-left": "4px"})),
130+ // This check ensures that the summary is only one line.
131+ ("assert-property", (
132+ "#source-sidebar > details:first-of-type.dir-entry[open] > summary",
133+ {"offsetHeight": |link_height|}
134+ )),
135+ ("assert-position", (
136+ "#source-sidebar > details:first-of-type.dir-entry[open] > summary",
137+ {"x": |x|, "y": |y|}
138+ )),
139+ ("assert-property", (
140+ "#source-sidebar > details:first-of-type.dir-entry[open] > .files > a",
141+ {"offsetHeight": |link_height|}
142+ )),
143+ ("assert-position", (
144+ "#source-sidebar > details:first-of-type.dir-entry[open] > .files > a",
145+ // left margin
146+ {"x": |x| + 27, "y": |y| + |link_height|}
147+ )),
148+ ]
149+ )
150+ store-property: (
151+ source_sidebar_title_height,
152+ "#source-sidebar > .title",
153+ "offsetHeight"
154+ )
155+ store-property: (
156+ source_sidebar_title_y,
157+ "#source-sidebar > .title",
158+ "offsetTop"
159+ )
160+ call-function: ("check-sidebar-dir-entry", {
161+ "x": 0,
162+ // border + margin = 6
163+ "y": |source_sidebar_title_y| + |source_sidebar_title_height| + 6,
164+ })
116165
117166// Check the search form
118167assert-css: ("nav.sub", {"flex-direction": "row"})
@@ -125,13 +174,45 @@ assert-property: ("nav.sub form", {"offsetTop": 28, "offsetHeight": 34})
125174assert-property: ("#main-content", {"offsetTop": 90})
126175// 28 = 90 - 34 - 28
127176
128- // Now do the same check on moderately-sized mobile.
177+ // Now do the same check on moderately-sized, tablet mobile.
129178size: (700, 700)
130179assert-css: ("nav.sub", {"flex-direction": "row"})
131180assert-property: ("nav.sub form", {"offsetTop": 21, "offsetHeight": 34})
132181assert-property: ("#main-content", {"offsetTop": 76})
133182// 21 = 76 - 34 - 21
134183
135- // Tiny mobile gets a different display where the logo is stacked on top.
184+ // Check the sidebar directory entries have a marker and spacing (tablet).
185+ store-property: (
186+ source_sidebar_title_height,
187+ "#source-sidebar > .title",
188+ "offsetHeight"
189+ )
190+ store-property: (
191+ source_sidebar_title_y,
192+ "#source-sidebar > .title",
193+ "offsetTop"
194+ )
195+ call-function: ("check-sidebar-dir-entry", {
196+ "x": 0,
197+ "y": |source_sidebar_title_y| + |source_sidebar_title_height| + 6,
198+ })
199+
200+ // Tiny, phone mobile gets a different display where the logo is stacked on top.
136201size: (450, 700)
137202assert-css: ("nav.sub", {"flex-direction": "column"})
203+
204+ // Check the sidebar directory entries have a marker and spacing (phone).
205+ store-property: (
206+ source_sidebar_title_height,
207+ "#source-sidebar > .title",
208+ "offsetHeight"
209+ )
210+ store-property: (
211+ source_sidebar_title_y,
212+ "#source-sidebar > .title",
213+ "offsetTop"
214+ )
215+ call-function: ("check-sidebar-dir-entry", {
216+ "x": 0,
217+ "y": |source_sidebar_title_y| + |source_sidebar_title_height| + 6,
218+ })
0 commit comments