================================================================================
                    POWERON AI PLATFORM - UI TESTDOKUMENTATION
================================================================================

ÜBERSICHT
---------
Dieses Dokument strukturiert alle UI-Funktionen der PowerOn AI Platform nach Views,
Objekten und Attributen. Es dient als systematische Testanleitung für die Validierung
der neuen UI-Implementierung.

================================================================================
1. AUTHENTIFIZIERUNG & BENUTZERVERWALTUNG
================================================================================

1.1 LOGIN VIEW (/login.html)
---------------------------
OBJEKTE & ATTRIBUTE:
- Form: #login-form
  - Input: #username (type="text", required, autocomplete="username")
  - Input: #password (type="password", required, autocomplete="current-password")
  - Input: #csrf-token (type="hidden", class="csrf-token")
  - Button: .login-btn (type="submit")

- Error Display: #login-error (class="login-error-message")

- Alternative Login Buttons:
  - Button: #msft-login-btn (class="register-btn msft-btn")
  - Button: #google-login-btn (class="register-btn msft-btn")
  - Link: .register-btn.local-btn (href="register.html")

FUNKTIONEN ZU TESTEN:
□ Username-Eingabe validiert (min. 3 Zeichen)
□ Password-Eingabe maskiert Zeichen
□ CSRF-Token wird generiert und übertragen
□ Login-Button aktiviert Form-Submission
□ Fehlerbehandlung bei ungültigen Credentials
□ Microsoft Login öffnet OAuth-Popup
□ Google Login öffnet OAuth-Popup
□ "Registrieren" Link führt zu Register-View
□ Form-Validation funktioniert (required fields)
□ Autocomplete-Attribute sind gesetzt

1.2 REGISTER VIEW (/register.html)
---------------------------------
OBJEKTE & ATTRIBUTE:
- Form: #register-form
  - Input: #username (type="text", required, minlength="3")
  - Input: #password (type="password", required, minlength="8")
  - Input: #confirm-password (type="password", required)
  - Input: #email (type="email", required)
  - Input: #fullName (type="text", minlength="2")
  - Input: #authenticationAuthority (type="hidden", value="local")
  - Button: .login-btn (type="submit")

- Error Display: #register-error (class="login-error-message")
- Navigation: .register-link > a (href="login.html")

FUNKTIONEN ZU TESTEN:
□ Username-Validierung (min. 3 Zeichen)
□ Password-Validierung (min. 8 Zeichen)
□ Password-Bestätigung prüft Übereinstimmung
□ Email-Validierung (korrekte Email-Format)
□ FullName ist optional (min. 2 Zeichen wenn ausgefüllt)
□ AuthenticationAuthority ist auf "local" gesetzt
□ Form-Submission erstellt neuen Benutzer
□ Fehlerbehandlung bei Validierungsfehlern
□ "Zum Login" Link führt zurück zu Login-View
□ Alle required fields werden validiert

1.3 HOME VIEW (/poweron-home.html)
---------------------------------
OBJEKTE & ATTRIBUTE:
- Container: .container
- Header: .header
  - H1: "PowerOn AI Platform"
  - P: Beschreibungstext
- Content Sections: .content-section
  - H2: Sektionsüberschriften
  - P: Beschreibungstexte
- Features: .features (grid layout)
  - Feature Cards: .feature-card
    - H3: Feature-Titel
    - P: Feature-Beschreibung
- Navigation: .navigation
  - Links: .nav-link (href zu Privacy/Terms)
- Footer: .footer

FUNKTIONEN ZU TESTEN:
□ Responsive Grid-Layout für Features
□ Navigation-Links funktionieren
□ Alle Textinhalte sind korrekt angezeigt
□ CSS-Styling ist korrekt angewendet
□ Mobile-Responsive Design funktioniert

================================================================================
2. HAUPTANWENDUNG - MODULARES SYSTEM
================================================================================

2.1 MAIN CONTAINER (/index.html)
-------------------------------
OBJEKTE & ATTRIBUTE:
- App Container: .app-container
- Sidebar: #sidebar (class="sidebar")
  - Header: .sidebar-header
    - H2: "PowerOn AI"
    - User Display: #user-name (class="current-user")
    - Environment: #environment-name (class="environment-info")
  - Navigation: .navigation-container
    - List: #main-navigation (ul)

