Recent searches

No recent searches

Search options

Only available when logged in.
shakedown.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
A community for live music fans with roots in the jam scene. Shakedown Social is run by a team of volunteers (led by @clifff and @sethadam1) and funded by donations.

Administered by:

Server stats:

269
active users

shakedown.social: AboutStatusProfiles directoryPrivacy policy

Mastodon: AboutGet the appKeyboard shortcutsView source codev4.4.0

#customelement

0 posts0 participants0 posts today
Dave Copeland :ruby:<p><a href="https://ruby.social/tags/TIL" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>TIL</span></a>, (and I cannot find documented), but can easily replicate is that when a <a href="https://ruby.social/tags/WebComponent" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebComponent</span></a> <a href="https://ruby.social/tags/CustomElement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CustomElement</span></a>'s `connectedCallback()` is called, `innerHTML` is undefined, UNLESS, you wait to define your custom element after DOMContentLoaded.</p><p>I wish there was a callback for a custom element that amounted to “the element has been loaded", but I can see that this doesn't necessarily make sense.</p><p>[Can't recreate in codepen since it runs all stuff after DOM loaded.]</p><p><a href="https://gist.github.com/davetron5000/255ff81851c18a220fa73b329cd8ed4d" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">gist.github.com/davetron5000/2</span><span class="invisible">55ff81851c18a220fa73b329cd8ed4d</span></a></p>
🧿🪬🍄🌈🎮💻🚲🥓🎃💀🏴🛻🇺🇸<p>Using <a href="https://mastodon.social/tags/DeclarativeShadowDOM" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>DeclarativeShadowDOM</span></a> to render placeholder content that gets replaced later as the <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>HTML</span></a> <a href="https://mastodon.social/tags/streams" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>streams</span></a> in with no <a href="https://mastodon.social/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JavaScript</span></a>!</p><p><a href="https://lamplightdev.com/blog/2024/01/10/streaming-html-out-of-order-without-javascript/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">lamplightdev.com/blog/2024/01/</span><span class="invisible">10/streaming-html-out-of-order-without-javascript/</span></a></p><p>This is an interesting technique, but it has limitations in that you can't close the <a href="https://mastodon.social/tags/customElement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>customElement</span></a> until you've loaded the content.</p><p><a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/shadowDom" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>shadowDom</span></a> <a href="https://mastodon.social/tags/webComponents" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webComponents</span></a> <a href="https://mastodon.social/tags/customElements" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>customElements</span></a> <a href="https://mastodon.social/tags/http" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>http</span></a> <a href="https://mastodon.social/tags/streaming" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>streaming</span></a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>web</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a></p>
🧿🪬🍄🌈🎮💻🚲🥓🎃💀🏴🛻🇺🇸<p><span class="h-card" translate="no"><a href="https://social.linux.pizza/@oligneisti" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>oligneisti</span></a></span> this sounds like it would be a cool <a href="https://mastodon.social/tags/CustomElement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CustomElement</span></a></p><p><a href="https://mastodon.social/tags/webComponents" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webComponents</span></a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/javaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>javaScript</span></a></p>
westbrook<p><span class="h-card"><a href="https://front-end.social/@mia" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>mia</span></a></span> It is very possible that Container Style Queries are the CSS feature that I've been most excited about the last number of year, and it is super cool to see more examples come together leveraging them and nudging browsers tiny little steps closer to shipping! 🤩 Thanks for pushing this so hard for the rest of us. 🙏 Binding this with Import Assertions for CSS is gonna take <a href="https://mastodon.social/tags/developingDesignSystem" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>developingDesignSystem</span></a> with <a href="https://mastodon.social/tags/customElement" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>customElement</span></a> and <a href="https://mastodon.social/tags/shadowDOM" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>shadowDOM</span></a> to a whole new level. 🔥</p>
TrendingLive feeds
About