ReactDOMServer не рендерится, чтобы реагировать-twitter-embed

Question

Я пытаюсь отобразить встраиваемые твиты с ReactDOMServer.renderToString , но это не работает. Я использую response-twitter-embed npm пакет.

Я также пробовал с другими функциями jsx, он работает. Но твит встраивания не работает. Мой код и демо ниже;

Codesandbox demo

Не работает.

  tweet = x =>
    ReactDOMServer.renderToStaticMarkup(
      <div>
        <TwitterTweetEmbed tweetId={x} />
      </div>
    );

Работы

icon = x => ReactDOMServer.renderToString(<FaTags size={x} />);

Полный код

import React, { Component, Fragment } from "react";
import ReactDOMServer from "react-dom/server";
import { TwitterTweetEmbed } from "react-twitter-embed";
import { FaTags } from "react-icons/fa";
import { render } from "react-dom";

export default class App extends Component {
  constructor() {
    super();
    this.state = {
      name: "React"
    };
  }
  tweet = x =>
    ReactDOMServer.renderToStaticMarkup(
      <div>
        <TwitterTweetEmbed tweetId={x} />
      </div>
    );
  icon = x => ReactDOMServer.renderToString(<FaTags size={x} />);
  render() {
    let tweetxx = "[tweet]1216022644614545409[/tweet]";
    let tweetx = tweetxx.replace(/\[tweet\]([0-9]{1,}?(?=\[\/tweet\]))\[\/tweet\]/g,"$1");

    return (
      <Fragment>
        <span>Doesn't work</span>
        <div dangerouslySetInnerHTML={{ __html: this.tweet(tweetx) }} />
        <hr />
        <span>Works</span>
        <div dangerouslySetInnerHTML={{ __html: this.icon(40) }} />
        <hr />
        <span>Works (Directly)</span>
        <br />
        <span>{tweetxx}</span>
        <br />
        <span>{tweetx}</span>
        <TwitterTweetEmbed tweetId={tweetx} />
      </Fragment>
    );
  }
}

render(<App />, document.getElementById("root"));