- Main Content: .main-content
  - Module Container: #module-container (class="module-container")

- File Preview Modal: #file-preview-modal
  - Content: .file-preview-modal-content
  - Header: .file-preview-modal-header
    - Title: #file-preview-modal-title
    - Actions: .file-preview-modal-actions
      - Download: #modal-download-file-btn
      - Copy: #modal-copy-file-btn
      - Close: #modal-close-file-preview-btn
  - Body: #file-preview-modal-body

FUNKTIONEN ZU TESTEN:
□ Sidebar wird korrekt geladen
□ Benutzername wird angezeigt
□ Environment-Info wird angezeigt
□ Navigation wird dynamisch generiert
□ Module-Container wechselt zwischen Views
□ File-Preview-Modal funktioniert
□ Modal-Actions (Download, Copy, Close) funktionieren

2.2 NAVIGATION SYSTEM
--------------------
OBJEKTE & ATTRIBUTE:
- Navigation List: #main-navigation
  - Items: .nav-item (data-module, data-level)
    - Links: a (href="#moduleName")
    - Icons: i.fas (FontAwesome icons)
    - Labels: span (text content)

- Folder Items: .folder-header
  - Toggle Icon: .toggle-icon (fa-chevron-down)
  - Collapsed State: .collapsed

- Dropdown Items: .dropdown
  - Toggle: .dropdown-toggle
  - Content: .dropdown-content
  - Options: a (data-value)

- Action Items: .nav-action-btn
  - Dynamic Labels: span (text updates based on state)

FUNKTIONEN ZU TESTEN:
□ Module-Navigation funktioniert
□ Folder-Toggle (auf/zu) funktioniert
□ Dropdown-Menüs öffnen/schließen
□ Action-Buttons (Logout, MS Login) funktionieren
□ Aktive Module werden hervorgehoben
□ Hierarchische Navigation funktioniert
□ Dynamic Labels werden aktualisiert

================================================================================
3. WORKFLOW MODULE
================================================================================

3.1 WORKFLOW VIEW (part_workflow.html)
-------------------------------------
OBJEKTE & ATTRIBUTE:
- Container: .workflow-container
- Chat Section: .chat-section
  - Columns: .chat-columns
    - Left Column: .chat-left (70%)
      - Empty State: #empty-chat-state (class="empty-state")
        - Icon: i.fas.fa-comments.fa-3x
        - Title: h4 "Noch keine Kommunikation"
        - Description: p
      - Content Area: #unified-content-area (class="unified-content-area")
    - Right Column: .chat-right (30%)
      - Dashboard: #workflow-dashboard-container
        - Header: .workflow-dashboard-header
          - Title: h4 "Workflow Progress"
          - Actions: .dashboard-actions
            - Refresh: #refresh-dashboard-btn
            - Minimize: #minimize-dashboard-btn
        - Content: #workflow-dashboard-content

- Footer: .workflow-footer
  - Columns: .footer-columns
    - Left Column: .footer-left (70%)
      - Input Area: #user-input-area (class="user-input-area file-dropzone-wrapper")
        - Container: .user-input-container
          - Prompt Selection: .prompt-selection
            - Select: #prompt-select-main (class="form-control")
          - Textarea: #user-message-input (class="form-control")
          - Actions: .user-input-actions
            - File Actions: .file-actions
              - Upload Button: #upload-additional-file-btn
              - File Input: #additional-file-input (type="file", multiple, hidden)
            - Workflow Controls: .workflow-controls
              - Stop: #stop-workflow-btn (class="btn btn-danger")
              - Reset: #reset-btn (class="btn btn-outline-secondary")
              - Refresh Tokens: #refresh-tokens-btn (class="btn btn-outline-warning")
              - Send: #send-user-message-btn (class="btn btn-primary")
    - Right Column: .footer-right (30%)
      - Statistics: #data-statistics (class="data-statistics")
        - Items: .stat-item (data sent, received, time, tokens)
      - Files Container: #additional-files-container

