test-localStorage-with-auth.js•7.11 kB
/**
* @document localStorage Injection Test with Authentication
* @version 1.0.0
* @status active
* @author Claude Code
* @created 2025-06-30
* @description Test localStorage injection using JWT authentication
*/
import { chromium } from 'playwright';
import { fotossintesesComposerJSON } from '../../compositions/fotossintese-composer-json-v1.1.0.js';
import fs from 'fs/promises';
async function getJWTToken() {
try {
const tokenData = await fs.readFile('archive/authentication/correct-jwt-new.txt', 'utf-8');
return tokenData.trim();
} catch (error) {
console.log('⚠️ Could not read JWT token file');
return null;
}
}
async function testWithAuthentication() {
console.log('🔐 Starting localStorage injection test with authentication...\n');
const browser = await chromium.launch({
headless: false,
slowMo: 500
});
try {
const context = await browser.newContext({
viewport: { width: 1920, height: 1080 }
});
const page = await context.newPage();
// Step 1: Get JWT token and construct login URL
console.log('🎫 Step 1: Getting JWT token...');
const jwtToken = await getJWTToken();
if (jwtToken) {
console.log('✅ JWT token found, using authenticated access');
const loginUrl = `https://composer.euconquisto.com/auth/login?token=${jwtToken}`;
await page.goto(loginUrl, { waitUntil: 'networkidle' });
} else {
console.log('⚠️ No JWT token, using direct access');
await page.goto('https://composer.euconquisto.com', { waitUntil: 'networkidle' });
}
// Take screenshot after login
await page.screenshot({
path: 'logs/screenshots/injection/auth-01-after-login.png',
fullPage: true
});
// Step 2: Wait for page to load and inject composition
console.log('⏱️ Step 2: Waiting for page load...');
await page.waitForTimeout(3000);
console.log('💉 Step 3: Injecting fotossíntese composition...');
const injectionResult = await page.evaluate((compositionData) => {
try {
// Clear existing composer data
const keys = ['rdp-composer-data', 'composer-data', 'composition-data'];
keys.forEach(key => localStorage.removeItem(key));
// Try multiple possible keys
const storageKey = 'rdp-composer-data';
localStorage.setItem(storageKey, JSON.stringify(compositionData));
// Verify storage
const stored = localStorage.getItem(storageKey);
const parsed = JSON.parse(stored);
// Also try to trigger any composition loading events
if (window.loadComposition) {
window.loadComposition(compositionData);
}
return {
success: true,
compositionId: parsed.composition.id,
title: parsed.composition.title,
elementCount: parsed.composition.elements.length,
storageKey: storageKey
};
} catch (error) {
return {
success: false,
error: error.message
};
}
}, fotossintesesComposerJSON);
console.log('📦 Injection result:', injectionResult);
// Take screenshot after injection
await page.screenshot({
path: 'logs/screenshots/injection/auth-02-after-injection.png',
fullPage: true
});
// Step 4: Try to navigate to composer/editor
console.log('🎨 Step 4: Attempting to access composer interface...');
// Try different possible composer paths
const composerPaths = [
'/composer',
'/editor',
'/create',
'/new'
];
for (const path of composerPaths) {
try {
console.log(` 📍 Trying: ${path}`);
await page.goto(`https://composer.euconquisto.com${path}`, {
waitUntil: 'networkidle',
timeout: 10000
});
// Check if we got a valid page (not 404)
const pageContent = await page.textContent('body');
if (!pageContent.includes('404') && !pageContent.includes('not exist')) {
console.log(` ✅ Success with path: ${path}`);
break;
}
} catch (error) {
console.log(` ❌ Failed with path: ${path}`);
}
}
// Take screenshot of final state
await page.screenshot({
path: 'logs/screenshots/injection/auth-03-composer-interface.png',
fullPage: true
});
// Step 5: Final validation
console.log('✨ Step 5: Final validation...');
const finalValidation = await page.evaluate(() => {
// Check localStorage persistence
const storageData = localStorage.getItem('rdp-composer-data');
const hasStorageData = !!storageData;
// Check page content
const bodyText = document.body.innerText || '';
const hasComposerInterface = bodyText.toLowerCase().includes('composer') ||
bodyText.toLowerCase().includes('editor') ||
bodyText.toLowerCase().includes('composition');
const hasPhotosynthesis = bodyText.toLowerCase().includes('fotossíntese');
// Check for composer-specific elements
const hasComposerElements = document.querySelectorAll('[class*="composer"], [class*="editor"], [class*="widget"]').length > 0;
return {
hasStorageData,
hasComposerInterface,
hasPhotosynthesis,
hasComposerElements,
currentUrl: window.location.href,
pageSnippet: bodyText.substring(0, 300)
};
});
console.log('🎯 Final validation:', finalValidation);
// Summary
console.log('\n📊 Authentication Test Summary:');
console.log('================================');
console.log(`🔐 Authentication: ${jwtToken ? 'JWT Token Used' : 'Direct Access'}`);
console.log(`💾 localStorage injection: ${injectionResult.success ? 'SUCCESS' : 'FAILED'}`);
console.log(`📍 Composition ID: ${injectionResult.compositionId || 'N/A'}`);
console.log(`🎨 Composer interface: ${finalValidation.hasComposerInterface ? 'DETECTED' : 'NOT DETECTED'}`);
console.log(`💾 Data persistence: ${finalValidation.hasStorageData ? 'YES' : 'NO'}`);
console.log(`🌐 Final URL: ${finalValidation.currentUrl}`);
return {
injection: injectionResult,
validation: finalValidation,
success: injectionResult.success && finalValidation.hasStorageData
};
} catch (error) {
console.error('❌ Test failed:', error);
throw error;
} finally {
console.log('\n⏸️ Keeping browser open for observation...');
await new Promise(resolve => setTimeout(resolve, 15000));
await browser.close();
}
}
// Run the test
testWithAuthentication()
.then(report => {
console.log('\n✅ Authentication test completed!');
console.log('📸 Screenshots saved with auth- prefix');
process.exit(0);
})
.catch(error => {
console.error('\n❌ Authentication test failed:', error);
process.exit(1);
});