Polymer Shadow DOM behavior


#1

When using twitter for websites w/ Polymer 2 and iron-pages, the first embedded tweet seems to make all elements visible.

In the below psuedo code - both iron-page divs are changed to visible after first embedded tweet, so I see “blah blah blah” & “recent tweets”. Any pointers to preventing createTweet from messing with CSS and/or shadow dom would be appreciated!

twttr.widgets.createTweet('20', document.getElementById('tweets'), {}).then(function (el) {
    console.log("Tweet displayed.")
});
<html>
<body>
<iron-pages selected="[[selected]]">
<div>
   Blah blah blah
</div>
<div>
   Recent tweets 
  <div id="tweets"></div>
</div>
</iron-pages>
</body>
</html>


#2

<meta name="twitter:widgets:csp" content="on"> does not seem to help - in fact it prevents rendering.

Check that it is working!


#3

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