Fix Video Unavailable problem at YouTube preview #26980

Sn-Kinos · 2024-05-09T08:48:18Z

Summary

Fixed the problem that YouTube preview shows Video Unavailable instead of the video.

Added the properties on the iframe for YouTube preview at youtube_video.tsx

Reproduce

Create a post that occurs Video Unavailable problem. I used https://youtu.be/edsx_MOhVnk on the below screenshots.

Ticket Link

No Tickets. (less than 20 lines of code change)

Screenshots

I haven't change the UI. But I can show about it w/ screenshots.

before	after

Release Note

Fixed the problem that YouTube preview shows Video Unavailable instead of the video.

mattermost-build · 2024-05-09T08:48:22Z

Hello @Sn-Kinos,

Thanks for your pull request! A Core Committer will review your pull request soon. For code contributions, you can learn more about the review process here.

pvev · 2024-05-09T15:17:32Z

hey @Sn-Kinos , thank you for your contribution. Could you please describe the exact steps on how to reproduce the issue you are trying to solve so we can create a ticket and associate it with this fix? Thanks!

Sn-Kinos · 2024-05-10T00:24:05Z

hey @Sn-Kinos , thank you for your contribution. Could you please describe the exact steps on how to reproduce the issue you are trying to solve so we can create a ticket and associate it with this fix? Thanks!

Thanks @pvev! I added the reproduce section on the text :D

Sn-Kinos · 2024-05-27T07:06:21Z

@pvev I wonder if there's anything else I need to do 🏃‍♂️

pvev · 2024-05-27T07:29:53Z

@pvev I wonder if there's anything else I need to do 🏃‍♂️

Thanks @Sn-Kinos we will start the dev review and security review and QE process now. We will keep you posted.

larkox

Codewise, LGTM. Waiting for security review.

unified-ci-app · 2024-05-27T08:16:16Z

E2E test triggered successfully for PR #26980. The corresponding commit's status check will be available shortly.

github-actions · 2024-05-27T08:17:08Z

E2E test run is starting for commit 88e5376dec80ff16ddcdb4cee8650aa44e87bb6a.
You can check its progress by either:

Looking at the corresponding commit status, which will be available in a few moments: E2E Tests/test.
Looking at the E2E test's Workflow Run, with Run ID 9251549766.
Looking at the E2E test's Cycle on the Automation Dashboard.

hmhealey

Thanks for the PR, @Sn-Kinos! I always assumed that the fact that YouTube videos didn't play for me in MM was something on my end, not that we were missing some things on the iframe. Great find!

hmhealey · 2024-05-28T22:18:29Z

webapp/channels/src/components/youtube_video/youtube_video.tsx

