page-tests

CloudCannonVideo Tests

Video Playback

Local Videos

MP4 with Controls

MP4 Autoplay + Loop

YouTube

YouTube Standard

YouTube Autoplay

Vimeo

Vimeo Standard

Loom

Loom Video

Aspect Ratios

Standard Ratios

16:9 (Default)

4:3

1:1 (Square)

21:9 (Ultra-wide)

Custom Ratios

Custom 2:1

Custom 9:16 (Portrait)

Responsive

Full Width (resize to test)

Styling

Border Customization

Default Border

Custom Border

No Border

Centered Layout

Centered Video

Dark Mode

Toggle dark mode to test styling.

Dark Mode Test

Accessibility

Captions

Click CC button to toggle captions.

Single Caption Track

Multiple Caption Languages

ARIA Labels

Video with Custom ARIA Label

Test keyboard controls (Space, Arrow keys, F for fullscreen).

Keyboard Navigation Test

Performance

Lazy Loading

Open DevTools Network tab and scroll to see lazy loading.

Above Fold (Eager)

Scroll down ↓

Below Fold (Lazy)

Keep scrolling ↓

Far Below Fold (Lazy)

Preload Options

Preload None

Preload Metadata (Default)

Multiple Videos

Video 1

Video 2

Video 3

Error Handling

Missing Source

Video Source Missing

Please provide a valid video source URL or file path using the 'src' prop.

Invalid URL

Invalid Video URL