FUNKTIONEN ZU TESTEN:
□ Empty State wird korrekt angezeigt
□ Unified Content Area zeigt Logs und Messages
□ Dashboard zeigt Workflow-Progress
□ Prompt-Selection lädt verfügbare Prompts
□ User-Input funktioniert (Textarea)
□ File-Upload (Button + Drag & Drop)
□ Workflow-Controls (Start, Stop, Reset, Refresh Tokens)
□ Statistics werden angezeigt
□ Additional Files werden gelistet
□ Drag & Drop funktioniert
□ Enter-Key sendet Message
□ Shift+Enter fügt neue Zeile hinzu

3.2 WORKFLOW STATE MANAGEMENT
----------------------------
OBJEKTE & ATTRIBUTE:
- Workflow States: WORKFLOW_STATES
  - NULL: null
  - RUNNING: 'running'
  - COMPLETED: 'completed'
  - FAILED: 'failed'
  - STOPPED: 'stopped'

- State Properties:
  - currentTask: number
  - currentAction: number
  - currentRound: number
  - totalTasks: number
  - totalActions: number
  - status: string
  - workflowId: string
  - pollActive: boolean

FUNKTIONEN ZU TESTEN:
□ State-Transitions funktionieren korrekt
□ Polling startet/stoppt bei State-Änderungen
□ UI aktualisiert sich bei State-Änderungen
□ Error-Handling bei State-Transitions
□ Workflow-ID wird korrekt gesetzt
□ Progress-Tracking funktioniert

3.3 FILE HANDLING
----------------
OBJEKTE & ATTRIBUTE:
- File Objects:
  - id: string
  - fileName: string
  - fileSize: number
  - mimeType: string
  - content: Blob/File

- File Upload:
  - Input: #additional-file-input
  - Button: #upload-additional-file-btn
  - Container: #additional-files-container

- File Display:
  - Items: .additional-file-item
    - Icon: i.fas.fa-file
    - Name: .file-name
    - Size: .file-size
    - Remove: .remove-file-btn (data-file-id)

FUNKTIONEN ZU TESTEN:
□ File-Upload funktioniert (Button + Drag & Drop)
□ Multiple Files werden unterstützt
□ File-Validation (Type, Size)
□ File-Display zeigt korrekte Informationen
□ File-Removal funktioniert
□ File-Preview funktioniert
□ Download-Links funktionieren

================================================================================
4. USER MANAGEMENT MODULE
================================================================================

4.1 USERS VIEW (part_formUsers.html)
-----------------------------------
OBJEKTE & ATTRIBUTE:
- Container: #users-view
- Card: .card
  - Header: .section-header
    - Title: h3 "Verfügbare Benutzer"
    - Add Button: #add-user-btn (class="add-btn")
  - List Container: #users-list

- User Objects:
  - id: string
  - username: string
  - email: string
  - password: string (hashed)
  - enabled: boolean
  - language: string
  - privilege: string ('admin', 'user', 'sysadmin')
  - mandateId: string
  - authenticationAuthority: string

FUNKTIONEN ZU TESTEN:
□ User-Liste wird geladen
□ Add-Button öffnet User-Form
□ User-Table zeigt alle Attribute
□ Edit-Button öffnet Edit-Form
□ Delete-Button löscht User
□ Enable/Disable-Toggle funktioniert
□ Form-Validation funktioniert
□ User-Creation funktioniert
□ User-Update funktioniert
□ User-Deletion funktioniert

4.2 USER FORM FIELDS
-------------------
OBJEKTE & ATTRIBUTE:
- Form Fields (from API getEntityAttributes('User')):
  - username: text, required, minlength=3
  - email: email, required
  - password: password, required, minlength=8
  - enabled: checkbox
  - language: select, options from backend
  - privilege: select, options: ['admin', 'user', 'sysadmin']

- Form Actions:
  - Save: .entity-save-btn
  - Cancel: .entity-cancel-btn
  - Delete: .entity-delete-btn

FUNKTIONEN ZU TESTEN:
□ Alle Form-Felder werden korrekt gerendert
□ Field-Types entsprechen Backend-Definition
□ Required-Validation funktioniert
□ Minlength-Validation funktioniert
□ Select-Options werden geladen
□ Form-Submission funktioniert
□ Error-Messages werden angezeigt
□ Success-Messages werden angezeigt

================================================================================
5. CONNECTION MANAGEMENT MODULE
================================================================================