@@ -75,6 +76,11 @@ export default class YoutubeVideo extends React.PureComponent<Props, State> {
                    height='360px'
                    frameBorder='0'
                    allowFullScreen={true}
+                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"


Do we need to allow all these things? picture-in-picture and encrypted-media are the only ones that seem like they would be applicable to a video in MM. autoplay is technically applicable, but I don't think we want autoplaying video in MM

It's necessary and the feature has been on src as autoplay=1.

Without autoplay With autoplay

Screen.Recording.2024-05-29.at.11.02.51.mov

Screen.Recording.2024-05-29.at.11.04.53.mov

Oh right. I forgot we went from showing a static image to the actual video. That makes sense.

I guess web-share/clipboard-write are needed for a share button and accelerometer/gyroscope are needed for rotating the video then (Edit: and 360 degree videos or whatever those are called)

No changes needed about what I commented on

pvev · 2024-06-01T11:28:22Z

@Sn-Kinos sorry that this review is taking longer that normal, but there are some security concerns about this change that are being discussed internally. As soon as we define an action, we will let you know. Thanks.

Sn-Kinos · 2024-06-03T00:15:01Z

@Sn-Kinos sorry that this review is taking longer that normal, but there are some security concerns about this change that are being discussed internally. As soon as we define an action, we will let you know. Thanks.

I understand. I referred this iframe code from another commercial messenger app. I hope it can help you.

pvev · 2024-06-07T16:25:39Z

@Sn-Kinos, thank you for your patience. The decision to use the referrer policy strict-origin-when-cross-origin can expose some sensitive information, which may be considered more or less critical depending on the use case. Therefore, this decision should be made by the workspace administrator.

Given this, the idea is to make this value configurable through a parameter in the admin console. I wanted to ask if you would like to add this new configuration parameter and set the referrer policy based on that parameter (I would help and guide you through this process). Alternatively, I can merge your PR as it is and then take care of adding this configuration parameter in a subsequent PR.

Sn-Kinos · 2024-06-07T16:56:20Z

@pvev I prefer a subsequents PR. I thought there would be no problem because I brought the parameters used in Slack as it is, but I guess it wasn't?

pvev

Thank you for the contribution @Sn-Kinos 🚀

pvev · 2024-06-09T11:57:44Z

/update-branch

Sn-Kinos · 2024-06-09T12:08:08Z

@pvev I fixed lint and type error on CI. How can I re-run actions?

Sn-Kinos · 2024-06-10T13:38:46Z

@pvev I fixed code to pass all tests. Is there anything to do for me to merge this?

mm-cloud-bot · 2024-06-11T15:07:59Z

Creating a new SpinWick test server using Mattermost Cloud.

mm-cloud-bot · 2024-06-11T15:09:27Z

Mattermost test server created! 🎉

Access here: https://mattermost-pr-26980.test.mattermost.cloud

Account Type	Username	Password
Admin	sysadmin	Sys@dmin123
User	user-1	User-1@123

Your Spinwick's installation ID is: 1s8uod98hpfejyix9udpihqxqh
To access the logs, please click here

yasserfaraazkhan

before

PR changes are working as expected.

Fix YouTube preview shows Video Unavailable

b3826dc

mm-cloud-bot added the release-note Denotes a PR that will be considered when it comes time to generate release notes. label May 9, 2024

mattermost-build added the Contributor label May 9, 2024

Sn-Kinos added 2 commits May 9, 2024 17:58

Fix typo on iframe property

156264a

Remove duplicated property

88e5376

Sn-Kinos marked this pull request as draft May 14, 2024 04:05

Sn-Kinos marked this pull request as ready for review May 14, 2024 04:05

Sn-Kinos marked this pull request as draft May 22, 2024 04:59

Sn-Kinos marked this pull request as ready for review May 22, 2024 04:59

pvev requested review from pvev and hmhealey May 27, 2024 07:27

pvev added the 2: Dev Review Requires review by a developer label May 27, 2024

pvev requested review from larkox and removed request for hmhealey May 27, 2024 07:30

larkox approved these changes May 27, 2024

View reviewed changes

larkox added 3: QA Review Requires review by a QA tester. May occur at the same time as Dev Review 3: Security Review Review requested from Security Team labels May 27, 2024

hmhealey previously requested changes May 28, 2024

View reviewed changes

pvev approved these changes Jun 9, 2024

View reviewed changes

Merge branch 'master' into patch-1

18a4dbb

pvev removed the 2: Dev Review Requires review by a developer label Jun 9, 2024

fix lint error (double-quotes, unknown property)

0f24353

Sn-Kinos added 3 commits June 9, 2024 21:23

renew snapshot for youtube_video.tsx

59ea2e1

fix double quotes and newline error on snapshot for youtube_video.tsx

3cc4e72

fix blank on snapshot for youtube_video.tsx

ba2cb8c

pvev requested a review from yasserfaraazkhan June 10, 2024 14:42

yasserfaraazkhan added the Setup Cloud Test Server Setup an on-prem test server label Jun 11, 2024

yasserfaraazkhan approved these changes Jun 11, 2024

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix Video Unavailable problem at YouTube preview #26980

Fix Video Unavailable problem at YouTube preview #26980

Sn-Kinos commented May 9, 2024 •

edited

mattermost-build commented May 9, 2024

pvev commented May 9, 2024

Sn-Kinos commented May 10, 2024

Sn-Kinos commented May 27, 2024

pvev commented May 27, 2024

larkox left a comment

unified-ci-app bot commented May 27, 2024

github-actions bot commented May 27, 2024

hmhealey left a comment

hmhealey May 28, 2024

Sn-Kinos May 29, 2024

hmhealey May 29, 2024 •

edited

pvev commented Jun 1, 2024

Sn-Kinos commented Jun 3, 2024 •

edited

pvev commented Jun 7, 2024

Sn-Kinos commented Jun 7, 2024

pvev left a comment

pvev commented Jun 9, 2024

Sn-Kinos commented Jun 9, 2024

Sn-Kinos commented Jun 10, 2024

mm-cloud-bot commented Jun 11, 2024

mm-cloud-bot commented Jun 11, 2024

yasserfaraazkhan left a comment

Fix Video Unavailable problem at YouTube preview #26980

Are you sure you want to change the base?

Fix Video Unavailable problem at YouTube preview #26980

Conversation

Sn-Kinos commented May 9, 2024 • edited

Summary

Reproduce

Ticket Link

Screenshots

Release Note

mattermost-build commented May 9, 2024

pvev commented May 9, 2024

Sn-Kinos commented May 10, 2024

Sn-Kinos commented May 27, 2024

pvev commented May 27, 2024

larkox left a comment

Choose a reason for hiding this comment

unified-ci-app bot commented May 27, 2024

github-actions bot commented May 27, 2024

hmhealey left a comment

Choose a reason for hiding this comment

hmhealey May 28, 2024

Choose a reason for hiding this comment

Sn-Kinos May 29, 2024

Choose a reason for hiding this comment

hmhealey May 29, 2024 • edited

Choose a reason for hiding this comment

pvev commented Jun 1, 2024

Sn-Kinos commented Jun 3, 2024 • edited

pvev commented Jun 7, 2024

Sn-Kinos commented Jun 7, 2024

pvev left a comment

Choose a reason for hiding this comment

pvev commented Jun 9, 2024

Sn-Kinos commented Jun 9, 2024

Sn-Kinos commented Jun 10, 2024

mm-cloud-bot commented Jun 11, 2024

mm-cloud-bot commented Jun 11, 2024

yasserfaraazkhan left a comment

Choose a reason for hiding this comment

Sn-Kinos commented May 9, 2024 •

edited

hmhealey May 29, 2024 •

edited

Sn-Kinos commented Jun 3, 2024 •

edited