246 lines
9.3 KiB
JavaScript
246 lines
9.3 KiB
JavaScript
#!/usr/bin/env node
|
|
/**
|
|
* Knowledge Graph Cache Fix - Manual Test Script
|
|
*
|
|
* This script uses Playwright to test that the Knowledge Graph visualization
|
|
* works correctly on both fresh API responses AND cached responses.
|
|
*
|
|
* Run with: npx playwright test tests/knowledge-graph-cache.spec.ts
|
|
* Or: node tests/knowledge-graph-cache-manual.mjs
|
|
*
|
|
* Prerequisites:
|
|
* npm install playwright @playwright/test
|
|
* npx playwright install chromium
|
|
*/
|
|
|
|
import { chromium } from 'playwright';
|
|
|
|
const BASE_URL = 'https://archief.support';
|
|
const TEST_QUERY = 'Welke archieven zijn er in Den Haag?';
|
|
const LOGIN_EMAIL = 'scott@bronhouder.nl';
|
|
const LOGIN_PASSWORD = 'Olivi@1985';
|
|
|
|
async function sleep(ms) {
|
|
return new Promise(resolve => setTimeout(resolve, ms));
|
|
}
|
|
|
|
async function runTest() {
|
|
console.log('🚀 Starting Knowledge Graph Cache Test\n');
|
|
|
|
const browser = await chromium.launch({
|
|
headless: false, // Set to true for CI
|
|
slowMo: 100 // Slow down for visibility
|
|
});
|
|
|
|
const context = await browser.newContext();
|
|
const page = await context.newPage();
|
|
|
|
// Capture console logs
|
|
const consoleLogs = [];
|
|
page.on('console', msg => {
|
|
const text = msg.text();
|
|
consoleLogs.push(text);
|
|
if (text.includes('[ChatPage]') || text.includes('Knowledge Graph') || text.includes('Cache')) {
|
|
console.log(` 📝 Browser: ${text}`);
|
|
}
|
|
});
|
|
|
|
try {
|
|
// Step 1: Navigate to archief.support
|
|
console.log('Step 1: Navigating to archief.support...');
|
|
await page.goto(BASE_URL);
|
|
await page.waitForLoadState('networkidle');
|
|
console.log(' ✅ Page loaded\n');
|
|
|
|
// Check if login is needed
|
|
const loginButton = page.locator('button:has-text("Inloggen")');
|
|
if (await loginButton.isVisible({ timeout: 3000 }).catch(() => false)) {
|
|
console.log('Step 1b: Login required...');
|
|
await loginButton.click();
|
|
await sleep(1000);
|
|
|
|
// Fill login form
|
|
await page.fill('input[type="email"], input[name="email"]', LOGIN_EMAIL);
|
|
await page.fill('input[type="password"], input[name="password"]', LOGIN_PASSWORD);
|
|
await page.click('button[type="submit"]');
|
|
await page.waitForLoadState('networkidle');
|
|
console.log(' ✅ Logged in\n');
|
|
}
|
|
|
|
// Step 2: Clear the cache
|
|
console.log('Step 2: Clearing cache...');
|
|
const clearCacheButton = page.locator('button:has-text("Cache wissen")');
|
|
if (await clearCacheButton.isVisible({ timeout: 2000 }).catch(() => false)) {
|
|
await clearCacheButton.click();
|
|
await sleep(1000);
|
|
console.log(' ✅ Cache cleared\n');
|
|
} else {
|
|
console.log(' ⚠️ Cache clear button not found, continuing...\n');
|
|
}
|
|
|
|
// Step 3: Submit query (fresh API call)
|
|
console.log('Step 3: Submitting query (fresh API call)...');
|
|
console.log(` Query: "${TEST_QUERY}"`);
|
|
|
|
// Find the input field
|
|
const inputField = page.locator('textarea').first();
|
|
await inputField.fill(TEST_QUERY);
|
|
|
|
// Find and click send button
|
|
const sendButton = page.locator('button[type="submit"]').first();
|
|
await sendButton.click();
|
|
|
|
console.log(' ⏳ Waiting for RAG response (this may take 30-60 seconds)...');
|
|
|
|
// Wait for response
|
|
await page.waitForSelector('[data-role="assistant"], .message-content', { timeout: 90000 });
|
|
await sleep(3000); // Extra time for processing
|
|
console.log(' ✅ Response received\n');
|
|
|
|
// Step 4: Open Debug Panel and check Knowledge Graph
|
|
console.log('Step 4: Opening Debug Panel...');
|
|
|
|
// Look for debug toggle button
|
|
const debugToggle = page.locator('button').filter({ hasText: /debug/i }).first();
|
|
if (await debugToggle.isVisible({ timeout: 2000 }).catch(() => false)) {
|
|
await debugToggle.click();
|
|
await sleep(500);
|
|
}
|
|
|
|
// Click Kennisgraaf tab
|
|
const knowledgeGraphTab = page.locator('button').filter({ hasText: 'Kennisgraaf' }).first();
|
|
if (await knowledgeGraphTab.isVisible({ timeout: 2000 }).catch(() => false)) {
|
|
await knowledgeGraphTab.click();
|
|
await sleep(1000);
|
|
}
|
|
|
|
// Check for "no data" message
|
|
const noDataMessage = page.locator('text="Geen graafdata beschikbaar"');
|
|
const hasNoDataFresh = await noDataMessage.isVisible({ timeout: 2000 }).catch(() => false);
|
|
|
|
if (hasNoDataFresh) {
|
|
console.log(' ❌ FRESH RESPONSE: "No graph data available" - This should have data!');
|
|
} else {
|
|
console.log(' ✅ FRESH RESPONSE: Knowledge Graph has data');
|
|
}
|
|
console.log('');
|
|
|
|
// Step 5: Clear conversation (keep cache)
|
|
console.log('Step 5: Clearing conversation (keeping cache)...');
|
|
const newChatButton = page.locator('button').filter({ hasText: /nieuw|wis gesprek/i }).first();
|
|
if (await newChatButton.isVisible({ timeout: 2000 }).catch(() => false)) {
|
|
await newChatButton.click();
|
|
await sleep(1000);
|
|
console.log(' ✅ Conversation cleared\n');
|
|
} else {
|
|
// Try refreshing the page
|
|
await page.reload();
|
|
await page.waitForLoadState('networkidle');
|
|
console.log(' ✅ Page refreshed\n');
|
|
}
|
|
|
|
// Step 6: Submit SAME query again (should hit cache)
|
|
console.log('Step 6: Submitting same query (should hit cache)...');
|
|
consoleLogs.length = 0; // Clear console logs
|
|
|
|
await inputField.fill(TEST_QUERY);
|
|
await sendButton.click();
|
|
|
|
// Wait for cached response (should be much faster)
|
|
await page.waitForSelector('[data-role="assistant"], .message-content', { timeout: 15000 });
|
|
await sleep(2000);
|
|
|
|
// Check for cache hit in console logs
|
|
const hasCacheHit = consoleLogs.some(log => log.includes('Cache HIT'));
|
|
const hasRestoredResults = consoleLogs.some(log => log.includes('Restored') && log.includes('cached results'));
|
|
|
|
if (hasCacheHit) {
|
|
console.log(' ✅ Cache HIT detected');
|
|
} else {
|
|
console.log(' ⚠️ No cache hit detected (may be a cache miss)');
|
|
}
|
|
|
|
if (hasRestoredResults) {
|
|
console.log(' ✅ Results restored from cache for Knowledge Graph');
|
|
} else if (hasCacheHit) {
|
|
console.log(' ❌ Cache hit but NO restored results - FIX MAY NOT BE WORKING');
|
|
}
|
|
console.log('');
|
|
|
|
// Step 7: Check for Gecached badge
|
|
console.log('Step 7: Checking for cached badge...');
|
|
const cachedBadge = page.locator('text="Gecached"');
|
|
const hasCachedBadge = await cachedBadge.isVisible({ timeout: 3000 }).catch(() => false);
|
|
|
|
if (hasCachedBadge) {
|
|
console.log(' ✅ "Gecached" badge visible');
|
|
} else {
|
|
console.log(' ⚠️ "Gecached" badge not found');
|
|
}
|
|
console.log('');
|
|
|
|
// Step 8: Check Knowledge Graph on cached response
|
|
console.log('Step 8: Checking Knowledge Graph on CACHED response...');
|
|
|
|
// Ensure debug panel is open and on Kennisgraaf tab
|
|
if (await debugToggle.isVisible({ timeout: 1000 }).catch(() => false)) {
|
|
await debugToggle.click();
|
|
await sleep(500);
|
|
}
|
|
if (await knowledgeGraphTab.isVisible({ timeout: 1000 }).catch(() => false)) {
|
|
await knowledgeGraphTab.click();
|
|
await sleep(1000);
|
|
}
|
|
|
|
// THE KEY TEST: Check for "no data" message on cached response
|
|
const hasNoDataCached = await noDataMessage.isVisible({ timeout: 2000 }).catch(() => false);
|
|
|
|
console.log('');
|
|
console.log('═══════════════════════════════════════════════════════════');
|
|
console.log(' TEST RESULTS ');
|
|
console.log('═══════════════════════════════════════════════════════════');
|
|
|
|
if (hasNoDataCached) {
|
|
console.log('');
|
|
console.log(' ❌ FAILED: Cached response shows "Geen graafdata beschikbaar"');
|
|
console.log('');
|
|
console.log(' The Knowledge Graph cache fix is NOT working correctly.');
|
|
console.log(' Check that:');
|
|
console.log(' 1. retrievedResults is being stored in cache');
|
|
console.log(' 2. setDebugResults() is called on cache hit');
|
|
console.log(' 3. The deployed build includes the latest changes');
|
|
console.log('');
|
|
} else {
|
|
console.log('');
|
|
console.log(' ✅ PASSED: Cached response shows Knowledge Graph data!');
|
|
console.log('');
|
|
console.log(' The Knowledge Graph cache fix is working correctly.');
|
|
console.log('');
|
|
}
|
|
|
|
console.log('═══════════════════════════════════════════════════════════');
|
|
console.log('');
|
|
|
|
// Print relevant console logs
|
|
console.log('Relevant browser console logs:');
|
|
consoleLogs
|
|
.filter(log =>
|
|
log.includes('[ChatPage]') ||
|
|
log.includes('Knowledge Graph') ||
|
|
log.includes('extractGraphData') ||
|
|
log.includes('graphData')
|
|
)
|
|
.forEach(log => console.log(` ${log}`));
|
|
|
|
// Keep browser open for manual inspection
|
|
console.log('\n📌 Browser will stay open for 30 seconds for manual inspection...');
|
|
await sleep(30000);
|
|
|
|
} catch (error) {
|
|
console.error('❌ Test failed with error:', error.message);
|
|
} finally {
|
|
await browser.close();
|
|
}
|
|
}
|
|
|
|
runTest();
|