JSFiddle - React, Tailwind, and code Playground

by PeterShafer

HTML

<script src="https://rawgit.com/x-tag/core/747c675e038fc5b823783c880011ff3b8bf4ea14/dist/x-tag-core.js"></script>
<youtube-player id="2A78kQc5ol4"></youtube-player>

JavaScript

(function() {
    // Define component
    xtag.register('youtube-player', {
        content: '<iframe width="560" height="315" '
               + 'src="" class="youtube" frameborder="0" '
               + 'allowfullscreen></iframe>',
        lifecycle: {
            // Fires when an instance of the element is created
            created: function() {
                var e = this.firstElementChild;
                e.src="//www.youtube.com/embed/"
                      +this.getAttribute("id");
            },
        },
    });
}());