5.1 CONNECTIONS VIEW (part_formConnections.html)
-----------------------------------------------
OBJEKTE & ATTRIBUTE:
- Container: #connections-view
- Card: .card
  - Header: .section-header
    - Title: h3 "External Connections"
    - Add Buttons: #add-connection-buttons
      - Google: #connect-google-btn (class="add-btn")
      - Microsoft: #connect-msft-btn (class="add-btn")
  - List Container: #connections-list

- Connection Objects:
  - id: string
  - userId: string
  - authority: string ('google', 'msft')
  - externalUsername: string
  - externalEmail: string
  - status: string ('active', 'pending', 'needs_reconnection')
  - expiresAt: number (UTC timestamp)
  - lastChecked: number (UTC timestamp)

FUNKTIONEN ZU TESTEN:
□ Connection-Liste wird geladen
□ Google-Connect-Button funktioniert
□ Microsoft-Connect-Button funktioniert
□ Connection-Status wird angezeigt
□ Token-Expiration wird angezeigt
□ Refresh-Token-Button funktioniert
□ Connection-Deletion funktioniert
□ OAuth-Popup funktioniert
□ Token-Refresh funktioniert
□ Expired-Token-Warning funktioniert

5.2 TOKEN MANAGEMENT
-------------------
OBJEKTE & ATTRIBUTE:
- Token Status:
  - hasValidToken: boolean
  - hasRefreshableToken: boolean
  - isExpired: boolean
  - expiresSoon: boolean (5 min buffer)

- Token Actions:
  - Refresh: .entity-refresh-token-btn
  - Cleanup: automatic cleanup
  - Warning: #refresh-tokens-btn (shows when tokens expire soon)

FUNKTIONEN ZU TESTEN:
□ Token-Status wird korrekt erkannt
□ Expired-Token-Detection funktioniert
□ Token-Refresh funktioniert
□ Automatic-Cleanup funktioniert
□ Warning-Button wird angezeigt
□ Token-Status-Updates funktionieren
□ Error-Handling bei Token-Refresh

================================================================================
6. FILE MANAGEMENT MODULE
================================================================================

6.1 FILES VIEW (part_formFiles.html)
-----------------------------------
OBJEKTE & ATTRIBUTE:
- Container: #files-view
- Card: .card
  - Header: .section-header
    - Title: h3 "Meine Dateien"
  - List Container: #my-files-list (class="files-list-container")
  - Empty State: #empty-files-state (class="empty-state")
    - Icon: i.fas.fa-file-alt.empty-icon
    - Message: p "Noch keine Dateien vorhanden."

- Upload Section: #upload-section (class="upload-section")
  - Upload Area: .upload-area
    - Icon: .upload-icon > i.fas.fa-cloud-upload-alt
    - Text: .upload-text
    - Button: .upload-button > input#file-upload-input (type="file", multiple, hidden)

- File Objects:
  - id: string
  - fileName: string
  - mimeType: string
  - fileSize: number
  - creationDate: number (UTC timestamp)

FUNKTIONEN ZU TESTEN:
□ File-Liste wird geladen
□ Upload-Section wird angezeigt
□ Drag & Drop funktioniert
□ File-Selection funktioniert
□ Multiple-File-Upload funktioniert
□ File-Information wird angezeigt
□ Empty-State wird angezeigt
□ File-Actions funktionieren

6.2 FILE ACTIONS
---------------
OBJEKTE & ATTRIBUTE:
- File Action Buttons:
  - Download: .entity-view-btn
    - Icon: i.fas.fa-download
    - Text: "Download"
  - Copy Link: .entity-copy-btn
    - Icon: i.fas.fa-clipboard
    - Text: "Copy Download Link"
  - Edit: .entity-edit-btn
  - Delete: .entity-delete-btn

- File Edit Modal: #edit-file-modal
  - Name Field: #edit-file-name
  - Upload Field: #edit-file-upload
  - Save Button: .entity-modal-save
  - Cancel Button: .entity-modal-cancel

FUNKTIONEN ZU TESTEN:
□ Download-Button funktioniert
□ Copy-Link-Button funktioniert
□ Edit-Button öffnet Modal
□ Delete-Button löscht File
□ File-Edit-Modal funktioniert
□ File-Rename funktioniert
□ File-Replacement funktioniert
□ Modal-Validation funktioniert

