- Add .gitignore to exclude node_modules, dist, logs, and system files - Add comprehensive project documentation including README, deployment guide, and development setup - Add .kiro project specifications for amazon-product-bar-extension, appwrite-cloud-storage, appwrite-userid-repair, blacklist-feature, and enhanced-item-management - Add .kiro steering documents for product, structure, styling, and tech guidelines - Add VSCode settings configuration for consistent development environment - Add manifest.json and babel/vite configuration for extension build setup - Add complete source code implementation including AppWrite integration, storage managers, UI components, and services - Add comprehensive test suite with Jest configuration and 30+ test files covering all major modules - Add test HTML files for integration testing and validation - Add coverage reports and build validation scripts - Add AppWrite setup and repair documentation for database schema management - Add migration guides and responsive accessibility implementation documentation - Establish foundation for Amazon product bar extension with full feature set including blacklist management, enhanced item workflows, and real-time synchronization
340 lines
14 KiB
HTML
340 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Migration Service Test</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
background-color: #f5f5f5;
|
|
}
|
|
.container {
|
|
background: white;
|
|
padding: 20px;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
.test-section {
|
|
margin: 20px 0;
|
|
padding: 15px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
}
|
|
.success { border-color: #28a745; background-color: #d4edda; }
|
|
.error { border-color: #dc3545; background-color: #f8d7da; }
|
|
.info { border-color: #17a2b8; background-color: #d1ecf1; }
|
|
button {
|
|
background: #007bff;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
}
|
|
button:hover { background: #0056b3; }
|
|
button:disabled { background: #6c757d; cursor: not-allowed; }
|
|
pre {
|
|
background: #f8f9fa;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
overflow-x: auto;
|
|
white-space: pre-wrap;
|
|
}
|
|
.status {
|
|
font-weight: bold;
|
|
margin: 10px 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>Migration Service Integration Test</h1>
|
|
<p>This test verifies the MigrationService class functionality with mock data.</p>
|
|
|
|
<div class="test-section info">
|
|
<h3>Test Setup</h3>
|
|
<button onclick="setupTestData()">Setup Test Data in localStorage</button>
|
|
<button onclick="clearTestData()">Clear Test Data</button>
|
|
<div id="setup-status"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h3>Migration Detection</h3>
|
|
<button onclick="testDetection()">Test Data Detection</button>
|
|
<div id="detection-results"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h3>Migration Execution</h3>
|
|
<button onclick="testMigration()" id="migrate-btn">Test Migration Process</button>
|
|
<div id="migration-results"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h3>Migration Status</h3>
|
|
<button onclick="checkStatus()">Check Migration Status</button>
|
|
<div id="status-results"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h3>Error Handling</h3>
|
|
<button onclick="testErrorHandling()">Test Error Scenarios</button>
|
|
<div id="error-results"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
import { MigrationService } from './src/MigrationService.js';
|
|
import { EnhancedStorageManager } from './src/EnhancedStorageManager.js';
|
|
import { BlacklistStorageManager } from './src/BlacklistStorageManager.js';
|
|
import { SettingsPanelManager } from './src/SettingsPanelManager.js';
|
|
import { ProductStorageManager } from './src/ProductStorageManager.js';
|
|
|
|
// Mock AppWrite Manager for testing
|
|
class MockAppWriteManager {
|
|
constructor() {
|
|
this.documents = new Map();
|
|
this.isAuthenticated = true;
|
|
this.currentUserId = 'test-user-123';
|
|
}
|
|
|
|
getCurrentUserId() {
|
|
return this.currentUserId;
|
|
}
|
|
|
|
async createUserDocument(collectionId, data, documentId = null) {
|
|
const id = documentId || `doc_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
|
const document = {
|
|
$id: id,
|
|
$createdAt: new Date().toISOString(),
|
|
$updatedAt: new Date().toISOString(),
|
|
userId: this.currentUserId,
|
|
...data
|
|
};
|
|
|
|
if (!this.documents.has(collectionId)) {
|
|
this.documents.set(collectionId, []);
|
|
}
|
|
|
|
this.documents.get(collectionId).push(document);
|
|
return document;
|
|
}
|
|
|
|
async getUserDocuments(collectionId, additionalQueries = []) {
|
|
const docs = this.documents.get(collectionId) || [];
|
|
return {
|
|
documents: docs.filter(doc => doc.userId === this.currentUserId),
|
|
total: docs.length
|
|
};
|
|
}
|
|
|
|
clearAllDocuments() {
|
|
this.documents.clear();
|
|
}
|
|
}
|
|
|
|
// Initialize services
|
|
const mockAppWriteManager = new MockAppWriteManager();
|
|
const legacyManagers = {
|
|
enhancedStorage: new EnhancedStorageManager(),
|
|
blacklistStorage: new BlacklistStorageManager(),
|
|
settingsManager: new SettingsPanelManager(),
|
|
productStorage: new ProductStorageManager()
|
|
};
|
|
const migrationService = new MigrationService(mockAppWriteManager, legacyManagers);
|
|
|
|
// Make functions available globally
|
|
window.setupTestData = setupTestData;
|
|
window.clearTestData = clearTestData;
|
|
window.testDetection = testDetection;
|
|
window.testMigration = testMigration;
|
|
window.checkStatus = checkStatus;
|
|
window.testErrorHandling = testErrorHandling;
|
|
|
|
function updateStatus(elementId, content, className = '') {
|
|
const element = document.getElementById(elementId);
|
|
element.innerHTML = content;
|
|
element.className = className;
|
|
}
|
|
|
|
function setupTestData() {
|
|
try {
|
|
// Setup enhanced items
|
|
const enhancedItems = [
|
|
{
|
|
id: 'item1',
|
|
amazonUrl: 'https://amazon.de/dp/item1',
|
|
originalTitle: 'Test Product 1',
|
|
customTitle: 'Enhanced Test Product 1',
|
|
price: '29.99',
|
|
currency: 'EUR',
|
|
createdAt: new Date().toISOString()
|
|
},
|
|
{
|
|
id: 'item2',
|
|
amazonUrl: 'https://amazon.de/dp/item2',
|
|
originalTitle: 'Test Product 2',
|
|
customTitle: 'Enhanced Test Product 2',
|
|
price: '49.99',
|
|
currency: 'EUR',
|
|
createdAt: new Date().toISOString()
|
|
}
|
|
];
|
|
localStorage.setItem('amazon-ext-enhanced-items', JSON.stringify(enhancedItems));
|
|
|
|
// Setup blacklisted brands
|
|
const blacklistedBrands = [
|
|
{
|
|
id: 'brand1',
|
|
name: 'Test Brand 1',
|
|
addedAt: new Date().toISOString()
|
|
},
|
|
{
|
|
id: 'brand2',
|
|
name: 'Test Brand 2',
|
|
addedAt: new Date().toISOString()
|
|
}
|
|
];
|
|
localStorage.setItem('amazon_ext_blacklist', JSON.stringify(blacklistedBrands));
|
|
|
|
// Setup settings
|
|
const settings = {
|
|
mistralApiKey: 'test-api-key-123',
|
|
autoExtractEnabled: false,
|
|
defaultTitleSelection: 'original',
|
|
maxRetries: 5,
|
|
timeoutSeconds: 15,
|
|
updatedAt: new Date().toISOString()
|
|
};
|
|
localStorage.setItem('amazon-ext-enhanced-settings', JSON.stringify(settings));
|
|
|
|
updateStatus('setup-status',
|
|
'<div class="status">✅ Test data setup complete!</div>' +
|
|
'<ul>' +
|
|
'<li>2 Enhanced Items</li>' +
|
|
'<li>2 Blacklisted Brands</li>' +
|
|
'<li>Custom Settings</li>' +
|
|
'</ul>', 'success');
|
|
|
|
} catch (error) {
|
|
updateStatus('setup-status',
|
|
`<div class="status">❌ Setup failed: ${error.message}</div>`, 'error');
|
|
}
|
|
}
|
|
|
|
function clearTestData() {
|
|
localStorage.removeItem('amazon-ext-enhanced-items');
|
|
localStorage.removeItem('amazon_ext_blacklist');
|
|
localStorage.removeItem('amazon-ext-enhanced-settings');
|
|
localStorage.removeItem('amazon-ext-migration-status');
|
|
localStorage.removeItem('amazon-ext-migration-backup');
|
|
mockAppWriteManager.clearAllDocuments();
|
|
|
|
updateStatus('setup-status',
|
|
'<div class="status">🧹 All test data cleared</div>', 'info');
|
|
}
|
|
|
|
async function testDetection() {
|
|
try {
|
|
updateStatus('detection-results', '<div class="status">🔍 Detecting data...</div>', 'info');
|
|
|
|
const detection = await migrationService.detectExistingData();
|
|
|
|
let resultHtml = `<div class="status">✅ Detection complete</div>`;
|
|
resultHtml += `<pre>${JSON.stringify(detection, null, 2)}</pre>`;
|
|
|
|
updateStatus('detection-results', resultHtml, 'success');
|
|
|
|
} catch (error) {
|
|
updateStatus('detection-results',
|
|
`<div class="status">❌ Detection failed: ${error.message}</div>`, 'error');
|
|
}
|
|
}
|
|
|
|
async function testMigration() {
|
|
try {
|
|
const migrateBtn = document.getElementById('migrate-btn');
|
|
migrateBtn.disabled = true;
|
|
migrateBtn.textContent = 'Migrating...';
|
|
|
|
updateStatus('migration-results', '<div class="status">🚀 Starting migration...</div>', 'info');
|
|
|
|
const result = await migrationService.migrateAllData();
|
|
|
|
let resultHtml = `<div class="status">${result.success ? '✅' : '❌'} Migration ${result.success ? 'completed' : 'failed'}</div>`;
|
|
resultHtml += `<p><strong>Message:</strong> ${result.message}</p>`;
|
|
|
|
if (result.results) {
|
|
resultHtml += '<h4>Migration Results:</h4>';
|
|
resultHtml += `<pre>${JSON.stringify(result.results, null, 2)}</pre>`;
|
|
}
|
|
|
|
updateStatus('migration-results', resultHtml, result.success ? 'success' : 'error');
|
|
|
|
} catch (error) {
|
|
updateStatus('migration-results',
|
|
`<div class="status">❌ Migration failed: ${error.message}</div>`, 'error');
|
|
} finally {
|
|
const migrateBtn = document.getElementById('migrate-btn');
|
|
migrateBtn.disabled = false;
|
|
migrateBtn.textContent = 'Test Migration Process';
|
|
}
|
|
}
|
|
|
|
async function checkStatus() {
|
|
try {
|
|
updateStatus('status-results', '<div class="status">📊 Checking status...</div>', 'info');
|
|
|
|
const status = await migrationService.getMigrationStatus();
|
|
|
|
let resultHtml = `<div class="status">📋 Migration Status</div>`;
|
|
resultHtml += `<pre>${JSON.stringify(status, null, 2)}</pre>`;
|
|
|
|
updateStatus('status-results', resultHtml, 'success');
|
|
|
|
} catch (error) {
|
|
updateStatus('status-results',
|
|
`<div class="status">❌ Status check failed: ${error.message}</div>`, 'error');
|
|
}
|
|
}
|
|
|
|
async function testErrorHandling() {
|
|
try {
|
|
updateStatus('error-results', '<div class="status">🧪 Testing error scenarios...</div>', 'info');
|
|
|
|
// Test error info generation
|
|
const authError = new Error('User unauthorized');
|
|
const authErrorInfo = migrationService.getDetailedErrorInfo(authError);
|
|
|
|
const networkError = new Error('Network timeout');
|
|
const networkErrorInfo = migrationService.getDetailedErrorInfo(networkError);
|
|
|
|
const storageError = new Error('Storage quota exceeded');
|
|
const storageErrorInfo = migrationService.getDetailedErrorInfo(storageError);
|
|
|
|
let resultHtml = '<div class="status">✅ Error handling tests complete</div>';
|
|
resultHtml += '<h4>Authentication Error:</h4>';
|
|
resultHtml += `<pre>${JSON.stringify(authErrorInfo, null, 2)}</pre>`;
|
|
resultHtml += '<h4>Network Error:</h4>';
|
|
resultHtml += `<pre>${JSON.stringify(networkErrorInfo, null, 2)}</pre>`;
|
|
resultHtml += '<h4>Storage Error:</h4>';
|
|
resultHtml += `<pre>${JSON.stringify(storageErrorInfo, null, 2)}</pre>`;
|
|
|
|
updateStatus('error-results', resultHtml, 'success');
|
|
|
|
} catch (error) {
|
|
updateStatus('error-results',
|
|
`<div class="status">❌ Error handling test failed: ${error.message}</div>`, 'error');
|
|
}
|
|
}
|
|
|
|
// Initialize page
|
|
updateStatus('setup-status', '<div class="status">Ready to test Migration Service</div>', 'info');
|
|
</script>
|
|
</body>
|
|
</html> |