diff --git a/web/app/components/app/create-app-modal/index.spec.tsx b/web/app/components/app/create-app-modal/index.spec.tsx
index cb8f4db67f..fb3a38b96a 100644
--- a/web/app/components/app/create-app-modal/index.spec.tsx
+++ b/web/app/components/app/create-app-modal/index.spec.tsx
@@ -47,6 +47,15 @@ vi.mock('@/hooks/use-theme', () => ({
   default: () => ({ theme: 'light' }),
 }))
 
+vi.mock('@/app/components/workflow/utils', () => ({
+  getKeyboardKeyNameBySystem: (key: string) => key,
+}))
+
+// Mock ShortcutsName to avoid polluting button accessible names
+vi.mock('@/app/components/workflow/shortcuts-name', () => ({
+  default: () => null,
+}))
+
 const mockNotify = vi.fn()
 const mockUseRouter = vi.mocked(useRouter)
 const mockPush = vi.fn()
diff --git a/web/app/components/explore/create-app-modal/index.spec.tsx b/web/app/components/explore/create-app-modal/index.spec.tsx
index 7ddb5a9082..de7b6efb98 100644
--- a/web/app/components/explore/create-app-modal/index.spec.tsx
+++ b/web/app/components/explore/create-app-modal/index.spec.tsx
@@ -85,6 +85,15 @@ vi.mock('@/context/provider-context', () => ({
   },
 }))
 
+vi.mock('@/app/components/workflow/utils', () => ({
+  getKeyboardKeyNameBySystem: (key: string) => key,
+}))
+
+// Mock ShortcutsName to avoid polluting button accessible names
+vi.mock('@/app/components/workflow/shortcuts-name', () => ({
+  default: () => null,
+}))
+
 type ConfirmPayload = Parameters<CreateAppModalProps['onConfirm']>[0]
 
 const setup = (overrides: Partial<CreateAppModalProps> = {}) => {
diff --git a/web/app/components/goto-anything/index.spec.tsx b/web/app/components/goto-anything/index.spec.tsx
index 449929d729..4a174749e1 100644
--- a/web/app/components/goto-anything/index.spec.tsx
+++ b/web/app/components/goto-anything/index.spec.tsx
@@ -86,6 +86,7 @@ vi.mock('./actions/commands/registry', () => ({
 
 vi.mock('@/app/components/workflow/utils/common', () => ({
   getKeyboardKeyCodeBySystem: () => 'ctrl',
+  getKeyboardKeyNameBySystem: (key: string) => key,
   isEventTargetInputArea: () => false,
   isMac: () => false,
 }))
diff --git a/web/app/components/rag-pipeline/components/update-dsl-modal.spec.tsx b/web/app/components/rag-pipeline/components/update-dsl-modal.spec.tsx
index b96d3dfb1f..eaa569298a 100644
--- a/web/app/components/rag-pipeline/components/update-dsl-modal.spec.tsx
+++ b/web/app/components/rag-pipeline/components/update-dsl-modal.spec.tsx
@@ -134,19 +134,20 @@ vi.mock('@/app/components/workflow/constants', () => ({
   WORKFLOW_DATA_UPDATE: 'WORKFLOW_DATA_UPDATE',
 }))
 
-// Mock FileReader
+// Mock FileReader - synchronous to avoid timing issues in tests
 class MockFileReader {
   result: string | null = null
   onload: ((e: { target: { result: string | null } }) => void) | null = null
 
   readAsText(_file: File) {
-    // Simulate async file reading
-    setTimeout(() => {
-      this.result = 'test file content'
-      if (this.onload) {
+    // Call onload synchronously to avoid race conditions in tests
+    this.result = 'test file content'
+    // Use queueMicrotask instead of setTimeout to ensure it runs before other timers
+    // but still allows React state updates to complete
+    queueMicrotask(() => {
+      if (this.onload)
         this.onload({ target: { result: this.result } })
-      }
-    }, 0)
+    })
   }
 }
 
diff --git a/web/app/components/workflow-app/components/workflow-onboarding-modal/index.spec.tsx b/web/app/components/workflow-app/components/workflow-onboarding-modal/index.spec.tsx
index 1314dc90dc..2802e5fad4 100644
--- a/web/app/components/workflow-app/components/workflow-onboarding-modal/index.spec.tsx
+++ b/web/app/components/workflow-app/components/workflow-onboarding-modal/index.spec.tsx
@@ -33,6 +33,11 @@ vi.mock('@/context/i18n', () => ({
   useDocLink: () => (path: string) => `https://docs.example.com${path}`,
 }))
 
+// Mock workflow utils for ShortcutsName component
+vi.mock('@/app/components/workflow/utils', () => ({
+  getKeyboardKeyNameBySystem: (key: string) => key,
+}))
+
 // Mock StartNodeSelectionPanel (using real component would be better for integration,
 // but for this test we'll mock to control behavior)
 vi.mock('./start-node-selection-panel', () => ({
@@ -551,8 +556,10 @@ describe('WorkflowOnboardingModal', () => {
 
       // Assert
       const escKey = screen.getByText('workflow.onboarding.escTip.key')
-      expect(escKey.closest('kbd')).toBeInTheDocument()
-      expect(escKey.closest('kbd')).toHaveClass('system-kbd')
+      // ShortcutsName renders a div with system-kbd class, not a kbd element
+      const kbdContainer = escKey.closest('.system-kbd')
+      expect(kbdContainer).toBeInTheDocument()
+      expect(kbdContainer).toHaveClass('system-kbd')
     })
 
     it('should have descriptive text for ESC functionality', () => {