================================================================================
7. WORKFLOW LIST MODULE
================================================================================

7.1 WORKFLOWS VIEW (part_formWorkflows.html)
-------------------------------------------
OBJEKTE & ATTRIBUTE:
- Container: #workflows-view
- Card: .card
  - Header: .section-header
    - Title: h3 "Workflows"
    - Add Button: #add-workflow-btn (class="add-btn")
  - List Container: #workflows-list

- Workflow Objects:
  - id: string
  - name: string
  - status: string ('running', 'completed', 'stopped', 'error')
  - currentRound: number
  - lastActivity: number (UTC timestamp)
  - mandateId: string

FUNKTIONEN ZU TESTEN:
□ Workflow-Liste wird geladen
□ Add-Button öffnet Workflow-Form
□ Workflow-Status wird angezeigt
□ Last-Activity wird formatiert angezeigt
□ Continue-Button funktioniert
□ Workflow-Creation funktioniert
□ Workflow-Deletion funktioniert
□ Sorting funktioniert (by lastActivity)
□ Status-Badges werden korrekt angezeigt

7.2 WORKFLOW TABLE FORMATTING
----------------------------
OBJEKTE & ATTRIBUTE:
- Table Fields:
  - id: text, readonly
  - name: text, readonly
  - status: select, readonly, options: ['running', 'completed', 'stopped', 'error']
  - currentRound: number, readonly
  - lastActivity: timestamp, readonly

- Field Formatters:
  - status: badge formatting (success, info, warning, danger)
  - lastActivity: UTC timestamp formatting

FUNKTIONEN ZU TESTEN:
□ Table-Columns werden korrekt angezeigt
□ Status-Badges haben richtige Farben
□ Timestamp-Formatting funktioniert
□ Sorting funktioniert
□ Field-Alignment ist korrekt
□ Readonly-Fields sind nicht editierbar

================================================================================
8. PROMPT MANAGEMENT MODULE
================================================================================

8.1 PROMPTS VIEW (part_formPrompts.html)
---------------------------------------
OBJEKTE & ATTRIBUTE:
- Container: #prompts-view
- Card: .card
  - Header: .section-header
    - Title: h3 "Prompts"
    - Add Button: #add-prompt-btn (class="add-btn")
  - List Container: #prompts-list

- Prompt Objects:
  - id: string
  - name: string
  - content: string
  - mandateId: string

FUNKTIONEN ZU TESTEN:
□ Prompt-Liste wird geladen
□ Add-Button öffnet Prompt-Form
□ Prompt-Name wird angezeigt
□ Prompt-Content wird angezeigt
□ Copy-Button funktioniert
□ Prompt-Creation funktioniert
□ Prompt-Update funktioniert
□ Prompt-Deletion funktioniert
□ Form-Validation funktioniert

8.2 PROMPT FORM FIELDS
---------------------
OBJEKTE & ATTRIBUTE:
- Form Fields (from API getEntityAttributes('Prompt')):
  - name: text, required
  - content: textarea, required

- Form Actions:
  - Save: .entity-save-btn
  - Cancel: .entity-cancel-btn
  - Copy: .entity-copy-btn

FUNKTIONEN ZU TESTEN:
□ Name-Field ist required
□ Content-Field ist textarea
□ Form-Validation funktioniert
□ Copy-to-Clipboard funktioniert
□ Form-Submission funktioniert
□ Error-Handling funktioniert

8.3 PROMPT INTEGRATION
---------------------
OBJEKTE & ATTRIBUTE:
- Workflow Integration:
  - Select: #prompt-select-main
  - Options: option (value=promptId, text=promptName)
  - Textarea: #user-message-input

- Event Handling:
  - prompt:created event
  - prompt:updated event
  - prompt:deleted event

FUNKTIONEN ZU TESTEN:
□ Prompt-Dropdown wird geladen
□ Prompt-Selection lädt Content
□ Event-Handling funktioniert
□ Global-Prompt-List wird aktualisiert
□ Workflow-Integration funktioniert

================================================================================
9. UI COMPONENTS & SHARED ELEMENTS
================================================================================

9.1 MODALS
---------
OBJEKTE & ATTRIBUTE:
- File Preview Modal: #file-preview-modal
  - Content: .file-preview-modal-content
  - Header: .file-preview-modal-header
  - Title: #file-preview-modal-title
  - Actions: .file-preview-modal-actions
  - Body: #file-preview-modal-body

