feat: implement splash screen handling in navigation and interactions

- Added a new function `waitForSplashScreenToDisappear` to manage splash screen visibility, ensuring it does not block user interactions.
- Integrated splash screen checks in various navigation functions and interaction methods to enhance user experience by waiting for the splash screen to disappear before proceeding.
- Updated test setup to disable the splash screen during tests for consistent testing behavior.

apps/ui/tests/utils/core/interactions.ts

@@ -1,5 +1,6 @@
 import { Page, expect } from '@playwright/test';
 import { getByTestId, getButtonByText } from './elements';
+import { waitForSplashScreenToDisappear } from './waiting';
 
 /**
  * Get the platform-specific modifier key (Meta for Mac, Control for Windows/Linux)
@@ -21,6 +22,8 @@ export async function pressModifierEnter(page: Page): Promise<void> {
  * Click an element by its data-testid attribute
  */
 export async function clickElement(page: Page, testId: string): Promise<void> {
+  // Wait for splash screen to disappear first (safety net)
+  await waitForSplashScreenToDisappear(page, 2000);
   const element = await getByTestId(page, testId);
   await element.click();
 }

apps/ui/tests/utils/core/waiting.ts

@@ -40,3 +40,60 @@ export async function waitForElementHidden(
     state: 'hidden',
   });
 }
+
+/**
+ * Wait for the splash screen to disappear
+ * The splash screen has z-[9999] and blocks interactions, so we need to wait for it
+ */
+export async function waitForSplashScreenToDisappear(page: Page, timeout = 5000): Promise<void> {
+  try {
+    // Check if splash screen is shown via sessionStorage first (fastest check)
+    const splashShown = await page.evaluate(() => {
+      return sessionStorage.getItem('automaker-splash-shown') === 'true';
+    });
+
+    // If splash is already marked as shown, it won't appear, so we're done
+    if (splashShown) {
+      return;
+    }
+
+    // Otherwise, wait for the splash screen element to disappear
+    // The splash screen is a div with z-[9999] and fixed inset-0
+    // We check for elements that match the splash screen pattern
+    await page.waitForFunction(
+      () => {
+        // Check if splash is marked as shown in sessionStorage
+        if (sessionStorage.getItem('automaker-splash-shown') === 'true') {
+          return true;
+        }
+
+        // Check for splash screen element by looking for fixed inset-0 with high z-index
+        const allDivs = document.querySelectorAll('div');
+        for (const div of allDivs) {
+          const style = window.getComputedStyle(div);
+          const classes = div.className || '';
+          // Check if it matches splash screen pattern: fixed, inset-0, and high z-index
+          if (
+            style.position === 'fixed' &&
+            (classes.includes('inset-0') ||
+              (style.top === '0px' &&
+                style.left === '0px' &&
+                style.right === '0px' &&
+                style.bottom === '0px')) &&
+            (classes.includes('z-[') || parseInt(style.zIndex) >= 9999)
+          ) {
+            // Check if it's visible and blocking (opacity > 0 and pointer-events not none)
+            if (style.opacity !== '0' && style.pointerEvents !== 'none') {
+              return false; // Splash screen is still visible
+            }
+          }
+        }
+        return true; // No visible splash screen found
+      },
+      { timeout }
+    );
+  } catch {
+    // Splash screen might not exist or already gone, which is fine
+    // No need to wait - if it doesn't exist, we're good
+  }
+}