iOS 15 WkWebView BUG - Cannot draw the video content into canvas

Question

Created Jan ’22

Replies 3

Boosts 0

Views 2.7k

Participants 3

Hi all,

I encounter a WkWebView BUG that only happens on iOS 15 WkWebView. I wonder if anyone knows how to work around this bug.

In canvas API, we can use 2d context's drawImage() to draw video content into a canvas. I found in iOS 15 WkWebView failed to draw video content if the video source is a m3u8 HLS video stream. This bug only happens in WkWebView, not Safari. And only happens in m3u8 video source, a mp4 video source works, too.

Here is a sample page to demo this bug. It works in Safari, but doesn't work in Google Chrome because Chrome is using WkWebView.

https://dev-us3.cloudmosa.com/~suyuan/test/video_canvas/canvas.html

Thanks,

Sam

Boost

Answer 1

garhirunrat OP

Feb ’22

Hi Sam,

Try turning off all GPU process options in Safari experimental webkit features.

They're turned on by default on iOS 15.

Thanks

0

Answer 2

suyuan OP

Feb ’22

Hi Garhirunrat,

Thanks for the response. But this bug still exists after I turned off all GPU process options in Safari Settings. In fact, it still exists after I tunred of all the Safari experimental webkit features in settings.

Best regards,

Sam

0

Answer 3

todd-g OP

Mar ’22

FWIW I had a similar issue and turning off the GPU experimental features in Safari settings did work, I can see my web app functioning as it did a month ago before this. I also tested yours and can see your test video in mobile safari.

iOS 15.3.1

Still not great, since we certainly can't ask our users to all go in and change Safari settings.

This is also affecting mobile Chrome, but there are no settings to turn off for that. Because there was no code change on our side and suddenly both browsers on iOS 15.3.1 are nonfunctional for canvas draw from HLS video, I suspect iOS is the issue.

Sidenote, this issue is not happening to mp4 video. Not much help for live video, of course.

0