- Edit Modals: .entity-modal
  - Content: .entity-modal-content
  - Header: .entity-modal-header
  - Body: .entity-modal-body
  - Footer: .entity-modal-footer
  - Close: .entity-modal-close
  - Save: .entity-modal-save
  - Cancel: .entity-modal-cancel

FUNKTIONEN ZU TESTEN:
□ Modal-Öffnung funktioniert
□ Modal-Schließung funktioniert
□ Modal-Content wird korrekt angezeigt
□ Modal-Actions funktionieren
□ Modal-Validation funktioniert
□ Modal-Overlay funktioniert
□ Escape-Key schließt Modal

9.2 NOTIFICATIONS
----------------
OBJEKTE & ATTRIBUTE:
- Toast Messages: window.utils.ui.showToast()
  - Types: 'success', 'error', 'warning', 'info'
  - Properties: title, message, type
  - Styling: .toast-success, .toast-error, .toast-warning, .toast-info

FUNKTIONEN ZU TESTEN:
□ Success-Toasts werden angezeigt
□ Error-Toasts werden angezeigt
□ Warning-Toasts werden angezeigt
□ Info-Toasts werden angezeigt
□ Toast-Auto-Dismiss funktioniert
□ Toast-Styling ist korrekt
□ Multiple-Toasts funktionieren

9.3 FORM VALIDATION
------------------
OBJEKTE & ATTRIBUTE:
- Validation Rules:
  - required: boolean
  - minlength: number
  - maxlength: number
  - pattern: regex
  - type: string (text, email, password, etc.)

- Error Display:
  - Field Errors: .field-error
  - Form Errors: .form-error
  - Validation Messages: dynamic text content

FUNKTIONEN ZU TESTEN:
□ Required-Validation funktioniert
□ Minlength-Validation funktioniert
□ Email-Validation funktioniert
□ Password-Validation funktioniert
□ Real-time-Validation funktioniert
□ Error-Messages werden angezeigt
□ Success-Validation funktioniert

9.4 TABLES
----------
OBJEKTE & ATTRIBUTE:
- Table Structure:
  - Container: .table-container
  - Table: table
  - Header: thead > tr > th
  - Body: tbody > tr > td
  - Actions: .entity-actions-cell

- Table Features:
  - Sorting: .sortable (data-sort)
  - Filtering: .filter-input
  - Pagination: .pagination
  - Empty State: .empty-state

FUNKTIONEN ZU TESTEN:
□ Table-Rendering funktioniert
□ Column-Headers werden angezeigt
□ Data-Rows werden angezeigt
□ Action-Buttons funktionieren
□ Sorting funktioniert
□ Filtering funktioniert
□ Pagination funktioniert
□ Empty-State wird angezeigt

9.5 RESPONSIVE DESIGN
--------------------
OBJEKTE & ATTRIBUTE:
- Breakpoints:
  - Mobile: < 768px
  - Tablet: 768px - 1024px
  - Desktop: > 1024px

- Responsive Classes:
  - .d-none, .d-block
  - .d-md-none, .d-md-block
  - .d-lg-none, .d-lg-block

FUNKTIONEN ZU TESTEN:
□ Mobile-Layout funktioniert
□ Tablet-Layout funktioniert
□ Desktop-Layout funktioniert
□ Navigation ist responsive
□ Tables sind responsive
□ Forms sind responsive
□ Modals sind responsive

================================================================================
10. PERFORMANCE & ERROR HANDLING
================================================================================

10.1 LOADING STATES
-----------------
OBJEKTE & ATTRIBUTE:
- Loading Indicators:
  - Spinner: .spinner, .loading
  - Progress: .progress-bar
  - Skeleton: .skeleton-loader

- Loading States:
  - Module Loading: moduleLoader states
  - Data Loading: formGeneric loading
  - API Loading: apiCalls loading

FUNKTIONEN ZU TESTEN:
□ Loading-Indicators werden angezeigt
□ Loading-States werden korrekt gesetzt
□ Loading-Errors werden behandelt
□ Loading-Performance ist akzeptabel
□ Loading-Cancellation funktioniert

