tony
d516e93323
- Proactive Grok integration (xAI API + local CLI fallback) - Real road routing via OSRM (no more bird's-eye lines) - Heavy structured logging for fast iteration - Strong sanitization + geocoding + ErrorBoundary (no black screens) - Playwright E2E tests (API diagnostic + full UI flow) - scripts/dev.sh for one-command startup - Clean .env.example + documentation This is a stable checkpoint before further prompt/UI refinement.
54 lines
2.2 KiB
TypeScript
54 lines
2.2 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('Tesla Roadtrip - Full Chat to Map Flow', () => {
|
|
|
|
test.setTimeout(180000);
|
|
|
|
test('should send a trip request, get real Grok response, and render itinerary + map', async ({ page }) => {
|
|
await page.goto('http://localhost:5173');
|
|
|
|
// Better header selector
|
|
const grokHeader = page.locator('div.font-semibold.text-lg.tracking-tight:has-text("Grok Drive")').first();
|
|
await expect(grokHeader).toBeVisible({ timeout: 15000 });
|
|
|
|
const chatInput = page.locator('input[placeholder*="Tell me where you want to drive"], input[placeholder*="drive"]');
|
|
await expect(chatInput).toBeVisible();
|
|
|
|
const tripRequest = 'I want to go from Milton Keynes to Telford in my Model Y';
|
|
await chatInput.fill(tripRequest);
|
|
|
|
const sendButton = page.locator('button:has(svg)').last();
|
|
await sendButton.click();
|
|
|
|
// Wait for thinking state
|
|
const thinking = page.locator('text=GROK IS PLANNING YOUR ROUTE');
|
|
await thinking.waitFor({ state: 'visible', timeout: 20000 }).catch(() => {});
|
|
|
|
// Wait for Grok to finish
|
|
await thinking.waitFor({ state: 'hidden', timeout: 120000 });
|
|
|
|
const lastAssistant = page.locator('.chat-bubble-assistant').last();
|
|
|
|
// === DIAGNOSTIC: Detect the common failure mode early ===
|
|
const messageText = await lastAssistant.textContent();
|
|
if (messageText?.includes('having trouble reaching Grok')) {
|
|
await page.screenshot({ path: `test-results/grok-failed-${Date.now()}.png`, fullPage: true });
|
|
throw new Error('Grok call failed (got error message). Check backend logs + make sure XAI_API_KEY is loaded correctly (use ./scripts/dev.sh).');
|
|
}
|
|
|
|
// Success path
|
|
const dayOne = page.locator('text=DAY 1').first();
|
|
await expect(dayOne).toBeVisible({ timeout: 30000 });
|
|
|
|
const stop = page.locator('.group:has-text("Supercharger"), .group:has-text("Hotel")').first();
|
|
await expect(stop).toBeVisible({ timeout: 15000 });
|
|
|
|
await page.screenshot({
|
|
path: `test-results/success-milton-keynes-telford-${Date.now()}.png`,
|
|
fullPage: true
|
|
});
|
|
|
|
console.log('✅ Full flow succeeded: Real Grok itinerary rendered on map!');
|
|
});
|
|
|
|
}); |