@asciisd/vue-progressive-iframe/src/types/index.ts

A Vue 3 component for progressive iframe loading with advanced content detection

export interface ProgressiveIframeOptions {
  src: string
  contentDetectionTimeout?: number
  maxContentChecks?: number
  crossOriginWaitTime?: number
  allowedOrigins?: string[]
  sandbox?: string
  height?: number | string
  width?: number | string
  showDebugInfo?: boolean
  loadingStrategy?: IframeLoadingStrategy
  preventOnloadBlocking?: boolean
  minimizeBusyIndicators?: boolean
  // Friendly iframe options
  htmlContent?: string
  styles?: string[]
  autoResize?: boolean
  enableKeepAlive?: boolean
  // PostMessage bridge
  enableBridge?: boolean
}

export interface ContentDetectionResult {
  hasContent: boolean
  hasAutoChartistElements?: boolean
  hasNoLoadingIndicators?: boolean
  bodyChildren?: number
  textLength?: number
  method: 'same-origin' | 'cross-origin' | 'postmessage'
}

export interface LoadingState {
  isLoading: boolean
  isContentLoading: boolean
  hasError: boolean
  errorMessage: string
  contentCheckCount: number
  loadStartTime: number
  consecutiveErrorCount: number
}

export interface ProgressiveIframeEvents {
  'content-loaded': { loadTime: number; checkCount: number; method: string }
  'load-error': { error: Error; errorCount: number }
  'detection-progress': { checkCount: number; maxChecks: number; loadTime: number }
  'force-loaded': { loadTime: number }
  'iframe-ready': { loadTime: number }
}

export interface DetectionConfig {
  maxContentChecks: number
  contentDetectionTimeout: number
  crossOriginWaitTime: number
  detectionInterval: number
}

export interface DebugInfo {
  url: string
  loadTime: number
  cached: boolean
  userAgent: string
  contentChecks: number
  detectionMethod?: string
  lastError?: string
}

export type IframeLoadingStrategy = 
  | 'progressive'        // Our current approach - show immediately with overlay
  | 'traditional'        // Standard iframe (blocks onload)
  | 'after-onload'       // Load after main page onload
  | 'dynamic-async'      // Dynamic async technique (best performance)
  | 'friendly'           // Friendly iframe for same-domain content
  | 'settimeout'         // setTimeout technique (legacy support)

export interface IframeSandboxOptions {
  allowScripts?: boolean
  allowSameOrigin?: boolean
  allowForms?: boolean
  allowPopups?: boolean
  allowPopupsToEscapeSandbox?: boolean
  allowModals?: boolean
  allowPointerLock?: boolean
  allowPresentation?: boolean
  allowTopNavigation?: boolean
}