diff --git a/src/ClockFace.tsx b/src/ClockFace.tsx
index eda23b5..895abdd 100644
--- a/src/ClockFace.tsx
+++ b/src/ClockFace.tsx
@@ -2,10 +2,12 @@ import { ClockHands } from '@/ClockHands';
 import { Graduations } from '@/Graduations';
 import { getTestId } from '@/utilities';
 
+export const clockFaceId = 'clock-face';
+
 export const ClockFace = () => (
   <div
     class="grid h-screen place-content-center dark:bg-zinc-800"
-    data-testid={getTestId('clock-face')}
+    data-testid={getTestId(clockFaceId)}
   >
     <svg class="h-[95vmin]" viewBox="0 0 200 200">
       <image class="size-1/6 translate-5/12" href="logo.svg" />
diff --git a/test/ClockFace.test.tsx b/test/ClockFace.test.tsx
index 0435cf8..4effb1c 100644
--- a/test/ClockFace.test.tsx
+++ b/test/ClockFace.test.tsx
@@ -1,15 +1,16 @@
 import { describe, expect, test } from 'vitest';
 import { render } from 'vitest-browser-solid';
 
-import { ClockFace } from '@/ClockFace';
+import { ClockFace, clockFaceId } from '@/ClockFace';
 
 describe('<ClockFace />', () => {
   test('renders clock face', () => {
     const screen = render(() => <ClockFace />);
-    expect(screen.getByTestId('clock-face')).toBeInTheDocument();
+    expect(screen.getByTestId(clockFaceId)).toBeInTheDocument();
   });
   test('unmount clock face', () => {
-    const { unmount } = render(() => <ClockFace />);
-    unmount();
+    const screen = render(() => <ClockFace />);
+    screen.unmount();
+    expect(screen.getByTestId(clockFaceId)).not.toBeInTheDocument();
   });
 });