S
SolidJS•3y ago
Derock

solidjs not putting element in the correct spot.

https://derock.media/T45T7t.png https://derock.media/vTzp6m.png As you can see, for some reason, props.children is being placed outside of where it's supposed to be.
{image.file} • {unknown_property}
{image.file} • {unknown_property}
4 Replies
Derock
DerockOP•3y ago
<ProjectCard {...other props ommitted}>
  <pre>discord-html-transcripts</pre> is an open-source package for developers looking to create 
  Discord-style chat transcripts. It is built using <em>StencilJS</em> and <em>React SSR</em>. 
  It currently has over <em>20k</em> weekly downloads on npmjs.
</ProjectCard>
<ProjectCard {...other props ommitted}>
  <pre>discord-html-transcripts</pre> is an open-source package for developers looking to create 
  Discord-style chat transcripts. It is built using <em>StencilJS</em> and <em>React SSR</em>. 
  It currently has over <em>20k</em> weekly downloads on npmjs.
</ProjectCard>
and in the ProjectCard component, 
 <p class="...tailwind styles here...">
  {props.children}
</p>
 <p class="...tailwind styles here...">
  {props.children}
</p>
is becoming 
<p class="...tailwind styles here..."> <!-- WHERE IT SHOULD BE --> </p>
<pre data-hk="...">discord-html-transcripts</pre> 
is an open-source package for developers looking to create Discord-style chat transcripts. It is built using 
<em data-hk="...">StencilJS</em>
and 
<em data-hk="...">React SSR</em>. 
It currently has over 
<em data-hk="...">20k</em> 
weekly downloads on npmjs.
<p class="...tailwind styles here..."> <!-- WHERE IT SHOULD BE --> </p>
<pre data-hk="...">discord-html-transcripts</pre> 
is an open-source package for developers looking to create Discord-style chat transcripts. It is built using 
<em data-hk="...">StencilJS</em>
and 
<em data-hk="...">React SSR</em>. 
It currently has over 
<em data-hk="...">20k</em> 
weekly downloads on npmjs.
the issue doesn't happen 100% of the time, but im unsure of what conditions are changed when it does decide to place it outside the correct spot
Derock
DerockOP•3y ago
the following warnings show up:
Derock
DerockOP•3y ago
i made this quick demo, https://replit.com/@derock/some-solid-testing if you go here: https://some-solid-testing.derock.repl.co and inspect the dom, the text between text before child and text after child should be inside of a div (and colored red) but it is not is this a solid.js or solid-start bug? tried in the solid.js sandbox, works there looks like a solid-start error -- filing a bug report. https://github.com/solidjs/solid-start/issues/560
Unknown User
Unknown User•3y ago
Message Not Public
Sign In & Join Server To View

Did you find this page helpful?