Video Player - Phase 4
Multi-clip viewer, mobile-friendly controls, library migration. Also includes Phase 1-3 features: captions, download, keyboard shortcuts. Test on mobile to verify touch controls.
Select Video
Player Options
Keyboard Shortcuts
Click the player first to focus it, then use these keys:
Unified VideoPlayer (Phase 3)
Vertical / Portrait VideoPlayer
Demonstrates adaptive aspect ratio with maxHeight cap for portrait videos.
ClipViewer (Phase 4 - Multi-clip)
Simulates a respondent with 4 video responses. Clean video surface with no persistent overlays. Clip navigation and timeline in a compact strip below the video. Auto-advances to the next clip on completion. Compact controls on mobile (no volume button).
ClipViewer — Portrait Clips + Fullscreen Persistence
Tests two fixes: (1) Vertical/portrait videos are constrained to fit on the page (maxHeight: 70vh) instead of growing extremely tall. (2) Fullscreen mode persists across clip transitions — enter fullscreen and let clips auto-advance to verify it stays fullscreen.
ClipViewer — Landscape Clips (16:9)
Tests landscape video behavior on mobile. Rotate your phone to landscape orientation to verify: the video should resize correctly without excess black bars on the sides. Previously, maxHeight constrained the height without adjusting the container width, causing letterboxing.
ClipViewer — Wide Portrait Clips (4:5)
Tests the horizontal overflow fix for wider portrait aspect ratios. On mobile, a 4:5 video previously overflowed the screen width because maxWidth = calc(70vh × 0.8) = ~454px exceeded the 375px viewport. Now uses min(100%, ...) to cap at parent width.
Admin Video Viewer (Phase 5 — multilanguage subtitles)
Simulates the admin video review dialog with multilanguage caption switching. Select a language to see captions change in real time. This mirrors the VideoViewerDialog used in the branded-video-flow admin panel.
Caption Language
What was your experience with the product?
Session: abc-123-def • Video 1 of 3 • Caption language: English
Mobile Testing Checklist
Open this page on a phone or tablet (via tunnel or responsive mode) and verify each item: