feat: enhance timeline navigation with comprehensive testing and documentation

- Add comprehensive test suite with 13 passing tests
- Create detailed keyboard shortcuts documentation (KEYBOARD_SHORTCUTS.md)
- Add meaningful code comments explaining functionality
- Set up Vitest testing framework with proper mocks
- Fix React imports in timeline components for proper JSX rendering
- Add ResizeObserver mock for browser environment compatibility
- Enhance keyboard shortcuts help to properly format Enter key display

Tests cover:
- Enter key keybinding functionality
- Return to Start button click behavior
- Keyboard shortcuts help system integration
- Component rendering and tooltip structure

Documentation includes:
- Complete keyboard shortcuts reference
- UI feature explanations
- Usage notes and behavior descriptions

All tests passing (13/13) with full feature coverage.

apps/web/src/stores/__tests__/keybindings-store.test.ts

@@ -0,0 +1,65 @@
+import { describe, it, expect, beforeEach } from 'vitest'
+import { useKeybindingsStore } from '../keybindings-store'
+
+describe('Keybindings Store', () => {
+  beforeEach(() => {
+    // Reset store to default state before each test
+    useKeybindingsStore.getState().resetToDefaults()
+  })
+
+  describe('Default Keybindings', () => {
+    it('should include Enter key mapping to goto-start action', () => {
+      const { keybindings } = useKeybindingsStore.getState()
+      expect(keybindings.enter).toBe('goto-start')
+    })
+
+    it('should include Home key mapping to goto-start action', () => {
+      const { keybindings } = useKeybindingsStore.getState()
+      expect(keybindings.home).toBe('goto-start')
+    })
+
+    it('should have both Enter and Home keys for the same action', () => {
+      const { keybindings } = useKeybindingsStore.getState()
+      expect(keybindings.enter).toBe(keybindings.home)
+    })
+  })
+
+  describe('getKeybindingsForAction', () => {
+    it('should return both Enter and Home keys for goto-start action', () => {
+      const { getKeybindingsForAction } = useKeybindingsStore.getState()
+      const keys = getKeybindingsForAction('goto-start')
+      
+      expect(keys).toContain('enter')
+      expect(keys).toContain('home')
+      expect(keys.length).toBeGreaterThanOrEqual(2)
+    })
+  })
+
+  describe('Keyboard Event Parsing', () => {
+    it('should generate correct keybinding string for Enter key', () => {
+      const { getKeybindingString } = useKeybindingsStore.getState()
+      
+      // Mock KeyboardEvent for Enter key
+      const enterEvent = new KeyboardEvent('keydown', {
+        key: 'Enter',
+        code: 'Enter'
+      })
+      
+      const result = getKeybindingString(enterEvent)
+      expect(result).toBe('enter')
+    })
+
+    it('should generate correct keybinding string for Home key', () => {
+      const { getKeybindingString } = useKeybindingsStore.getState()
+      
+      // Mock KeyboardEvent for Home key
+      const homeEvent = new KeyboardEvent('keydown', {
+        key: 'Home',
+        code: 'Home'
+      })
+      
+      const result = getKeybindingString(homeEvent)
+      expect(result).toBe('home')
+    })
+  })
+})

apps/web/src/stores/keybindings-store.ts

@@ -17,7 +17,7 @@ export const defaultKeybindings: KeybindingConfig = {
   "shift+left": "jump-backward",
   "shift+right": "jump-forward",
   home: "goto-start",
-  enter: "goto-start",
+  enter: "goto-start", // More intuitive alternative to Home key for timeline navigation
   end: "goto-end",
   s: "split-element",
   n: "toggle-snapping",