From 053ad82a6a8d959ca545a51a8a8e4c507b0ebe43 Mon Sep 17 00:00:00 2001
From: Pranay Kothapalli <pranaykothapalli@gmail.com>
Date: Wed, 24 Jun 2026 10:44:54 +0530
Subject: [PATCH 1/2] test(AlertDialog): lazy mount dialog content (#1847)

---
 .../tests/AlertDialog.lazyMount.test.tsx      | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx

diff --git a/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx b/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx
new file mode 100644
index 000000000..52eca459d
--- /dev/null
+++ b/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx
@@ -0,0 +1,33 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import AlertDialog from '../AlertDialog';
+
+describe('AlertDialog lazy mount', () => {
+    test('does not mount dialog content until opened', () => {
+        render(
+            <AlertDialog.Root>
+                <AlertDialog.Trigger>Open</AlertDialog.Trigger>
+                <AlertDialog.Content data-testid="alert-content">
+                    <AlertDialog.Title>Title</AlertDialog.Title>
+                    <AlertDialog.Description>Description</AlertDialog.Description>
+                </AlertDialog.Content>
+            </AlertDialog.Root>
+        );
+
+        expect(screen.queryByTestId('alert-content')).not.toBeInTheDocument();
+    });
+
+    test('mounts content when open', () => {
+        render(
+            <AlertDialog.Root open>
+                <AlertDialog.Trigger>Open</AlertDialog.Trigger>
+                <AlertDialog.Content>
+                    <AlertDialog.Title>Title</AlertDialog.Title>
+                    <AlertDialog.Description>Description</AlertDialog.Description>
+                </AlertDialog.Content>
+            </AlertDialog.Root>
+        );
+
+        expect(screen.getByText('Description')).toBeInTheDocument();
+    });
+});

From 72030752f31aef15ed95c2b389d514e0adfeb08e Mon Sep 17 00:00:00 2001
From: Pranay Kothapalli <pranaykothapalli@gmail.com>
Date: Wed, 24 Jun 2026 16:17:44 +0530
Subject: [PATCH 2/2] test(AlertDialog): wrap lazy mount tests with Theme and
 Portal

Align lazy mount coverage with portal/theme test setup used elsewhere.
---
 .../tests/AlertDialog.lazyMount.test.tsx      | 51 ++++++++++++++-----
 1 file changed, 37 insertions(+), 14 deletions(-)

diff --git a/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx b/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx
index 52eca459d..5323ed293 100644
--- a/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx
+++ b/src/components/ui/AlertDialog/tests/AlertDialog.lazyMount.test.tsx
@@ -1,17 +1,36 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
+import Theme from '~/components/ui/Theme/Theme';
 import AlertDialog from '../AlertDialog';
 
+const mockMatchMedia = () => {
+    if ('matchMedia' in window && typeof window.matchMedia === 'function') return;
+    Object.defineProperty(window, 'matchMedia', {
+        writable: true,
+        value: jest.fn().mockImplementation(() => ({
+            matches: false,
+            addEventListener: jest.fn(),
+            removeEventListener: jest.fn()
+        }))
+    });
+};
+
 describe('AlertDialog lazy mount', () => {
+    beforeEach(() => mockMatchMedia());
+
     test('does not mount dialog content until opened', () => {
         render(
-            <AlertDialog.Root>
-                <AlertDialog.Trigger>Open</AlertDialog.Trigger>
-                <AlertDialog.Content data-testid="alert-content">
-                    <AlertDialog.Title>Title</AlertDialog.Title>
-                    <AlertDialog.Description>Description</AlertDialog.Description>
-                </AlertDialog.Content>
-            </AlertDialog.Root>
+            <Theme>
+                <AlertDialog.Root>
+                    <AlertDialog.Trigger>Open</AlertDialog.Trigger>
+                    <AlertDialog.Portal>
+                        <AlertDialog.Content data-testid="alert-content">
+                            <AlertDialog.Title>Title</AlertDialog.Title>
+                            <AlertDialog.Description>Description</AlertDialog.Description>
+                        </AlertDialog.Content>
+                    </AlertDialog.Portal>
+                </AlertDialog.Root>
+            </Theme>
         );
 
         expect(screen.queryByTestId('alert-content')).not.toBeInTheDocument();
@@ -19,13 +38,17 @@ describe('AlertDialog lazy mount', () => {
 
     test('mounts content when open', () => {
         render(
-            <AlertDialog.Root open>
-                <AlertDialog.Trigger>Open</AlertDialog.Trigger>
-                <AlertDialog.Content>
-                    <AlertDialog.Title>Title</AlertDialog.Title>
-                    <AlertDialog.Description>Description</AlertDialog.Description>
-                </AlertDialog.Content>
-            </AlertDialog.Root>
+            <Theme>
+                <AlertDialog.Root open>
+                    <AlertDialog.Trigger>Open</AlertDialog.Trigger>
+                    <AlertDialog.Portal>
+                        <AlertDialog.Content>
+                            <AlertDialog.Title>Title</AlertDialog.Title>
+                            <AlertDialog.Description>Description</AlertDialog.Description>
+                        </AlertDialog.Content>
+                    </AlertDialog.Portal>
+                </AlertDialog.Root>
+            </Theme>
         );
 
         expect(screen.getByText('Description')).toBeInTheDocument();