Svelte component, to help test "slot" content

[1] SlotWrapper.svelte

<script lang="ts">
  // ======
  // Props.
  // ======

  const { Component, slot, ...otherProps } = $$props;
</script>

<!--
=======
Render.
=======
-->

<Component {...otherProps}>
  {slot}
</Component>

[2] MyButton.svelte

<script lang="ts">
  // ======
  // Props.
  // ======

  export let handleClick: () => void;
</script>

<style>
  /* Etc. */
</style>

<!--
=======
Render.
=======
-->

<button class="my-button" type="button" on:click={handleClick}>
  <slot />
</button>

[3] MyButton.test.ts

import { fireEvent, render } from '@testing-library/svelte';

// Mocks.
import { SlotWrapper } from '../__mocks__';

// Test subject.
import MyButton from './MyButton.svelte';

// ====================
// Describe `fileName`.
// ====================

describe('MyButton.svelte', (): void => {
  // ======================
  // Test default scenario.
  // ======================

  test('handles default scenario', (): void => {
    // Dummy props.
    const props = {
      Component: MyButton,
      slot: 'EXAMPLE_SLOT_CONTENT',
      handleClick: jest.fn(),
    };

    // Render.
    render(SlotWrapper, { props });

    // Get elements.
    const parent = document.querySelector('.my-button');

    // Test assertions.
    expect(parent.textContent).toBe(props.slot);

    // Fire events.
    fireEvent.click(parent);

    // Test assertions.
    expect(props.handleClick).toBeCalled();
  });
});