Kenso Grimm
216a972fef
- 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
338 lines
13 KiB
HTML
338 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>AppWrite Error Handling Test</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
background-color: #f5f5f5;
|
|
}
|
|
.test-section {
|
|
background: white;
|
|
padding: 20px;
|
|
margin: 20px 0;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
.test-button {
|
|
background: #007cba;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
}
|
|
.test-button:hover {
|
|
background: #005a87;
|
|
}
|
|
.result {
|
|
margin-top: 10px;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
font-family: monospace;
|
|
white-space: pre-wrap;
|
|
}
|
|
.success {
|
|
background: #d4edda;
|
|
border: 1px solid #c3e6cb;
|
|
color: #155724;
|
|
}
|
|
.error {
|
|
background: #f8d7da;
|
|
border: 1px solid #f5c6cb;
|
|
color: #721c24;
|
|
}
|
|
.info {
|
|
background: #d1ecf1;
|
|
border: 1px solid #bee5eb;
|
|
color: #0c5460;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>AppWrite Error Handling Test</h1>
|
|
<p>Testing the enhanced ErrorHandler with AppWrite-specific error handling capabilities.</p>
|
|
|
|
<div class="test-section">
|
|
<h2>AppWrite Unavailability Fallback</h2>
|
|
<button class="test-button" onclick="testAppWriteUnavailability()">Test AppWrite Unavailable</button>
|
|
<div id="appwrite-unavailable-result" class="result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Authentication Expiry Handling</h2>
|
|
<button class="test-button" onclick="testAuthenticationExpiry()">Test Auth Expiry</button>
|
|
<div id="auth-expiry-result" class="result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Rate Limiting with Exponential Backoff</h2>
|
|
<button class="test-button" onclick="testRateLimiting()">Test Rate Limiting</button>
|
|
<div id="rate-limiting-result" class="result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Data Corruption Detection and Recovery</h2>
|
|
<button class="test-button" onclick="testDataCorruption()">Test Data Corruption</button>
|
|
<div id="data-corruption-result" class="result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>AppWrite Fallback Execution</h2>
|
|
<button class="test-button" onclick="testAppWriteFallbackExecution()">Test Fallback Execution</button>
|
|
<div id="fallback-execution-result" class="result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Error Status Monitoring</h2>
|
|
<button class="test-button" onclick="testErrorStatusMonitoring()">Test Status Monitoring</button>
|
|
<div id="status-monitoring-result" class="result"></div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
import { ErrorHandler } from './src/ErrorHandler.js';
|
|
|
|
// Create ErrorHandler instance for testing
|
|
window.errorHandler = new ErrorHandler();
|
|
|
|
// Mock event bus for testing
|
|
window.amazonExtEventBus = {
|
|
emit: function(event, data) {
|
|
console.log('Event emitted:', event, data);
|
|
}
|
|
};
|
|
|
|
// Test AppWrite unavailability fallback
|
|
window.testAppWriteUnavailability = async function() {
|
|
const resultDiv = document.getElementById('appwrite-unavailable-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing AppWrite unavailability fallback...';
|
|
|
|
try {
|
|
// Simulate AppWrite unavailable error
|
|
const appWriteError = new Error('Server Error: AppWrite service unavailable');
|
|
appWriteError.code = 500;
|
|
|
|
const operation = {
|
|
type: 'saveEnhancedItem',
|
|
data: {
|
|
itemId: 'test-item-123',
|
|
title: 'Test Product',
|
|
price: '29.99'
|
|
}
|
|
};
|
|
|
|
const result = await window.errorHandler.handleAppWriteUnavailabilityFallback(operation, appWriteError);
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ AppWrite fallback test passed:\n${JSON.stringify(result, null, 2)}`;
|
|
|
|
// Test status check
|
|
const status = window.errorHandler.getAppWriteStatus();
|
|
resultDiv.textContent += `\n\nAppWrite Status:\n${JSON.stringify(status, null, 2)}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ AppWrite fallback test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test authentication expiry handling
|
|
window.testAuthenticationExpiry = function() {
|
|
const resultDiv = document.getElementById('auth-expiry-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing authentication expiry handling...';
|
|
|
|
try {
|
|
// Simulate authentication expired error
|
|
const authError = new Error('Unauthorized: Session expired');
|
|
authError.code = 401;
|
|
|
|
const result = window.errorHandler.handleAuthenticationExpiry(authError, {
|
|
component: 'AppWriteManager',
|
|
operation: 'getUserDocuments'
|
|
});
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ Authentication expiry test passed:\n${JSON.stringify(result, null, 2)}`;
|
|
|
|
// Test status check
|
|
const isExpired = window.errorHandler.isAuthenticationExpired();
|
|
resultDiv.textContent += `\n\nAuthentication Expired: ${isExpired}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ Authentication expiry test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test rate limiting handling
|
|
window.testRateLimiting = function() {
|
|
const resultDiv = document.getElementById('rate-limiting-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing rate limiting handling...';
|
|
|
|
try {
|
|
// Simulate rate limit error
|
|
const rateLimitError = new Error('Too Many Requests: Rate limit exceeded');
|
|
rateLimitError.code = 429;
|
|
|
|
const result = window.errorHandler.handleRateLimiting(rateLimitError, 30, {
|
|
component: 'AppWriteManager',
|
|
operation: 'createDocument'
|
|
});
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ Rate limiting test passed:\n${JSON.stringify(result, null, 2)}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ Rate limiting test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test data corruption handling
|
|
window.testDataCorruption = async function() {
|
|
const resultDiv = document.getElementById('data-corruption-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing data corruption detection and recovery...';
|
|
|
|
try {
|
|
// Simulate corrupted enhanced item data
|
|
const corruptedData = {
|
|
itemId: 'corrupted-item',
|
|
// Missing required fields to simulate corruption
|
|
price: null,
|
|
currency: undefined
|
|
};
|
|
|
|
const result = await window.errorHandler.handleDataCorruption(
|
|
corruptedData,
|
|
'enhanced-item',
|
|
{ component: 'EnhancedStorageManager' }
|
|
);
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ Data corruption test passed:\n${JSON.stringify(result, null, 2)}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ Data corruption test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test AppWrite fallback execution
|
|
window.testAppWriteFallbackExecution = async function() {
|
|
const resultDiv = document.getElementById('fallback-execution-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing AppWrite fallback execution...';
|
|
|
|
try {
|
|
// Mock AppWrite operation that fails
|
|
const appWriteOperation = async () => {
|
|
const error = new Error('Network Error: Connection refused');
|
|
error.code = 500;
|
|
throw error;
|
|
};
|
|
|
|
// Mock localStorage fallback operation
|
|
const localStorageOperation = async () => {
|
|
return {
|
|
id: 'fallback-item-123',
|
|
title: 'Fallback Saved Item',
|
|
savedAt: new Date().toISOString()
|
|
};
|
|
};
|
|
|
|
const operationContext = {
|
|
type: 'saveEnhancedItem',
|
|
data: {
|
|
title: 'Test Item',
|
|
price: '19.99'
|
|
}
|
|
};
|
|
|
|
const result = await window.errorHandler.executeWithAppWriteFallback(
|
|
appWriteOperation,
|
|
localStorageOperation,
|
|
operationContext
|
|
);
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ Fallback execution test passed:\n${JSON.stringify(result, null, 2)}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ Fallback execution test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test error status monitoring
|
|
window.testErrorStatusMonitoring = function() {
|
|
const resultDiv = document.getElementById('status-monitoring-result');
|
|
resultDiv.className = 'result info';
|
|
resultDiv.textContent = 'Testing error status monitoring...';
|
|
|
|
try {
|
|
// Get current status
|
|
const status = window.errorHandler.getAppWriteStatus();
|
|
|
|
// Test individual status checks
|
|
const isAppWriteUnavailable = window.errorHandler.isAppWriteUnavailable();
|
|
const isUsingFallback = window.errorHandler.isUsingLocalStorageFallback();
|
|
const isAuthExpired = window.errorHandler.isAuthenticationExpired();
|
|
|
|
const statusInfo = {
|
|
appWriteStatus: status,
|
|
isAppWriteUnavailable,
|
|
isUsingFallback,
|
|
isAuthExpired
|
|
};
|
|
|
|
resultDiv.className = 'result success';
|
|
resultDiv.textContent = `✓ Status monitoring test passed:\n${JSON.stringify(statusInfo, null, 2)}`;
|
|
|
|
// Test reset functionality
|
|
window.errorHandler.resetAuthenticationExpiredState();
|
|
const afterReset = window.errorHandler.isAuthenticationExpired();
|
|
resultDiv.textContent += `\n\nAfter reset - Auth Expired: ${afterReset}`;
|
|
|
|
} catch (error) {
|
|
resultDiv.className = 'result error';
|
|
resultDiv.textContent = `✗ Status monitoring test failed: ${error.message}`;
|
|
}
|
|
};
|
|
|
|
// Test German error messages
|
|
function testGermanErrorMessages() {
|
|
console.log('Testing German error messages...');
|
|
|
|
const testErrors = [
|
|
{ type: 'appwrite_unavailable', message: 'AppWrite service unavailable' },
|
|
{ type: 'authentication_expired', message: 'Session expired' },
|
|
{ type: 'rate_limited', message: 'Too many requests' },
|
|
{ type: 'data_corruption', message: 'Data corruption detected' }
|
|
];
|
|
|
|
testErrors.forEach(({ type, message }) => {
|
|
const error = new Error(message);
|
|
const processed = window.errorHandler.handleError(error, { component: 'Test' });
|
|
const userFriendly = window.errorHandler.getUserFriendlyError(processed);
|
|
console.log(`${type}:`, userFriendly);
|
|
});
|
|
}
|
|
|
|
// Run German message test on load
|
|
testGermanErrorMessages();
|
|
|
|
console.log('AppWrite Error Handling Test page loaded successfully');
|
|
console.log('ErrorHandler instance:', window.errorHandler);
|
|
</script>
|
|
</body>
|
|
</html> |