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

Editor: Intermittent embed card loading issues #9796

Closed
kevinansfield opened this issue Aug 17, 2018 · 4 comments
Closed

Editor: Intermittent embed card loading issues #9796

kevinansfield opened this issue Aug 17, 2018 · 4 comments
Labels
affects:admin Anything relating to Ghost Admin affects:editor Work relating to the Koenig Editor bug [triage] something behaving unexpectedly help wanted [triage] Ideal issues for contributors to help with stale [triage] Issues that were closed to to lack of traction

Comments

@kevinansfield
Copy link
Member

kevinansfield commented Aug 17, 2018

Issue Summary

Sometimes 3rd party scripts in embeds do not load correctly. The issue is intermittent, sometimes occurring immediately on insertion or when the embed component is re-rendered. Typically the embed that has failed will work when re-opening the post.

The issue has been most noticeable with Instagram and Twitter embeds.

To Reproduce

  1. Use instagram or twitter embeds heavily, the problem should show up at some point

Technical details:

It's possible that our image resize mutationobserver is interfering with the 3rd party scripts.

  • Ghost Version: 2.0.0
  • Browser/OS: Chrome / macOS
@kevinansfield kevinansfield added bug [triage] something behaving unexpectedly affects:editor Work relating to the Koenig Editor affects:admin Anything relating to Ghost Admin labels Aug 17, 2018
@lunaticmonk
Copy link
Contributor

@kevinansfield Seems the embeds stabilize after some time. I am not sure if in your case they remain as shown in the screenshots. However, I tried throttling the internet speed. With slow internet speed, it may happen that the embeds appear as shown in screenshots at first and stabilize in a moment and appear fine. Plus I don't see any errors in console. Can you confirm?

@kevinansfield
Copy link
Member Author

@lunaticmonk as mentioned in the issue this is intermittent, it may/may not happen on each render of the embed card. My current hypothesis is that there's a timing issue somewhere in the render which is causing the scripts in the iframe not to run, or that they are running but Ember's rendering replaces the contents that have been modified by the scripts, in either case I wouldn't expect there to be an error in DevTools console.

@kevinansfield
Copy link
Member Author

With slow internet speed, it may happen that the embeds appear as shown in screenshots at first and stabilize in a moment and appear fine.

This is expected, it's how the embeds works and is unrelated to this issue. HTML that we get from the oembed endpoint is displayed in an iframe, for services such Instagram, Facebook posts, etc this includes a <script> tag that recognises the HTML and transforms it into a full embed in the same way as when you copy/paste the embed HTML directly from the 3rd party sites.

@ErisDS ErisDS added the help wanted [triage] Ideal issues for contributors to help with label Jan 24, 2019
@stale
Copy link

stale bot commented Apr 24, 2019

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the stale [triage] Issues that were closed to to lack of traction label Apr 24, 2019
@stale stale bot closed this as completed May 1, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
affects:admin Anything relating to Ghost Admin affects:editor Work relating to the Koenig Editor bug [triage] something behaving unexpectedly help wanted [triage] Ideal issues for contributors to help with stale [triage] Issues that were closed to to lack of traction
Projects
None yet
Development

No branches or pull requests

3 participants