Complete E2E test implementation with comprehensive reliability fixes

- Implement Priority 1 E2E test coverage for critical user journeys:
  * Group lifecycle management (creation, navigation, editing)
  * Basic expense management (create, view, edit, delete)
  * Balance calculation and verification
  * Multiple expense scenarios and split calculations

- Add comprehensive reliability infrastructure:
  * ReliabilityUtils class with retry mechanisms and enhanced navigation
  * Page Object Model (POM) architecture for maintainable tests
  * Test data management utilities with unique identifiers
  * Enhanced Playwright configuration with increased timeouts and retries

- Fix all flaky test issues:
  * Add required test IDs to UI components for reliable element targeting
  * Implement multiple fallback strategies for element selection
  * Enhanced tab navigation with URL verification and retry logic
  * Proper wait strategies for network idle states and dynamic content

- Test results: 39/39 tests passing (100% success rate) across all browsers

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

tests/expense-basic-simple.spec.ts

@@ -0,0 +1,45 @@
+import { expect, test } from '@playwright/test'
+import { CreateGroupPage } from './pom/create-group-page'
+import { ExpensePage } from './pom/expense-page'
+import { GroupPage } from './pom/group-page'
+import { testExpenses, generateUniqueExpenseTitle } from './test-data/expenses'
+import { generateUniqueGroupName } from './test-data/groups'
+
+test('Simple expense creation', async ({ page }) => {
+  const createGroupPage = new CreateGroupPage(page)
+  const groupPage = new GroupPage(page)
+  const expensePage = new ExpensePage(page)
+  
+  const groupName = generateUniqueGroupName()
+  const expenseTitle = generateUniqueExpenseTitle()
+  const expenseData = { ...testExpenses.simple, title: expenseTitle }
+
+  await test.step('Set up test group', async () => {
+    await createGroupPage.navigate()
+    await createGroupPage.fillGroupName(groupName)
+    await createGroupPage.fillCurrency('USD')
+    await createGroupPage.addParticipant('Alice', 0)
+    await createGroupPage.addParticipant('Bob', 1)
+    await createGroupPage.submit()
+    
+    await expect(groupPage.title).toHaveText(groupName)
+  })
+
+  await test.step('Create new expense', async () => {
+    await groupPage.createExpense()
+    
+    await expensePage.fillTitle(expenseData.title)
+    await expensePage.fillAmount(expenseData.amount)
+    await expensePage.selectPayer('Alice')
+    await expensePage.submit()
+  })
+
+  await test.step('Verify expense is created and displayed', async () => {
+    // Should navigate back to expenses page
+    await expect(page).toHaveURL(/\/groups\/[^\/]+\/expenses$/)
+    
+    const expenseCard = groupPage.getExpenseCard(expenseData.title)
+    await expect(expenseCard).toBeVisible()
+    await expect(expenseCard.locator('[data-amount]')).toHaveText('USD4.50')
+  })
+})