Skip to content

Commit

Permalink
Render <turbo-cable-stream-source> as display: none
Browse files Browse the repository at this point in the history
Since the `<turbo-cable-stream-source>` is a Custom Element, it has a
default `style:` property of `display: inline`. As a visible element, it
participates in the page's layout.

This commit changes the element to always be `display: none` so that it
no longer participates in the layout.
  • Loading branch information
seanpdoyle committed Jan 13, 2024
1 parent 00cae6a commit b8aa611
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 2 deletions.
11 changes: 11 additions & 0 deletions app/assets/javascripts/turbo.js
Original file line number Diff line number Diff line change
Expand Up @@ -4943,7 +4943,18 @@ function walk(obj) {
}), {});
}

const template = Object.assign(document.createElement("template"), {
innerHTML: "<style>:host { display: none; }</style>"
});

class TurboCableStreamSourceElement extends HTMLElement {
constructor() {
super();
this.attachShadow({
mode: "open"
});
this.shadowRoot.appendChild(template.content.cloneNode(true));
}
async connectedCallback() {
connectStreamSource(this);
this.subscription = await subscribeTo(this.channel, {
Expand Down
Loading

0 comments on commit b8aa611

Please sign in to comment.