Skip to content

v1.3.7: Advanced DOM Authorization for DRF Spectacular

Choose a tag to compare

@CodeMath CodeMath released this 31 Aug 14:59
· 14 commits to main since this release

🎯 Advanced DOM Authorization - DRF Spectacular Compatibility

Critical enhancement: Advanced DOM manipulation and authorization strategies specifically for DRF Spectacular environments.

✨ Advanced Features

  • 🎯 Smart Input Detection - Multiple selector patterns for authorization inputs
  • πŸ”§ DRF Spectacular Integration - Specialized handling for DRF's Swagger UI setup
  • πŸ“± Modal Authorization - Automatic detection and handling of authorization modals
  • πŸ” Pattern Matching - Intelligent input field detection by placeholder, name, id, class
  • πŸ”˜ Auto-Click Authorization - Automatically triggers authorize buttons when possible

πŸ”§ Technical Improvements

  • Comprehensive Input Detection:
    const authInputSelectors = [
        'input[placeholder*="Bearer"]',
        'input[name*="Authorization"]', 
        'input[id*="auth"]',
        'input[class*="auth"]',
        'input[type="text"]', // Fallback
        'textarea[placeholder*="Bearer"]'
    ];
  • Modal Handling Strategy:
    // Wait and detect opened modals
    setTimeout(() => {
        const modalInputs = document.querySelectorAll('input[type="text"]:not([style*="display: none"])');
        if (modalInputs.length > 0) {
            modalInputs[0].value = `Bearer ${token}`;
            modalInputs[0].dispatchEvent(new Event('input', { bubbles: true }));
        }
    }, 500);
  • Enhanced DOM Element Detection: SwaggerUI container detection with instance access
  • Automatic Button Triggering: Clicks authorize buttons to open authentication modals

🎯 What This Solves

  • DRF Spectacular Compatibility: Works with DRF's specific Swagger UI implementation
  • SwaggerUIBundle Integration: Handles cases where only SwaggerUIBundle is available
  • Modal Authorization: Automatically fills and submits authorization modals
  • Fallback Strategies: Multiple DOM manipulation approaches for edge cases

πŸ’‘ Enhanced Authorization Flow

  1. Standard Detection: Check for window.ui, window.swaggerUi
  2. Bundle Detection: Access SwaggerUIBundle and search DOM containers
  3. DOM Manipulation: Direct input field detection and filling
  4. Modal Handling: Automatic modal detection and form completion
  5. Pattern Matching: Intelligent field matching by multiple attributes

This specifically addresses your DRF Spectacular environment where:

  • window.SwaggerUIBundle: function βœ…
  • window.ui: undefined ❌
  • Authorization requires DOM manipulation

πŸ“¦ Installation

pip install --upgrade drf-spectacular-auth==1.3.7

πŸ”— Links