diff --git a/src/ui/components/tile-grid/TileStack.tsx b/src/ui/components/tile-grid/TileStack.tsx index cae0eadbf..b4a3b0df7 100644 --- a/src/ui/components/tile-grid/TileStack.tsx +++ b/src/ui/components/tile-grid/TileStack.tsx @@ -21,7 +21,7 @@ export function TileStack({ {Children.toArray(children).map((section, index) => (
{section}
diff --git a/src/ui/tests/components/tile-grid/TileWall.test.tsx b/src/ui/tests/components/tile-grid/TileWall.test.tsx index 44af98eea..e7c76634b 100644 --- a/src/ui/tests/components/tile-grid/TileWall.test.tsx +++ b/src/ui/tests/components/tile-grid/TileWall.test.tsx @@ -113,6 +113,19 @@ describe("TileStack", () => { expect(screen.getByText("first").parentElement).toHaveClass("border-b"); expect(screen.getByText("second").parentElement).toHaveClass("border-b"); }); + + it("hides a section whose child renders nothing, like a closed editor", () => { + const Closed = () => null; + const { container } = render( + + first + + , + ); + const sections = container.querySelectorAll(".border-b"); + expect(sections[sections.length - 1]).toHaveClass("empty:hidden"); + expect(sections[sections.length - 1]).toBeEmptyDOMElement(); + }); }); describe("cards outside a tile layout", () => {