10.2 ERROR HANDLING
-----------------
OBJEKTE & ATTRIBUTE:
- Error Types:
  - Validation Errors: form validation
  - API Errors: network/server errors
  - JavaScript Errors: runtime errors
  - User Errors: user input errors

- Error Display:
  - Error Messages: .error-message
  - Error Toasts: showToast('error', ...)
  - Error Modals: .error-modal

FUNKTIONEN ZU TESTEN:
□ Validation-Errors werden angezeigt
□ API-Errors werden behandelt
□ JavaScript-Errors werden abgefangen
□ User-Errors werden erklärt
□ Error-Recovery funktioniert
□ Error-Logging funktioniert

10.3 MEMORY MANAGEMENT
--------------------
OBJEKTE & ATTRIBUTE:
- Memory Cleanup:
  - Event Listeners: removeEventListener
  - Intervals: clearInterval
  - Timeouts: clearTimeout
  - Objects: null assignment

- Module Cleanup:
  - onDeactivation: module cleanup
  - Event Cleanup: removeEventListeners
  - State Cleanup: reset state

FUNKTIONEN ZU TESTEN:
□ Event-Listeners werden entfernt
□ Intervals werden gestoppt
□ Timeouts werden gestoppt
□ Module-Cleanup funktioniert
□ Memory-Leaks werden vermieden
□ Performance bleibt stabil

================================================================================
11. ACCESSIBILITY & USABILITY
================================================================================

11.1 KEYBOARD NAVIGATION
-----------------------
OBJEKTE & ATTRIBUTE:
- Focus Management:
  - Tab Order: tabindex
  - Focus Indicators: :focus styles
  - Focus Trapping: modal focus

- Keyboard Shortcuts:
  - Enter: form submission
  - Escape: modal close
  - Tab: next element
  - Shift+Tab: previous element

FUNKTIONEN ZU TESTEN:
□ Tab-Navigation funktioniert
□ Focus-Indicators sind sichtbar
□ Keyboard-Shortcuts funktionieren
□ Focus-Trapping funktioniert
□ Skip-Links funktionieren

11.2 SCREEN READER SUPPORT
------------------------
OBJEKTE & ATTRIBUTE:
- ARIA Attributes:
  - aria-label: element labels
  - aria-describedby: element descriptions
  - aria-expanded: expandable elements
  - aria-hidden: hidden elements

- Semantic HTML:
  - Headings: h1-h6 hierarchy
  - Lists: ul, ol, li
  - Forms: form, label, input
  - Tables: table, th, td

FUNKTIONEN ZU TESTEN:
□ ARIA-Attribute sind gesetzt
□ Semantic-HTML ist korrekt
□ Screen-Reader-Navigation funktioniert
□ Alt-Text ist vorhanden
□ Form-Labels sind korrekt

================================================================================
12. TESTING CHECKLIST
================================================================================

ALLGEMEINE TESTS:
□ Alle Views laden korrekt
□ Navigation zwischen Modulen funktioniert
□ Responsive Design funktioniert
□ Error-Handling funktioniert
□ Loading-States funktionieren
□ Form-Validation funktioniert
□ Modal-Funktionalität funktioniert
□ Toast-Notifications funktionieren
□ Keyboard-Navigation funktioniert
□ Screen-Reader-Support funktioniert

WORKFLOW-SPEZIFISCHE TESTS:
□ Workflow-Erstellung funktioniert
□ Workflow-Ausführung funktioniert
□ Workflow-Stopp funktioniert
□ Workflow-Reset funktioniert
□ File-Upload funktioniert
□ Prompt-Selection funktioniert
□ Dashboard-Updates funktionieren
□ State-Management funktioniert

DATEN-MANAGEMENT TESTS:
□ User-CRUD funktioniert
□ Connection-Management funktioniert
□ File-Management funktioniert
□ Prompt-Management funktioniert
□ Workflow-List funktioniert
□ Token-Management funktioniert
□ Data-Synchronisation funktioniert

UI-COMPONENT TESTS:
□ Tables funktionieren
□ Forms funktionieren
□ Buttons funktionieren
□ Modals funktionieren
□ Dropdowns funktionieren
□ File-Upload funktioniert
□ Drag & Drop funktioniert

================================================================================
ENDE DER TESTDOKUMENTATION
================================================================================