On the portfolio page here - https://encyclomedia.net/portfolio/ if you go fullscreen from the lightbox in Safari, I’m getting some really crazy glitches. Here’s a link to a screen capture of what I’m seeing - https://vimeo.com/431879470/eecd52cf09
Thanks for your help, and please let me know if I need to provide more info.
Hi Tiffany,
Thank you for writing but sorry I can’t replicate the issue on my end (see the screencast below), try clearing all your caching features (plugin, server-side, CDN, and browser’s cache), also try in your browser’s incognito/private mode where there are no browser caching and browser add-ons involve.
Cheers!
Tested and does not seem to be cache related. The problem is only happening in Safari and not in Firefox or Chrome. Looks like you were testing in Firefox. I went through Essential Grid tech support and they suggest that it was plugin related (tested and it is not) or that it’s a conflict between the theme and essential grid. Is there anything further that I can try here?
Hello Tiffanny,
I have tested your site on my Mac with the Safari browser. I could not replicate the issue as well.
Kindly clear your browser cache or use private browsing mode in your Safari. Please also make sure that there aren’t any browser extensions in your Safari browser that may have caused it.
Best Regards.
The issue is only happening when you go full screen with the video. I have tried in private browsing mode in Safari, and it continues to happen.
Hello Tiffanny,
I have tested again the site and yes I can see what you mean. This is an issue with the browser rendering between the video in the lightbox and the grid items behind it. As you view the video in fullscreen, the your Safari browser becomes fullscreen as well and behind the lightbox, the grid items resizes themselves in masonry layout. The browser and the hardware acceleration of Safari is lagging which is evident and this is why we are seeing. If you test the same manner in Firefox or in Chrome, you will not notice it because they are more capable of rendering things unlike Safari which is falling behind in the modern browser race.
Hope this makes sense.
Something has changed from when we launched the site a few months ago because this was not happening then. Do you have any other suggestions?
It is also happening in Firefox on mobile but not happening in Safari in mobile.
Hi Tiffany,
I’m able to reproduce it on Safari mobile too (iOS). But not always, sometimes reloading the page fixes it. I did some research and this seems to be common on Safari, and not something can be fixed through CSS, since a full screen video is just another window on top of the current page.
May I know what iOS and Mac OS version you currently have? If it’s old then I recommend updating them and test it again.
Thanks!
Our whole team has been testing and everyone is seeing the issue. I’m personally testing on OS 10.14.6 and Safari 13.1, but coworkers are testing on OS 10.15.3
Hey Tiffany,
I could replicate the issue continuously but the same as what Rad said, this isn’t fixable with CSS nor there is a workaround.
What is important to know now is if our theme has something to do with the issue. Please switch to the default WordPress theme and check if the issue persists. Please also do test for plugin conflict and ensure that everything is up to date according to our version compatibility list at https://theme.co/docs/version-compatibility. Please follow the best practices when updating your theme and plugins. See https://theme.co/docs/how-to-update for more details.
If the issue persists, after doing those test, the issue could be a bug in the Essential Grid so we would need to report this to the Essential Grid developers.
Thanks.
I have checked for plugin conflict, but none of the plugins seem to be the culprit. I’ve switched a version of the site to the Twenty Fifteen theme to test for theme conflict. I had to rebuild some posts to test because the current grid is pulling from Portfolio items which do not exist in the Twenty Fifteen theme. The fullscreen glitches do not show up using the default theme. Here’s a link to the test - https://encyclomedia.net/wp/portfolio/
Hey Tiffany,
Thanks for doing the suggested test. I see that the test site is working properly so there could be something in our theme causing the issue.
In your test site, would you mind switching to Pro and then post the Essential Grid in the WordPress Editor. Don’t use the Content Builder. Then, use the Blank No Container | No Header No Footer Page Template to take the Header and Footer out of the equation.
That will narrow the issue down more and will give us a bit of an idea of where the issue is coming from.
Thanks.
I switched over to Pro, and the new test grid that I had made pulling from Posts as the source seems to still be working okay - https://encyclomedia.net/wp/portfolio-test/
But when I switch back to the original grid that is using Portfolio items as the source the problem returns - https://encyclomedia.net/wp/portfolio/
Obviously that one has a lot more items in it so I wanted to make sure that wasn’t contributing to the problem. This last test includes a Portfolio-based grid with only a few items on it that we were using on the homepage of the site - https://encyclomedia.net/wp/portfolio-test-2/
The problem returns again.
It’s all super strange since this is a fairly new issue and wasn’t happening when we launched the site.
In other news, we also just discovered that the first link https://encyclomedia.net/wp/portfolio-test is playing incorrectly on mobile even though it was working on the desktop.
Thanks for doing the tests, Tiffany. This would require further investigation which might take hours so what I’ll do is post this in our issue tracker so it will be queued for troubleshooting by our development team. Please don’t take down your staging site and also provide the following info in a Secure Note so our developers could log in and see your setup.
For now, I’d recommend finding another solution for your live site. Try using The Grid plugin which is also bundled in our theme. Please visit the links below for more details and plugin usage instructions.
Thanks.
I added the secure note above with the requested info. Is it possible to access an older version of Pro? This problem was not happening when we launched so I would like to check if that might resolve the issue.
Hey Tiff,
Yes, we provide the previous stable version. You can download it by going to your Account Dashboard, clicking one of your Pro licenses then finally, downloading the Stability release.
Hope that helps.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.
