Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Video feed shows black screen in Telegram WebView unless muted #135

Open
VyacheslavZemko opened this issue Sep 11, 2024 · 0 comments

Comments

@VyacheslavZemko
Copy link

**Stencil version: @stencil/core@3.4.0

I'm submitting a ...
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://chat.stenciljs.com

Current behavior:
When using the camera inside Telegram WebView, the <video> element displays a black screen instead of the camera feed. This behavior is specific to the WebView environment and does not occur in standard browsers. The issue seems related to modern autoplay policies in WebView, which block videos from playing unless they are muted.

Expected behavior:
The camera feed should be displayed properly in the <video> element without any issues in Telegram WebView.

Steps to reproduce:

  1. Open the app inside Telegram WebView.
  2. Start accessing the camera stream.
  3. The <video> element will show a black screen instead of the camera feed.

Related code:

<video autoplay playsinline></video>

To fix the issue, adding the muted attribute to the <video> element resolves the problem:

<video autoplay playsinline muted></video>

Other information:
This issue occurs specifically in Telegram WebView. Adding the muted attribute allows the video stream to play correctly. This behavior could be related to WebView's autoplay restrictions that prevent unmuted videos from playing automatically.

Pull Request:
I plan to submit a pull request with the proposed fix that adds the muted attribute to the <video> element in the appropriate components.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant