diff --git a/src/lib/components/dialog/dialog.test.ts b/src/lib/components/dialog/dialog.test.ts
index a658e15..77c42c5 100644
--- a/src/lib/components/dialog/dialog.test.ts
+++ b/src/lib/components/dialog/dialog.test.ts
@@ -5,11 +5,6 @@ import NestedTestComponent from "./_NestedTestComponent.svelte";
 import { suppressConsoleLogs } from "$lib/test-utils/suppress-console-logs";
 import { render } from "@testing-library/svelte";
 import TestRenderer from "$lib/test-utils/TestRenderer.svelte";
-import Button from "$lib/internal/elements/Button.svelte";
-import Div from "$lib/internal/elements/Div.svelte";
-import Form from "$lib/internal/elements/Form.svelte";
-import P from "$lib/internal/elements/P.svelte";
-import Input from "$lib/internal/elements/Input.svelte";
 import {
   assertActiveElement,
   assertDialog,
@@ -62,19 +57,15 @@ describe("Safe guards", () => {
   it(
     "should be possible to render a Dialog without crashing",
     suppressConsoleLogs(async () => {
-      render(TestRenderer, {
-        allProps: [
-          Dialog,
-          { open: false, onClose: console.log },
-          [
-            [Button, {}, "Trigger"],
-            [DialogOverlay],
-            [DialogTitle],
-            [P, {}, "Contents"],
-            [DialogDescription],
-          ],
-        ],
-      });
+      render(svelte`
+        <Dialog open={false} on:close={console.log}>
+          <button>Trigger</button>
+          <DialogOverlay />
+          <DialogTitle />
+          <p>Contents</p>
+          <DialogDescription />
+        </Dialog>
+      `)
 
       assertDialog({ state: DialogState.InvisibleUnmounted });
     })
@@ -221,16 +212,13 @@ describe("Rendering", () => {
 
     it('should be possible to always render the Dialog if we provide it a `static` prop (and disable focus trapping based on `open`)', () => {
       let focusCounter = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Button, {}, "Trigger"],
-          [Dialog, { open: false, onClose: console.log, static: true }, [
-            [P, {}, "Contents"],
-            [TestTabSentinel, { onFocus: focusCounter }]
-          ]],
-        ]
-      })
+      render(svelte`
+        <button>Trigger</button>
+        <Dialog open={false} on:close={console.log} static>
+          <p>Contents</p>
+          <TestTabSentinel onFocus={focusCounter} />
+        </Dialog>
+      `)
 
 
       // Let's verify that the Dialog is already there
@@ -240,14 +228,11 @@ describe("Rendering", () => {
 
     it('should be possible to use a different render strategy for the Dialog', async () => {
       let focusCounter = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [ManagedDialog, { unmount: false, buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-            [Input, { onFocus: focusCounter }],
-          ]],
-        ]
-      })
+      render(svelte`
+          <ManagedDialog unmount={false} buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+            <input on:focus={focusCounter}>
+          </ManagedDialog>
+        `)
 
       assertDialog({ state: DialogState.InvisibleHidden })
       expect(focusCounter).toHaveBeenCalledTimes(0)
@@ -268,17 +253,13 @@ describe("Rendering", () => {
     it(
       'should add a scroll lock to the html tag',
       suppressConsoleLogs(async () => {
-        render(
-          TestRenderer, {
-          allProps: [
-            [ManagedDialog, { buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-              [Input, { id: "a", type: "text" }],
-              [Input, { id: "b", type: "text" }],
-              [Input, { id: "c", type: "text" }],
-            ]],
-          ]
-        })
-
+        render(svelte`
+          <ManagedDialog buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+            <input id="a" type="text">
+            <input id="b" type="text">
+            <input id="c" type="text">
+          </ManagedDialog>
+        `)
 
         // No overflow yet
         expect(document.documentElement.style.overflow).toBe('')
@@ -455,16 +436,13 @@ describe('Keyboard interactions', () => {
     it(
       'should be possible to close the dialog with Escape, when a field is focused',
       suppressConsoleLogs(async () => {
-        render(
-          TestRenderer, {
-          allProps: [
-            [ManagedDialog, { buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-              "Contents",
-              [Input, { id: "name" }],
-              [TestTabSentinel],
-            ]],
-          ]
-        })
+        render(svelte`
+          <ManagedDialog buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+            Contents
+            <input id="name">
+            <TestTabSentinel />
+          </ManagedDialog>
+        `)
 
         assertDialog({ state: DialogState.InvisibleUnmounted })
 
@@ -488,16 +466,13 @@ describe('Keyboard interactions', () => {
     it(
       'should not be possible to close the dialog with Escape, when a field is focused but cancels the event',
       async () => {
-        render(
-          TestRenderer, {
-          allProps: [
-            [ManagedDialog, { buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-              "Contents",
-              [Input, { id: "name", onKeydown: (e: CustomEvent) => { e.preventDefault(); e.stopPropagation(); } }],
-              [TestTabSentinel],
-            ]],
-          ]
-        })
+        render(svelte`
+          <ManagedDialog buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+            Contents
+            <input id="name" on:keydown={(e) => { e.preventDefault(); e.stopPropagation(); } }>
+            <TestTabSentinel />
+          </ManagedDialog>
+        `)
 
         assertDialog({ state: DialogState.InvisibleUnmounted })
 
@@ -551,18 +526,15 @@ describe('Mouse interactions', () => {
   it(
     'should not close the Dialog when clicking on contents of the DialogOverlay',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [ManagedDialog, { buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-            [DialogOverlay, {}, [
-              [Button, {}, "hi"]
-            ]],
-            "Contents",
-            [TestTabSentinel],
-          ]],
-        ]
-      })
+      render(svelte`
+        <ManagedDialog buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+          <DialogOverlay>
+            <button>hi</button>
+          </DialogOverlay>
+          Contents
+          <TestTabSentinel />
+        </ManagedDialog>
+      `)
 
       // Open dialog
       await click(document.getElementById('trigger'))
@@ -611,16 +583,13 @@ describe('Mouse interactions', () => {
   it(
     'should be possible to close the dialog, and keep focus on the focusable element',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Button, {}, "Hello"],
-          [ManagedDialog, { buttonText: "Trigger", buttonProps: { id: "trigger" } }, [
-            "Contents",
-            [TestTabSentinel],
-          ]],
-        ]
-      })
+      render(svelte`
+        <button>Hello</button>
+        <ManagedDialog buttonText="Trigger" buttonProps={{ id: "trigger" }}>
+          Contents
+          <TestTabSentinel />
+        </ManagedDialog>
+      `)
 
       // Open dialog
       await click(getByText('Trigger'))
@@ -643,18 +612,15 @@ describe('Mouse interactions', () => {
     'should stop propagating click events when clicking on the DialogOverlay',
     suppressConsoleLogs(async () => {
       let wrapperFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, { onClick: wrapperFn }, [
-            [ManagedDialog, { initialOpen: true }, [
-              "Contents",
-              [DialogOverlay],
-              [TestTabSentinel],
-            ]],
-          ]]
-        ]
-      })
+      render(svelte`
+        <div on:click={wrapperFn}>
+          <ManagedDialog initialOpen={true}>
+            Contents
+            <DialogOverlay />
+            <TestTabSentinel />
+          </ManagedDialog>
+        </div>
+      `)
 
       // Verify it is open
       assertDialog({ state: DialogState.Visible })
@@ -677,18 +643,15 @@ describe('Mouse interactions', () => {
     'should be possible to submit a form inside a Dialog',
     suppressConsoleLogs(async () => {
       let submitFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [ManagedDialog, { initialOpen: true }, [
-            [Form, { onSubmit: submitFn }, [
-              [Input, { type: "hidden", value: "abc" }],
-              [Button, { type: "submit" }, "Submit"]
-            ]],
-            [TestTabSentinel],
-          ]],
-        ]
-      })
+      render(svelte`
+        <ManagedDialog initialOpen={true}>
+          <form on:submit={submitFn}>
+            <input type="hidden" value="abc">
+            <button type="submit">Submit</button>
+          </form>
+          <TestTabSentinel />
+        </ManagedDialog>
+      `)
 
       // Verify it is open
       assertDialog({ state: DialogState.Visible })
@@ -705,17 +668,14 @@ describe('Mouse interactions', () => {
     'should stop propagating click events when clicking on an element inside the Dialog',
     suppressConsoleLogs(async () => {
       let wrapperFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, { onClick: wrapperFn }, [
-            [ManagedDialog, { initialOpen: true, buttonInside: true, buttonText: "Inside" }, [
-              "Contents",
-              [TestTabSentinel],
-            ]],
-          ]]
-        ]
-      })
+      render(svelte`
+        <div on:click={wrapperFn}>
+          <ManagedDialog initialOpen={true} buttonInside={true} buttonText="Inside">
+            Contents
+            <TestTabSentinel />
+          </ManagedDialog>
+        </div>
+      `)
 
       // Verify it is open
       assertDialog({ state: DialogState.Visible })
diff --git a/src/lib/components/listbox/listbox.test.ts b/src/lib/components/listbox/listbox.test.ts
index e841964..1f38b40 100644
--- a/src/lib/components/listbox/listbox.test.ts
+++ b/src/lib/components/listbox/listbox.test.ts
@@ -44,9 +44,6 @@ import {
 import { Transition } from "../transitions";
 import TransitionDebug from "$lib/components/disclosure/_TransitionDebug.svelte";
 import ManagedListbox from "./_ManagedListbox.svelte";
-import Button from "$lib/internal/elements/Button.svelte";
-import Div from "$lib/internal/elements/Div.svelte";
-import Span from "$lib/internal/elements/Span.svelte";
 import svelte from "svelte-inline-compile";
 import { writable } from "svelte/store";
 
@@ -3476,29 +3473,26 @@ describe('Mouse interactions', () => {
   it(
     'should be possible to click outside of the listbox on another listbox button which should close the current listbox and open the new listbox',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, {}, [
-            [Listbox, { value: undefined, onChange: console.log }, [
-              [ListboxButton, {}, "Trigger"],
-              [ListboxOptions, {}, [
-                [ListboxOption, { value: "a" }, "Option A"],
-                [ListboxOption, { value: "b" }, "Option B"],
-                [ListboxOption, { value: "c" }, "Option C"],
-              ]]
-            ]],
-            [Listbox, { value: undefined, onChange: console.log }, [
-              [ListboxButton, {}, "Trigger"],
-              [ListboxOptions, {}, [
-                [ListboxOption, { value: "a" }, "Option A"],
-                [ListboxOption, { value: "b" }, "Option B"],
-                [ListboxOption, { value: "c" }, "Option C"],
-              ]]
-            ]],
-          ]]
-        ]
-      })
+      render(svelte`
+        <div>
+          <Listbox value={undefined} on:change={console.log}>
+            <ListboxButton>Trigger</ListboxButton>
+            <ListboxOptions>
+              <ListboxOption value="a">Option A</ListboxOption>
+              <ListboxOption value="b">Option B</ListboxOption>
+              <ListboxOption value="c">Option C</ListboxOption>
+            </ListboxOptions>
+          </Listbox>
+          <Listbox value={undefined} on:change={console.log}>
+            <ListboxButton>Trigger</ListboxButton>
+            <ListboxOptions>
+              <ListboxOption value="a">Option A</ListboxOption>
+              <ListboxOption value="b">Option B</ListboxOption>
+              <ListboxOption value="c">Option C</ListboxOption>
+            </ListboxOptions>
+          </Listbox>
+        </div>
+        `)
 
       let [button1, button2] = getListboxButtons()
 
@@ -3557,24 +3551,21 @@ describe('Mouse interactions', () => {
     'should be possible to click outside of the listbox, on an element which is within a focusable element, which closes the listbox',
     suppressConsoleLogs(async () => {
       let focusFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, {}, [
-            [Listbox, { value: undefined, onChange: console.log }, [
-              [ListboxButton, { onFocus: focusFn }, "Trigger"],
-              [ListboxOptions, {}, [
-                [ListboxOption, { value: "a" }, "Option A"],
-                [ListboxOption, { value: "b" }, "Option B"],
-                [ListboxOption, { value: "c" }, "Option C"],
-              ]]
-            ]],
-            [Button, { id: "btn" }, [
-              [Span, {}, "Next"]
-            ]],
-          ]]
-        ]
-      })
+      render(svelte`
+        <div>
+          <Listbox value={undefined} on:change={console.log}>
+            <ListboxButton on:focus={focusFn}>Trigger</ListboxButton>
+            <ListboxOptions>
+              <ListboxOption value="a">Option A</ListboxOption>
+              <ListboxOption value="b">Option B</ListboxOption>
+              <ListboxOption value="c">Option C</ListboxOption>
+            </ListboxOptions>
+          </Listbox>
+          <button id="btn">
+            <span>Next</span>
+          </button>
+        </div>
+        `)
 
       // Click the listbox button
       await click(getListboxButton())
diff --git a/src/lib/components/menu/menu.test.ts b/src/lib/components/menu/menu.test.ts
index 4c0aeb5..04c7d70 100644
--- a/src/lib/components/menu/menu.test.ts
+++ b/src/lib/components/menu/menu.test.ts
@@ -6,10 +6,6 @@ import TestRenderer from "$lib/test-utils/TestRenderer.svelte";
 import { click, focus, Keys, MouseButton, mouseLeave, mouseMove, press, shift, type, word } from "$lib/test-utils/interactions";
 import { Transition, TransitionChild } from "../transitions";
 import TransitionDebug from "$lib/components/disclosure/_TransitionDebug.svelte";
-import Button from "$lib/internal/elements/Button.svelte";
-import Div from "$lib/internal/elements/Div.svelte";
-import Form from "$lib/internal/elements/Form.svelte";
-import Span from "$lib/internal/elements/Span.svelte";
 import svelte from "svelte-inline-compile";
 import { writable } from "svelte/store";
 
@@ -489,36 +485,32 @@ describe('Rendering composition', () => {
   it(
     'should mark all the elements between MenuItems and MenuItem with role none',
     suppressConsoleLogs(async () => {
-      render
-      render(
-        TestRenderer, {
-        allProps: [
-          [Menu, {}, [
-            [MenuButton, {}, "Trigger"],
-            [Div, { class: "outer" }, [
-              [MenuItems, {}, [
-                [Div, { class: "py-1 inner" }, [
-                  [MenuItem, { as: "button" }, "Item A"],
-                  [MenuItem, { as: "button" }, "Item B"],
-                ]],
-                [Div, { class: "py-1 inner" }, [
-                  [MenuItem, { as: "button" }, "Item C"],
-                  [MenuItem, {}, [
-                    [Div, {}, [
-                      [Div, { class: "outer" }, "Item D"]
-                    ]]
-                  ]]
-                ]],
-                [Div, { class: "py-1 inner" }, [
-                  [Form, { class: "inner" }, [
-                    [MenuItem, { as: "button" }, "Item E"]
-                  ]]
-                ]]
-              ]]
-            ]]
-          ]],
-        ]
-      })
+      render(svelte`
+        <Menu>
+          <MenuButton>Trigger</MenuButton>
+          <div class="outer">
+            <MenuItems>
+              <div class="py-1 inner">
+                <MenuItem as="button">Item A</MenuItem>
+                <MenuItem as="button">Item B</MenuItem>
+              </div>
+              <div class="py-1 inner">
+                <MenuItem as="button">Item C</MenuItem>
+                <MenuItem>
+                  <div>
+                    <div class="outer">Item D</div>
+                  </div>
+                </MenuItem>
+              </div>
+              <div class="py-1 inner">
+                <form class="inner">
+                  <MenuItem as="button">Item E</MenuItem>
+                </form>
+              </div>
+            </MenuItems>
+          </div>
+        </Menu>
+      `)
 
       // Open menu
       await click(getMenuButton())
@@ -2960,29 +2952,26 @@ describe('Mouse interactions', () => {
   it(
     'should be possible to click outside of the menu on another menu button which should close the current menu and open the new menu',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, {}, [
-            [Menu, {}, [
-              [MenuButton, {}, "Trigger"],
-              [MenuItems, {}, [
-                [MenuItem, { as: "a" }, "Item A"],
-                [MenuItem, { as: "a" }, "Item B"],
-                [MenuItem, { as: "a" }, "Item C"],
-              ]]
-            ]],
-            [Menu, {}, [
-              [MenuButton, {}, "Trigger"],
-              [MenuItems, {}, [
-                [MenuItem, { as: "a" }, "Item A"],
-                [MenuItem, { as: "a" }, "Item B"],
-                [MenuItem, { as: "a" }, "Item C"],
-              ]]
-            ]],
-          ]]
-        ]
-      })
+      render(svelte`
+        <div>
+          <Menu>
+            <MenuButton>Trigger</MenuButton>
+            <MenuItems>
+              <MenuItem as="a">Item A</MenuItem>
+              <MenuItem as="a">Item B</MenuItem>
+              <MenuItem as="a">Item C</MenuItem>
+            </MenuItems>
+          </Menu>
+          <Menu>
+            <MenuButton>Trigger</MenuButton>
+            <MenuItems>
+              <MenuItem as="a">Item A</MenuItem>
+              <MenuItem as="a">Item B</MenuItem>
+              <MenuItem as="a">Item C</MenuItem>
+            </MenuItems>
+          </Menu>
+        </div>
+      `)
 
       let [button1, button2] = getMenuButtons()
 
@@ -3008,24 +2997,21 @@ describe('Mouse interactions', () => {
     'should be possible to click outside of the menu, on an element which is within a focusable element, which closes the menu',
     suppressConsoleLogs(async () => {
       let focusFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Div, {}, [
-            [Menu, {}, [
-              [MenuButton, { onFocus: focusFn }, "Trigger"],
-              [MenuItems, {}, [
-                [MenuItem, { as: "a" }, "Item A"],
-                [MenuItem, { as: "a" }, "Item B"],
-                [MenuItem, { as: "a" }, "Item C"],
-              ]]
-            ]],
-            [Button, { id: "btn" }, [
-              [Span, {}, "Next"]
-            ]]
-          ]]
-        ]
-      })
+      render(svelte`
+        <div>
+          <Menu>
+            <MenuButton on:focus={focusFn}>Trigger</MenuButton>
+            <MenuItems>
+              <MenuItem as="a">Item A</MenuItem>
+              <MenuItem as="a">Item B</MenuItem>
+              <MenuItem as="a">Item C</MenuItem>
+            </MenuItems>
+          </Menu>
+          <button id="btn">
+            <span>Next</span>
+          </button>
+        </div>
+      `)
 
       // Click the menu button
       await click(getMenuButton())
@@ -3433,21 +3419,18 @@ describe('Mouse interactions', () => {
     suppressConsoleLogs(async () => {
       let clickHandler = jest.fn()
 
-      render(
-        TestRenderer, {
-        allProps: [
-          [Menu, {}, [
-            [MenuButton, {}, "Trigger"],
-            [MenuItems, {}, [
-              [MenuItem, { as: "a", onClick: clickHandler }, "Item A"],
-              [MenuItem, { as: "a", onClick: clickHandler, disabled: true }, "Item B"],
-              [MenuItem, { disabled: true }, [
-                [Button, { onClick: clickHandler }, "Item C"],
-              ]]
-            ]]
-          ]],
-        ]
-      })
+      render(svelte`
+        <Menu>
+          <MenuButton>Trigger</MenuButton>
+          <MenuItems>
+            <MenuItem as="a" on:click={clickHandler}>Item A</MenuItem>
+            <MenuItem as="a" on:click={clickHandler} disabled>Item B</MenuItem>
+            <MenuItem disabled>
+              <button on:click={clickHandler}>Item C</button>
+            </MenuItem>
+          </MenuItems>
+        </Menu>
+      `)
 
       // Open menu
       await click(getMenuButton())
diff --git a/src/lib/components/popover/popover.test.ts b/src/lib/components/popover/popover.test.ts
index 38f9b78..f140619 100644
--- a/src/lib/components/popover/popover.test.ts
+++ b/src/lib/components/popover/popover.test.ts
@@ -5,8 +5,6 @@ import TestRenderer from "$lib/test-utils/TestRenderer.svelte";
 import { Popover, PopoverButton, PopoverGroup, PopoverOverlay, PopoverPanel } from ".";
 import { click, Keys, MouseButton, press, shift } from "$lib/test-utils/interactions";
 import A from "$lib/internal/elements/A.svelte";
-import Button from "$lib/internal/elements/Button.svelte";
-import Span from "$lib/internal/elements/Span.svelte";
 import { Transition, TransitionChild } from "$lib/components/transitions";
 import TransitionDebug from "$lib/components/disclosure/_TransitionDebug.svelte";
 import Portal from "$lib/components/portal/Portal.svelte";
@@ -1972,16 +1970,13 @@ describe('Mouse interactions', () => {
   it(
     'should be possible to close the popover, and re-focus the button when we click outside on a non-focusable element',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, {}, "Trigger"],
-            [PopoverPanel, {}, "Contents"]
-          ]],
-          [Span, {}, "I am just text"],
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton>Trigger</PopoverButton>
+          <PopoverPanel>Contents</PopoverPanel>
+        </Popover>
+        <span>I am just text</span>
+      `)
 
       // Open popover
       await click(getPopoverButton())
@@ -2003,16 +1998,13 @@ describe('Mouse interactions', () => {
   it(
     'should be possible to close the popover, by clicking outside the popover on another focusable element',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, {}, "Trigger"],
-            [PopoverPanel, {}, "Contents"]
-          ]],
-          [Button, {}, "Different button"],
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton>Trigger</PopoverButton>
+          <PopoverPanel>Contents</PopoverPanel>
+        </Popover>
+        <button>Different button</button>
+      `)
 
       // Open popover
       await click(getPopoverButton())
@@ -2035,18 +2027,15 @@ describe('Mouse interactions', () => {
     'should be possible to close the popover, by clicking outside the popover on another element inside a focusable element',
     suppressConsoleLogs(async () => {
       let focusFn = jest.fn()
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, { onFocus: focusFn }, "Trigger"],
-            [PopoverPanel, {}, "Contents"]
-          ]],
-          [Button, { id: "btn" }, [
-            [Span, {}, "Different button"],
-          ]]
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton on:focus={focusFn}>Trigger</PopoverButton>
+          <PopoverPanel>Contents</PopoverPanel>
+        </Popover>
+        <button id="btn">
+          <span>Different button</span>
+        </button>
+      `)
 
       // Open popover
       await click(getPopoverButton())
@@ -2108,17 +2097,14 @@ describe('Mouse interactions', () => {
     suppressConsoleLogs(async () => {
       let clickFn = jest.fn()
 
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, {}, "Open"],
-            [PopoverPanel, { static: true }, [
-              [Button, { onClick: clickFn }, "btn"],
-            ]],
-          ]],
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton>Open</PopoverButton>
+          <PopoverPanel static>
+            <button on:click={clickFn}>btn</button>
+          </PopoverPanel>
+        </Popover>
+      `)
 
       // Open the popover
       await click(getPopoverButton())
@@ -2137,17 +2123,14 @@ describe('Mouse interactions', () => {
   it(
     'should not close the Popover when clicking on a non-focusable element inside a static PopoverPanel',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, {}, "Open"],
-            [PopoverPanel, { static: true }, [
-              [Span, {}, "element"],
-            ]],
-          ]],
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton>Open</PopoverButton>
+          <PopoverPanel static>
+            <span>element</span>
+          </PopoverPanel>
+        </Popover>
+      `)
 
       // Open the popover
       await click(getPopoverButton())
@@ -2163,17 +2146,14 @@ describe('Mouse interactions', () => {
   it(
     'should close the Popover when clicking outside of a static PopoverPanel',
     suppressConsoleLogs(async () => {
-      render(
-        TestRenderer, {
-        allProps: [
-          [Popover, {}, [
-            [PopoverButton, {}, "Open"],
-            [PopoverPanel, { static: true }, [
-              [Span, {}, "element"],
-            ]],
-          ]],
-        ]
-      })
+      render(svelte`
+        <Popover>
+          <PopoverButton>Open</PopoverButton>
+          <PopoverPanel static>
+            <span>element</span>
+          </PopoverPanel>
+        </Popover>
+      `)
 
       // Open the popover
       await click(getPopoverButton())
diff --git a/src/lib/components/switch/switch.test.ts b/src/lib/components/switch/switch.test.ts
index b29c05e..8d8f7a5 100644
--- a/src/lib/components/switch/switch.test.ts
+++ b/src/lib/components/switch/switch.test.ts
@@ -8,9 +8,6 @@ import {
   getSwitchLabel,
   SwitchState,
 } from "$lib/test-utils/accessibility-assertions";
-import Button from "$lib/internal/elements/Button.svelte";
-import Div from "$lib/internal/elements/Div.svelte";
-import Span from "$lib/internal/elements/Span.svelte";
 import ManagedSwitch from "./_ManagedSwitch.svelte";
 import { click, Keys, press } from "$lib/test-utils/interactions";
 import svelte from "svelte-inline-compile";
@@ -60,13 +57,11 @@ describe("Rendering", () => {
   });
 
   it("should be possible to use the switch contents as the label", () => {
-    render(TestRenderer, {
-      allProps: [
-        Switch,
-        { checked: false, onChange: console.log },
-        [Span, {}, "Enable notifications"],
-      ],
-    });
+    render(svelte`
+      <Switch checked={false} on:change={console.log}>
+        <span>Enable notifications</span>
+      </Switch>
+    `)
     assertSwitch({ state: SwitchState.Off, label: "Enable notifications" });
   });
 
@@ -269,16 +264,12 @@ describe("Keyboard interactions", () => {
 
   describe("`Tab` key", () => {
     it("should be possible to tab away from the Switch", async () => {
-      render(TestRenderer, {
-        allProps: [
-          Div,
-          {},
-          [
-            [Switch, { checked: false, onChange: console.log }],
-            [Button, { id: "btn" }, "Other element"],
-          ],
-        ],
-      });
+      render(svelte`
+        <div>
+          <Switch checked={false} on:change={console.log} />
+          <button id="btn">Other element</button>
+        </div>
+      `)
 
       // Ensure checkbox is off
       assertSwitch({ state: SwitchState.Off });