search

jsor / lity

Lightweight, accessible and responsive lightbox.
https://sorgalla.com/lity/
MIT License
1.16k stars 196 forks source link

Youtube Video does not open in the Lightbox for Chrome #168

Open bornResponsive opened 6 years ago

bornResponsive commented 6 years ago

Hi,

Youtube video no longer opens in data-lity and just goes to youtube website. Even the example on your website does the same for Chrome Browser (v65) on macOS.

Do you have a workaround to this problem?

Many thanks.

ry4nolson commented 6 years ago

It may be specific to your chrome install. Youtube links are working for me on Chrome 65 OSX

jsor commented 6 years ago

I suspect this some other error which just prevents the lity code from running. Do you have a reproducible test case?

bornResponsive commented 6 years ago

Hi Jsor,

As mentioned above the issue can be replicated on your own website: https://sorgalla.com/lity/

Here is a video of the issue. As you can see it is fine for Vimeo but Youtube lightbox does not work on macOS for Chrome. I was able to replicate this on 2 different Macs.

https://videos.ctfassets.net/0z9hl3wp2ggj/4sOcfSe7RewCKU6CKIYmYA/262e9fe6ef2a54d1cca1403282909b66/data-lity-bug.mov

Many thanks.

jsor commented 6 years ago

Unfortunately, that doesn't help much. Still same guess as in https://github.com/jsor/lity/issues/168#issuecomment-382986878 :(

brownlo commented 6 years ago

I'm experiencing the same behavior as bornResponsive documented when I'm logged into Wordpress in Chrome 67.0.3396.87. I did not experience this behavior until recently, so it's possible a Wordpress core or plugin update is the cause, but the behavior is exactly as bornResponsive shows in his video.

I am not experiencing this behavior with the example on the Lity website.

splitrockUP commented 5 years ago

I'm having this same issue with a WordPress site. It happens using Chrome on Mac and Edge on Windows all other browsers I've tried work as expected. Are you able to reproduce the problem? URL of an affected page: https://www.faro.com/en-sg/products/construction-bim/faro-laser-scanner-focus/

Kimitri commented 5 years ago

This may be related to YouTube wanting access to the account of the currently logged in Google user. We're seeing the same error in Safari on macOS with a log message: Refused to display 'https://accounts.google.com/ServiceLogin?continue=https%3A%2F%2Fwww.youtube.com%2Fsignin%3Fhl%3Dfi%26app%3Ddesktop%26next%3D%252Fsignin_passive%26feature%3Dpassive%26action_handle_signin%3Dtrue&hl=fi&service=youtube&passive=true&uilel=3' in a frame because it set 'X-Frame-Options' to 'DENY'.

splitrockUP commented 5 years ago

I don't think this is of much help to anybody, but I had a guy fix the problem. All he told me was "I added a script to prevent redirect when clicking into a element"

martian77 commented 5 years ago

I'm not sure what's causing this - it's definitely a Chrome issue though. I can't recreate in Safari or Firefox. The workaround I've used though is to use the data-lity-target property to take the YouTube link, and set the link itself to '#'.

ry4nolson commented 5 years ago

What are the browser extensions you have installed? I can't reproduce this on any of the links provided, even in incognito.

ry4nolson commented 5 years ago

@martian77 @bornResponsive Do you see any errors in the console when the redirect happens? I think @jsor is probably right. An error is occurring somewhere in the event handler before it has a chance preventDefault().

martian77 commented 5 years ago

@ry4nolson I see no errors now I've switched to the work around I stated above - and I've done a lot of other work on the site since that change so I'm not sure what else may have affected it.

I could only recreate it in Chrome, and I currently have Version 73.0.3683.86 (Official Build) (64-bit) installed. I'm pretty light on extensions: Google docs offline, Google translate, Instapaper, LastPass and xdebug helper. I'm on a mac, if that makes any difference, on Mojave. It is a wordpress site. Also, extremely weirdly it didn't happen when I installed the site locally initially, and then it started happening, but I can't tell you what I did to cause that because I was trying to fix this for a client so I was looking at a lot of different things!

I've also tested it on Safari and Firefox on the same machine, and I got no issues with either of those.

It may even be a wordpress plugin that's interfering, since wordpress also seems to be a common denominator. It's really hard to say.

Archie22is commented 5 years ago

I am getting the same issue on Mac. Both Chrome and Safari are giving me the same error.

I get this error: Refused to display 'https://accounts.google.com/ServiceLogin?continue=https%3A%2F%2Fwww.youtube.com%2Fsignin%3Fhl%3Dfi%26app%3Ddesktop%26next%3D%252Fsignin_passive%26feature%3Dpassive%26action_handle_signin%3Dtrue&hl=fi&service=youtube&passive=true&uilel=3' in a frame because it set 'X-Frame-Options' to 'DENY'."

Chrome: Version 75.0.3770.142 (Official Build) (64-bit) Safari: Version 12.1.1 (14607.2.6.1.1)

Has anyone found a workaroiund the issue?