Plyr: [iOS] Clicking on the video during playback doesn't pause it

[bjfletcher]

Expected behaviour

Clicking on the video during playback pauses it

Actual behaviour

Clicking on the video during playback does not pause it

Steps to reproduce

1. open webpage
2. click on the play icon to start the video
3. click on the video itself (not pause icon) to pause it

Environment

Mobile Safari on iPhone and iPad running iOS 12.0

(it works ok on desktop Chrome)

Link to where the bug is happening

https://plyr.io/

P.S. thank you for a really great video player!

[sampotts]

I think technically it should show controls on the first tap and then while controls are visible then another tap should pause it. This is how most players work on touch devices from my experience anyway.

[bjfletcher]

That's fair enough. What do you think about the flicker (very brief, black block) that happens when you do the first tap? It is not very aesthetic, hey?

[sampotts]

I don't notice anything like that on my iPhone XS. What device are you testing on?

[breyell]

I noticed the same issue today on both iOS 11 and iOS 12. Adding pointer-events: none; to .plyr__poster seems to have resolved the issue for me on iOS 10.

[bjfletcher]

I don't notice anything like that on my iPhone XS. What device are you testing on?

iPhone XS Max running iOS 12.

@BReyell I've just tried that on iOS, no dice... I wonder if you meant that it works only on iOS 11?

[breyell]

@bjfletcher Yeah, typo on my end. I meant it fixes iOS 11. iOS 12 is unchanged.

[jamesoflol]

RE: Tap to pause: I agree with Sam on the appropriate functionality. Though one way to make it a little more friendly would be to pop up a big pause button in the centre of the video after the first tap.

RE: Black box flicker: I'm going to be doing a minor mobile controls PR soon, and can look at this while I'm at it. Thanks @BReyell for the pointer-events tip.

[alemonopoli]

Same issue here. :( did anyone get how to fix it? Thanks

[effixx]

Also experiencing this issue. Doesn't even show controls on first tap for me.

[ignacfetser]

i have just commented out the 'return' in plyr.js in this 'if block' and it solved the issue for me:
if (player.touch && player.config.hideControls) {
//return;
}

[sampotts]

i have just commented out the 'return' in plyr.js in this 'if block' and it solved the issue for me:
if (player.touch && player.config.hideControls) {
//return;
}

That would make them always show I think?

[sampotts]

I've just tested the latest version of iOS (13.3.1) on https://plyr.io with HTML5, YouTube & Vimeo and the controls show on first tap. I agree about the large pause button like YouTube etc have to improve affordance. I'll look into that.

[nitaaikumar]

I think technically it should show controls on the first tap and then while controls are visible then another tap should pause it. This is how most players work on touch devices from my experience anyway.

It is not pausing on double tap when the controls are visible for me on iOS 13.5 and Android 10. It is going fullscreen when I double tap whether the video is playing or not. Has this been implemented? If so, how do I make pausing on double tap when controls are visible work? Thanks for any help.