Embedding lastest tweet using partytown throws error

[ghost]

• [ ] I am interested in helping provide a fix!

Describe the bug We are embedding 1 latest tweet in our svelte app which is working fine as normal javascript. But if we use text/partytown as type we are getting some JSON error.

To Reproduce Our code looks something like this.

<main>
    <a class="twitter-timeline" 
           data-tweet-limit="1" 
           data-chrome="nofooter noborders"
           data-dnt="true" 
           href="https://twitter.com/QwikDev"></a>
    <script async 
                src="https://platform.twitter.com/widgets.js" 
                charset="utf-8" 
                type="text/partytown"></script>
</main>

if you remove the type attribute, latest tweet will be shown in screen. but with partytown, but the tweet card will not be rendered (with error in console).

Reproduction link can be reproduced here https://codesandbox.io/s/jovial-chatelet-cn802q?file=/public/index.html

Expected behavior tweets to be loaded using partytown

Partytown version 0.7.2

Screenshots Error Screenshot

Additional context this issue is happening only if we embed latest tweets. but embedding specific tweet directly as shown in https://partytown.builder.io/tests/integrations/twitter/ works fine.

[mhevery]

Thank you for the reproduction! That makes a world of difference!

I am currently looked into it

[mhevery]

Good news and bad news.

Good news: https://github.com/BuilderIO/partytown/pull/311 fixes the underlying issues. Bad news: It still does not work.

Before https://github.com/BuilderIO/partytown/pull/311 the code just crashed. So https://github.com/BuilderIO/partytown/pull/311 is the correct to fix.

With https://github.com/BuilderIO/partytown/pull/311 the code works correctly and correctly renders the output in the iframe However, it does not correctly set the iframe width/height properties. It seems like there is a race condition in Twitter code such that it only works in a fully synchronous environment. If a breakpoint is placed in the code, then the Twitter code incorrectly sets the <iframe style="width: 0px; height: 0px"> Manually overriding the output correctly shows the proper value.