Card is not rendered correctly when embedded (widget.js)

[pangeaner]

When embedding a tweet it is not longer displayed as card (as before) but as text only tweet. Embed is done by the embed feature directly in a given tweet. Exsample:

<blockquote class="twitter-tweet" data-lang="de"><p lang="en" dir="ltr">Six Ways To Succeed At Remote Work - &quot;Walk the floor -- even if it’s a virtual floor&quot; <a href="https://t.co/LzDEX6syfy">https://t.co/LzDEX6syfy</a> <a href="https://t.co/VIQvZShnfs">pic.twitter.com/VIQvZShnfs</a></p>&mdash; Homeoffice Guru (@homeoffice_guru) <a href="https://twitter.com/homeoffice_guru/status/953231110116438016?ref_src=twsrc%5Etfw">16. Januar 2018</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Screenshot from a browserstack.com test.

But it should look like this:

Live-Demo of sites with this problem:

1. https://github.com/twitter/wordpress/wiki#customize-embedded-tweets
2. http://test.homeoffice.guru/index.hmtl
3. http://homeoffice.guru/new-work-telearbeit-homeoffice-und-digital-workspace-news-kw2-2018/

I was able to reproduce this on:

• Google Chrome Version 63.0.3239.132 (64-Bit) on Windows 10
• Firefox 57 on Windows 10

[evansobkowicz]

Hi @pangeaner,

I tested http://homeoffice.guru/new-work-telearbeit-homeoffice-und-digital-workspace-news-kw2-2018/1 on Chrome 63 and Firefox 57 (both on Windows 10) and could not reproduce this issue. The Tweets rendered correctly for me.

Can you let me know if you’re seeing any errors in the JS console?

Thanks!

[pangeaner]

Hi @evansobkowicz,

I found out that https://github.com/twitter/wordpress/wiki#customize-embedded-tweets is not an exsample of the problem, which compromized my browserstack.com test.

It seems to be a local problem. But it occures even with all browser plugins deactivated.

For http://test.homeoffice.guru/index.hmtl :

• On my machine Firefox 57 @ Win10 works
• On my machine Chrome 63 @ Win 10 the problem occurs

Console output als plain text:

index.hmtl:1 This page was loaded non-securely in an incognito mode browser. A warning has been added to the URL bar. For more information, see https://goo.gl/y8SRRv.
widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html:12 Uncaught DOMException: Failed to read the 'localStorage' property from 'Window': Access is denied for this document.
    at o (https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:12:6652)
    at Object.<anonymous> (https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:12:6796)
    at n (https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:5:394)
    at Object.<anonymous> (https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:5:543)
    at n (https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:5:394)
    at https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:5:510
    at https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:5:515
    at https://platform.twitter.com/widgets/widget_iframe.9c00c8ca14a8618c4db8e2c43139b138.html?origin=http%3A%2F%2Ftest.homeoffice.guru:12:10018

[evansobkowicz]

Hi @pangeaner,

Can you check to see if you’re blocking 3rd party cookies and site data in your Chrome settings?

See this article for more details: https://www.chromium.org/for-testers/bug-reporting-guidelines/uncaught-securityerror-failed-to-read-the-localstorage-property-from-window-access-is-denied-for-this-document

Thanks!

[pangeaner]

Hi @evansobkowicz ,

yay, that solves the issue. Thank you so much!!

Best,
Florian

[evansobkowicz]

Great!

[janfabry]

I don’t think we can expect the visitors to our websites to find and change this setting, just to be able to see the embedded tweets. Most of them will not care, or think our websites are broken. As a result, I expect major sites to move to their own Twitter embed scripts or just stop using Twitter embeds.

I don’t know whether it was a change in Chrome or a change in the Twitter embed script that now causes this exception, but if I were Twitter, I would seriously consider this an issue to take up, and not just push it down to the end-user. You script should not throw an error because localstorage is not available.

[evansobkowicz]

@janfabry We’re working on this. Hoping to have a fix out soon!

[system]

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.