Subtitles Not Displaying in Fullscreen on iOS & Missing Fullscreen Button on Android

[moanachen]

Description

Environment

• Video.js: 8 (via CDN)
• iOS: Safari 16.6, iPhone 14 Pro
• Android: Oppo Reno 8 (ColorOS 13), Honor 70 (Magic UI 7.0)
• H5 Container: Webkit-based mini-program environment

Issue 1: iOS Fullscreen Subtitle Problem

Description: Subtitles disappear when entering fullscreen mode on iOS devices.

Reproduction:

1. Load video with WebVTT subtitles in webkit container
2. Play video with subtitles visible (normal mode)
3. Tap fullscreen button
4. Subtitles disappear

Expected: Subtitles should remain visible in fullscreen.

References:

• Similar issues: Captions/Subtitles are not displaying in Fullscreen-mode on Safari IOS (14.6) #7356, Captions are not displaying when using ios fullscreen mode #6640

Issue 2: Android Fullscreen Button Missing

Description: Fullscreen control missing on Oppo/Honor devices.

Reproduction:

1. Open video player on Oppo Reno 8
2. Control bar shows no fullscreen button
3. player.isFullscreen() returns false even when manually triggered

Additional Notes

• Works correctly on Chrome Android and Samsung devices
• Issue persists across multiple Video.js versions (8+)
• May be related to webkitEnterFullScreen API compatibility

Reduced test case

https://example.com/test-video.html

Steps to reproduce

1. Open video player on Oppo Reno 8
2. Control bar shows no fullscreen button
3. player.isFullscreen() returns false even when manually triggered

Errors

No response

What version of Video.js are you using?

v8

Video.js plugins used.

No response

What browser(s) including version(s) does this occur with?

Safari 16.6

What OS(es) and version(s) does this occur with?

Oppo Reno 8 (ColorOS 13), Honor 70 (Magic UI 7.0)