임베드된 YouTube 영상이 재생하려면 두 번 클릭해야 하는 경우 있음

기여 버그
1

안녕하세요, @Aizada_M 님이 포럼에서 발생한 작은 문제를 공유해 주셨는데, 특히 새 테마를 만들 때 CSS, JS, 컴포넌트 없이 비공식 플러그인도 비활성화한 상태에서 문제가 발생했기 때문에 정확한 원인을 파악하기가 어려웠습니다.

유튜브 영상을 임베드할 때, 재생하려면 두 번 클릭해야 하는 경우가 간혹 발생합니다.

안전 모드에서는 문제가 발생하지 않았습니다. 사이트를 연 다음 임베드된 영상 페이지로 이동하면 문제가 전혀 발생하지 않았거든요. :upside_down_face:

재현 방법 중 하나는 임베드된 영상 페이지로 직접 이동하는 것입니다. 다른 어떤 페이지를 연 뒤 탭을 새로고침하지 않고 자연스럽게 임베드된 유튜브 영상이 있는 페이지로 이동하면 문제가 발생하지 않습니다. 이것이 제가 안전 모드에서 재현하지 못한 이유입니다. URL 끝에 ?safe_mode=no_themes,no_plugins를 붙일 수 있다는 사실을 몰랐고, 항상 https://my-discourse/safe-mode로 들어간 뒤 이동했기 때문입니다.

재현 단계:

  1. https://meta.discourse.org/t/embedded-youtube-full-screen-bug-part-deux/52649/2?u=canapin 로 이동하세요.

  2. 재생(Play)을 클릭하세요. 아무 반응이 없어야 합니다.

  3. 재생을 다시 클릭하세요. 영상이 재생됩니다.

재현되지 않는 단계:

  1. https://meta.discourse.org 로 이동하세요.

  2. 검색을 열고 "Seems OK to me in fullscreen?"를 입력한 뒤, 같은 탭에서 첫 번째 결과로 이동하세요.

  3. 영상을 클릭하세요. 한 번의 클릭으로 재생되어야 합니다.

2개의 좋아요
3

안녕하세요,

이것은 버그가 아닙니다. lazyYT(지연 로딩)이라는 플러그인으로, YouTube 비디오의 썸네일을 생성하여 클릭할 때만 로딩되도록 합니다. :slightly_smiling_face:

2개의 좋아요
4

정보 감사합니다 :+1:

클릭할 때 HTML 코드를 보면 어떻게 동작하는지 이해하고 있습니다.

하지만 문제를 오해하신 것 같습니다.

두 경우 모두 썸네일이 존재합니다.

그리고 두 경우 모두 썸네일을 클릭하면 예상대로 지연 로딩이 작동하여 iframe이 로드됩니다. 그러나 두 번째 경우에만 한 번의 클릭으로 영상이 재생되며, 이는 기대하는 동작입니다.

제가 설명한 첫 번째 경우의 동작은 기대하는 바가 아니며, 호버 시 강조되는 “동영상 재생” 버튼을 클릭했는데 검은 배경이 표시되고, 로딩 표시기가 나타나고, 결국 이전과 동일한 썸네일이 표시되면서 영상이 시작되지 않는 것은 사용자 경험 측면에서 좋지 않습니다.

2개의 좋아요
5

LazyYT는 곧 사라질 예정입니다. 정확히 언제, 그리고 무엇으로 대체될지는 아직 확실하지 않지만, 분명히 제거될 것입니다(대략 앞으로 3~6개월 내로).

불행히도, 이 때문에 이 특이한 현상을 디버깅하는 데 많은 시간을 쏟을 가능성은 낮습니다.

4개의 좋아요
6

네, 죄송합니다. 아마 제가 오해한 것 같습니다. 제가 Discourse를 사용할 때 lazyYT로 재생되는 YouTube 비디오는 한 번의 클릭이 아니라 두 번의 클릭으로 재생되기 때문입니다. 그리고 저는 두 번의 클릭이 예상되는 동작이라고 생각했습니다. :slightly_smiling_face:

3개의 좋아요
7

이런 경우는 다른 서비스로 옮기게 될 것이기 때문에 문제가 해결되지 않는 것이 오히려 다행이라고 생각합니다. 이는 항상 Discourse가 발전하고 있음을 의미하니까요(지금까지 아주 좋았죠! :smile:) :+1:

3개의 좋아요