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
655 lines
26 KiB
HTML
655 lines
26 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Enhanced Workflow Debug Test</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
padding: 20px;
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
.test-container {
|
|
max-width: 1000px;
|
|
margin: 0 auto;
|
|
background: white;
|
|
border-radius: 12px;
|
|
padding: 2rem;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
|
|
}
|
|
|
|
.debug-section {
|
|
margin: 2rem 0;
|
|
padding: 1.5rem;
|
|
background: #f8f9fa;
|
|
border-radius: 8px;
|
|
border: 1px solid #dee2e6;
|
|
}
|
|
|
|
.error-log {
|
|
background: #fff3cd;
|
|
border: 1px solid #ffeaa7;
|
|
border-radius: 8px;
|
|
padding: 1rem;
|
|
margin: 1rem 0;
|
|
font-family: monospace;
|
|
font-size: 0.9rem;
|
|
white-space: pre-wrap;
|
|
max-height: 300px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.test-button {
|
|
background: #ff9900;
|
|
color: white;
|
|
border: none;
|
|
padding: 12px 24px;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
margin: 0.5rem;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.test-button:hover {
|
|
background: #ff7700;
|
|
}
|
|
|
|
.test-button:disabled {
|
|
background: #ccc;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.workflow-container {
|
|
border: 2px solid #007bff;
|
|
border-radius: 8px;
|
|
padding: 1rem;
|
|
margin: 1rem 0;
|
|
min-height: 300px;
|
|
background: white;
|
|
}
|
|
|
|
.status-indicator {
|
|
display: inline-block;
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 50%;
|
|
margin-right: 0.5rem;
|
|
}
|
|
|
|
.status-success { background: #28a745; }
|
|
.status-error { background: #dc3545; }
|
|
.status-warning { background: #ffc107; }
|
|
.status-info { background: #17a2b8; }
|
|
|
|
.progress-step {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0.5rem;
|
|
margin: 0.25rem 0;
|
|
border-radius: 4px;
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.progress-step.active {
|
|
background: #fff3cd;
|
|
border-left: 4px solid #ffc107;
|
|
}
|
|
|
|
.progress-step.completed {
|
|
background: #d4edda;
|
|
border-left: 4px solid #28a745;
|
|
}
|
|
|
|
.progress-step.error {
|
|
background: #f8d7da;
|
|
border-left: 4px solid #dc3545;
|
|
}
|
|
|
|
.title-selection-container {
|
|
border: 2px solid #28a745;
|
|
border-radius: 8px;
|
|
padding: 1rem;
|
|
margin: 1rem 0;
|
|
background: #f8fff8;
|
|
}
|
|
|
|
.title-option {
|
|
border: 1px solid #ddd;
|
|
border-radius: 6px;
|
|
padding: 1rem;
|
|
margin: 0.5rem 0;
|
|
cursor: pointer;
|
|
transition: all 0.2s ease;
|
|
background: white;
|
|
}
|
|
|
|
.title-option:hover {
|
|
border-color: #ff9900;
|
|
box-shadow: 0 2px 8px rgba(255, 153, 0, 0.2);
|
|
}
|
|
|
|
.title-option.selected {
|
|
border-color: #28a745;
|
|
background: #f8fff8;
|
|
box-shadow: 0 2px 8px rgba(40, 167, 69, 0.2);
|
|
}
|
|
|
|
.title-option.disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
background: #f5f5f5;
|
|
}
|
|
|
|
.option-label {
|
|
font-weight: bold;
|
|
color: #666;
|
|
font-size: 0.9rem;
|
|
display: block;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.option-text {
|
|
color: #333;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.selection-actions {
|
|
display: flex;
|
|
gap: 1rem;
|
|
margin-top: 1rem;
|
|
justify-content: center;
|
|
}
|
|
|
|
.confirm-selection-btn, .skip-ai-btn {
|
|
padding: 10px 20px;
|
|
border: none;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.confirm-selection-btn {
|
|
background: #28a745;
|
|
color: white;
|
|
}
|
|
|
|
.confirm-selection-btn:hover {
|
|
background: #218838;
|
|
}
|
|
|
|
.skip-ai-btn {
|
|
background: #6c757d;
|
|
color: white;
|
|
}
|
|
|
|
.skip-ai-btn:hover {
|
|
background: #5a6268;
|
|
}
|
|
|
|
.manual-input-form {
|
|
border: 2px solid #ffc107;
|
|
border-radius: 8px;
|
|
padding: 1.5rem;
|
|
margin: 1rem 0;
|
|
background: #fffbf0;
|
|
}
|
|
|
|
.form-field {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.form-field label {
|
|
display: block;
|
|
margin-bottom: 0.5rem;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
.form-field input, .form-field select {
|
|
width: 100%;
|
|
padding: 0.75rem;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.form-field input:focus, .form-field select:focus {
|
|
outline: none;
|
|
border-color: #ff9900;
|
|
box-shadow: 0 0 0 2px rgba(255, 153, 0, 0.2);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="test-container">
|
|
<h1>🔧 Enhanced Workflow Debug Test</h1>
|
|
|
|
<div class="debug-section">
|
|
<h3>Problem Diagnosis</h3>
|
|
<p>Dieser Test hilft dabei, den "Unerwarteter Fehler beim Erstellen des Enhanced Items" zu diagnostizieren und zu beheben.</p>
|
|
<p><strong>Fokus:</strong> Titel-Auswahl-Schritt (✏️) im Enhanced Item Workflow</p>
|
|
</div>
|
|
|
|
<div class="debug-section">
|
|
<h3>Test Scenarios</h3>
|
|
<button class="test-button" onclick="testTitleSelectionOnly()">Test Title Selection UI</button>
|
|
<button class="test-button" onclick="testCompleteWorkflow()">Test Complete Workflow</button>
|
|
<button class="test-button" onclick="testErrorScenarios()">Test Error Scenarios</button>
|
|
<button class="test-button" onclick="testManualFallback()">Test Manual Fallback</button>
|
|
<button class="test-button" onclick="clearAll()">Clear All</button>
|
|
</div>
|
|
|
|
<div class="workflow-container" id="workflowContainer">
|
|
<h4>🚀 Workflow Test Area</h4>
|
|
<p>Hier wird der Enhanced Item Workflow getestet...</p>
|
|
</div>
|
|
|
|
<div class="debug-section">
|
|
<h3>📊 Progress Tracking</h3>
|
|
<div id="progressContainer">
|
|
<div class="progress-step" data-step="validate">
|
|
<span class="status-indicator status-info"></span>
|
|
<span>🔍 URL validieren</span>
|
|
</div>
|
|
<div class="progress-step" data-step="extract">
|
|
<span class="status-indicator status-info"></span>
|
|
<span>📦 Produktdaten extrahieren</span>
|
|
</div>
|
|
<div class="progress-step" data-step="ai">
|
|
<span class="status-indicator status-info"></span>
|
|
<span>🤖 KI-Titelvorschläge generieren</span>
|
|
</div>
|
|
<div class="progress-step" data-step="select">
|
|
<span class="status-indicator status-info"></span>
|
|
<span>✏️ Titel auswählen</span>
|
|
</div>
|
|
<div class="progress-step" data-step="save">
|
|
<span class="status-indicator status-info"></span>
|
|
<span>💾 Item speichern</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="debug-section">
|
|
<h3>🐛 Error Log</h3>
|
|
<div class="error-log" id="errorLog">Keine Fehler bisher...</div>
|
|
</div>
|
|
|
|
<div class="debug-section">
|
|
<h3>📝 Console Output</h3>
|
|
<div class="error-log" id="consoleOutput">Console-Ausgaben werden hier angezeigt...</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
// Mock environment setup
|
|
const mockStorage = {
|
|
data: {},
|
|
getItem(key) { return this.data[key] || null; },
|
|
setItem(key, value) { this.data[key] = value; },
|
|
removeItem(key) { delete this.data[key]; },
|
|
clear() { this.data = {}; }
|
|
};
|
|
|
|
if (typeof localStorage === 'undefined') {
|
|
window.localStorage = mockStorage;
|
|
}
|
|
|
|
// Mock event bus
|
|
window.amazonExtEventBus = {
|
|
events: {},
|
|
emit(event, data) {
|
|
console.log('Event emitted:', event, data);
|
|
if (this.events[event]) {
|
|
this.events[event].forEach(callback => callback(data));
|
|
}
|
|
},
|
|
on(event, callback) {
|
|
if (!this.events[event]) this.events[event] = [];
|
|
this.events[event].push(callback);
|
|
}
|
|
};
|
|
|
|
// Console capture
|
|
const originalConsole = {
|
|
log: console.log,
|
|
error: console.error,
|
|
warn: console.warn
|
|
};
|
|
|
|
function logToOutput(type, ...args) {
|
|
const output = document.getElementById('consoleOutput');
|
|
const timestamp = new Date().toLocaleTimeString();
|
|
const message = args.map(arg =>
|
|
typeof arg === 'object' ? JSON.stringify(arg, null, 2) : String(arg)
|
|
).join(' ');
|
|
|
|
output.textContent += `[${timestamp}] ${type.toUpperCase()}: ${message}\n`;
|
|
output.scrollTop = output.scrollHeight;
|
|
}
|
|
|
|
console.log = (...args) => {
|
|
originalConsole.log(...args);
|
|
logToOutput('log', ...args);
|
|
};
|
|
|
|
console.error = (...args) => {
|
|
originalConsole.error(...args);
|
|
logToOutput('error', ...args);
|
|
|
|
const errorLog = document.getElementById('errorLog');
|
|
const timestamp = new Date().toLocaleTimeString();
|
|
const message = args.map(arg =>
|
|
typeof arg === 'object' ? JSON.stringify(arg, null, 2) : String(arg)
|
|
).join(' ');
|
|
errorLog.textContent += `[${timestamp}] ERROR: ${message}\n`;
|
|
};
|
|
|
|
console.warn = (...args) => {
|
|
originalConsole.warn(...args);
|
|
logToOutput('warn', ...args);
|
|
};
|
|
|
|
// Load modules
|
|
let TitleSelectionManager, EnhancedAddItemWorkflow, ErrorHandler;
|
|
|
|
try {
|
|
const modules = await Promise.all([
|
|
import('./src/TitleSelectionManager.js'),
|
|
import('./src/EnhancedAddItemWorkflow.js'),
|
|
import('./src/ErrorHandler.js')
|
|
]);
|
|
|
|
TitleSelectionManager = modules[0].TitleSelectionManager;
|
|
EnhancedAddItemWorkflow = modules[1].EnhancedAddItemWorkflow;
|
|
ErrorHandler = modules[2].errorHandler;
|
|
|
|
console.log('✅ All modules loaded successfully');
|
|
} catch (error) {
|
|
console.error('❌ Failed to load modules:', error);
|
|
}
|
|
|
|
// Progress tracking
|
|
function updateProgress(stepId, status) {
|
|
const step = document.querySelector(`[data-step="${stepId}"]`);
|
|
if (step) {
|
|
step.className = `progress-step ${status}`;
|
|
const indicator = step.querySelector('.status-indicator');
|
|
indicator.className = `status-indicator status-${status === 'completed' ? 'success' : status === 'error' ? 'error' : status === 'active' ? 'warning' : 'info'}`;
|
|
}
|
|
}
|
|
|
|
// Test functions
|
|
window.testTitleSelectionOnly = async function() {
|
|
console.log('=== Testing Title Selection UI Only ===');
|
|
|
|
try {
|
|
const container = document.getElementById('workflowContainer');
|
|
container.innerHTML = '<h4>🎯 Title Selection Test</h4>';
|
|
|
|
const titleManager = new TitleSelectionManager();
|
|
|
|
// Mock data
|
|
const suggestions = [
|
|
'ROCKBROS Fahrradhandschuhe - Premium Qualität',
|
|
'Hochwertige Fahrradhandschuhe von ROCKBROS',
|
|
'ROCKBROS Handschuhe für Radfahrer'
|
|
];
|
|
const originalTitle = 'ROCKBROS Fahrradhandschuhe Herren Damen Halbfinger MTB Handschuhe Rutschfest Atmungsaktiv für Rennrad Mountainbike';
|
|
|
|
console.log('Creating selection UI...');
|
|
const selectionUI = titleManager.createSelectionUI(suggestions, originalTitle);
|
|
container.appendChild(selectionUI);
|
|
|
|
// Set up callback
|
|
titleManager.onTitleSelected((selectedTitle) => {
|
|
console.log('✅ Title selected successfully:', selectedTitle);
|
|
|
|
const result = document.createElement('div');
|
|
result.innerHTML = `
|
|
<div style="background: #d4edda; border: 1px solid #c3e6cb; border-radius: 6px; padding: 1rem; margin: 1rem 0;">
|
|
<h5 style="color: #155724; margin: 0 0 0.5rem 0;">✅ Titel erfolgreich ausgewählt!</h5>
|
|
<p style="margin: 0; color: #155724;"><strong>Ausgewählter Titel:</strong> ${selectedTitle}</p>
|
|
</div>
|
|
`;
|
|
container.appendChild(result);
|
|
});
|
|
|
|
// Show UI
|
|
console.log('Showing selection UI...');
|
|
titleManager.showTitleSelection(selectionUI);
|
|
|
|
console.log('✅ Title selection UI test completed successfully');
|
|
|
|
} catch (error) {
|
|
console.error('❌ Title selection test failed:', error);
|
|
}
|
|
};
|
|
|
|
window.testCompleteWorkflow = async function() {
|
|
console.log('=== Testing Complete Enhanced Workflow ===');
|
|
|
|
try {
|
|
const container = document.getElementById('workflowContainer');
|
|
container.innerHTML = '<h4>🚀 Complete Workflow Test</h4>';
|
|
|
|
// Reset progress
|
|
['validate', 'extract', 'ai', 'select', 'save'].forEach(step => {
|
|
updateProgress(step, 'pending');
|
|
});
|
|
|
|
const workflow = new EnhancedAddItemWorkflow();
|
|
const testUrl = 'https://www.amazon.de/dp/B08XYZABC123';
|
|
|
|
// Set up callbacks
|
|
workflow.onProgress((progress) => {
|
|
console.log('📊 Workflow progress:', progress);
|
|
updateProgress(progress.stepId, progress.status);
|
|
|
|
const progressDiv = container.querySelector('.workflow-progress') || document.createElement('div');
|
|
progressDiv.className = 'workflow-progress';
|
|
progressDiv.innerHTML = `
|
|
<p><strong>Current Step:</strong> ${progress.currentStep?.name || 'Unknown'}</p>
|
|
<p><strong>Progress:</strong> ${progress.progress}%</p>
|
|
`;
|
|
if (!container.querySelector('.workflow-progress')) {
|
|
container.appendChild(progressDiv);
|
|
}
|
|
});
|
|
|
|
workflow.onError((error) => {
|
|
console.error('❌ Workflow error:', error);
|
|
updateProgress(error.step, 'error');
|
|
|
|
const errorDiv = document.createElement('div');
|
|
errorDiv.innerHTML = `
|
|
<div style="background: #f8d7da; border: 1px solid #f5c6cb; border-radius: 6px; padding: 1rem; margin: 1rem 0;">
|
|
<h5 style="color: #721c24; margin: 0 0 0.5rem 0;">❌ Workflow Error</h5>
|
|
<p style="margin: 0; color: #721c24;"><strong>Step:</strong> ${error.step}</p>
|
|
<p style="margin: 0; color: #721c24;"><strong>Error:</strong> ${error.error}</p>
|
|
</div>
|
|
`;
|
|
container.appendChild(errorDiv);
|
|
});
|
|
|
|
workflow.onManualInput((result) => {
|
|
console.log('⚠️ Manual input required:', result);
|
|
|
|
const manualDiv = document.createElement('div');
|
|
manualDiv.innerHTML = `
|
|
<div style="background: #fff3cd; border: 1px solid #ffeaa7; border-radius: 6px; padding: 1rem; margin: 1rem 0;">
|
|
<h5 style="color: #856404; margin: 0 0 0.5rem 0;">⚠️ Manual Input Required</h5>
|
|
<p style="margin: 0; color: #856404;"><strong>Reason:</strong> ${result.error}</p>
|
|
<button onclick="handleManualInput()" style="margin-top: 0.5rem; padding: 8px 16px; background: #ffc107; border: none; border-radius: 4px; cursor: pointer;">Provide Manual Input</button>
|
|
</div>
|
|
`;
|
|
container.appendChild(manualDiv);
|
|
});
|
|
|
|
workflow.onComplete((result) => {
|
|
console.log('✅ Workflow completed:', result);
|
|
|
|
const completeDiv = document.createElement('div');
|
|
completeDiv.innerHTML = `
|
|
<div style="background: #d4edda; border: 1px solid #c3e6cb; border-radius: 6px; padding: 1rem; margin: 1rem 0;">
|
|
<h5 style="color: #155724; margin: 0 0 0.5rem 0;">✅ Workflow Completed Successfully!</h5>
|
|
<p style="margin: 0; color: #155724;"><strong>Duration:</strong> ${result.duration}ms</p>
|
|
<p style="margin: 0; color: #155724;"><strong>Steps Completed:</strong> ${result.stepsCompleted}/5</p>
|
|
</div>
|
|
`;
|
|
container.appendChild(completeDiv);
|
|
});
|
|
|
|
// Start workflow
|
|
console.log('🚀 Starting workflow...');
|
|
const result = await workflow.startWorkflow(testUrl, {
|
|
container: container,
|
|
allowManualFallback: true,
|
|
settings: {
|
|
mistralApiKey: '', // Empty to test fallback
|
|
timeoutSeconds: 5
|
|
}
|
|
});
|
|
|
|
console.log('📋 Final workflow result:', result);
|
|
|
|
} catch (error) {
|
|
console.error('❌ Complete workflow test failed:', error);
|
|
}
|
|
};
|
|
|
|
window.testErrorScenarios = function() {
|
|
console.log('=== Testing Error Scenarios ===');
|
|
|
|
const container = document.getElementById('workflowContainer');
|
|
container.innerHTML = '<h4>🐛 Error Scenarios Test</h4>';
|
|
|
|
// Test various error conditions
|
|
const errorScenarios = [
|
|
{
|
|
name: 'Null Container Error',
|
|
test: () => {
|
|
const titleManager = new TitleSelectionManager();
|
|
const ui = titleManager.createSelectionUI(['Test'], 'Original');
|
|
titleManager.showTitleSelection(null); // This should not crash
|
|
}
|
|
},
|
|
{
|
|
name: 'Invalid Suggestions Error',
|
|
test: () => {
|
|
const titleManager = new TitleSelectionManager();
|
|
const ui = titleManager.createSelectionUI(null, null); // This should handle gracefully
|
|
container.appendChild(ui);
|
|
}
|
|
},
|
|
{
|
|
name: 'Missing InteractivityEnhancer Error',
|
|
test: () => {
|
|
const titleManager = new TitleSelectionManager();
|
|
titleManager.interactivityEnhancer = null; // Simulate missing enhancer
|
|
const ui = titleManager.createSelectionUI(['Test'], 'Original');
|
|
container.appendChild(ui);
|
|
titleManager.showTitleSelection(ui);
|
|
}
|
|
}
|
|
];
|
|
|
|
errorScenarios.forEach((scenario, index) => {
|
|
try {
|
|
console.log(`Testing: ${scenario.name}`);
|
|
scenario.test();
|
|
console.log(`✅ ${scenario.name} handled gracefully`);
|
|
} catch (error) {
|
|
console.error(`❌ ${scenario.name} failed:`, error);
|
|
}
|
|
});
|
|
};
|
|
|
|
window.testManualFallback = function() {
|
|
console.log('=== Testing Manual Fallback ===');
|
|
|
|
const container = document.getElementById('workflowContainer');
|
|
container.innerHTML = '<h4>📝 Manual Fallback Test</h4>';
|
|
|
|
// Create mock manual input form
|
|
const manualForm = document.createElement('div');
|
|
manualForm.className = 'manual-input-form';
|
|
manualForm.innerHTML = `
|
|
<h5>Manual Product Input</h5>
|
|
<div class="form-field">
|
|
<label for="manual-url">Amazon-URL:</label>
|
|
<input type="url" id="manual-url" value="https://amazon.de/dp/B08N5WRWNW" required>
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="manual-title">Produkttitel:</label>
|
|
<input type="text" id="manual-title" value="ROCKBROS Fahrradhandschuhe" required>
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="manual-price">Preis:</label>
|
|
<input type="text" id="manual-price" value="29,99">
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="manual-currency">Währung:</label>
|
|
<select id="manual-currency">
|
|
<option value="EUR">EUR (€)</option>
|
|
<option value="USD">USD ($)</option>
|
|
</select>
|
|
</div>
|
|
<div style="margin-top: 1rem;">
|
|
<button onclick="submitManualData()" style="background: #28a745; color: white; border: none; padding: 10px 20px; border-radius: 4px; cursor: pointer; margin-right: 0.5rem;">Save Item</button>
|
|
<button onclick="cancelManualInput()" style="background: #6c757d; color: white; border: none; padding: 10px 20px; border-radius: 4px; cursor: pointer;">Cancel</button>
|
|
</div>
|
|
`;
|
|
|
|
container.appendChild(manualForm);
|
|
console.log('✅ Manual fallback form created');
|
|
};
|
|
|
|
window.submitManualData = function() {
|
|
const url = document.getElementById('manual-url').value;
|
|
const title = document.getElementById('manual-title').value;
|
|
const price = document.getElementById('manual-price').value;
|
|
const currency = document.getElementById('manual-currency').value;
|
|
|
|
console.log('📝 Manual data submitted:', { url, title, price, currency });
|
|
|
|
const result = document.createElement('div');
|
|
result.innerHTML = `
|
|
<div style="background: #d4edda; border: 1px solid #c3e6cb; border-radius: 6px; padding: 1rem; margin: 1rem 0;">
|
|
<h5 style="color: #155724; margin: 0 0 0.5rem 0;">✅ Manual Item Created Successfully!</h5>
|
|
<p style="margin: 0; color: #155724;"><strong>Title:</strong> ${title}</p>
|
|
<p style="margin: 0; color: #155724;"><strong>Price:</strong> ${price} ${currency}</p>
|
|
</div>
|
|
`;
|
|
document.getElementById('workflowContainer').appendChild(result);
|
|
};
|
|
|
|
window.cancelManualInput = function() {
|
|
console.log('❌ Manual input cancelled');
|
|
const form = document.querySelector('.manual-input-form');
|
|
if (form) form.remove();
|
|
};
|
|
|
|
window.handleManualInput = function() {
|
|
console.log('🔧 Handling manual input...');
|
|
testManualFallback();
|
|
};
|
|
|
|
window.clearAll = function() {
|
|
document.getElementById('errorLog').textContent = 'Logs cleared...';
|
|
document.getElementById('consoleOutput').textContent = 'Console cleared...';
|
|
document.getElementById('workflowContainer').innerHTML = '<h4>🚀 Workflow Test Area</h4><p>Hier wird der Enhanced Item Workflow getestet...</p>';
|
|
|
|
// Reset progress
|
|
['validate', 'extract', 'ai', 'select', 'save'].forEach(step => {
|
|
updateProgress(step, 'pending');
|
|
});
|
|
};
|
|
|
|
console.log('🔧 Enhanced Workflow Debug Test loaded successfully');
|
|
</script>
|
|
</body>
|
|
</html> |