SolidJS

S

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

Join

Easiest way to spin up an e2e/integration-test setup with solid-start?

Hey folks, I am currently trying to figure out what would be a good way to build an integration and e2e-testing setup for solid-start. Essentially my integration tests should be able to connect to a database and only test server-side logic (for UI stuff I would simply use testing-library). E2E-tests should spin up a database as well as the solid-start application. ...

Container onFocus to observe to subelement focus?

Trying the following, but the handler doesn't seem to be fired when a sidebar item is tab focused using the keyboard: ```jsx return <> <app-sidebar onFocus={() => setSidebarVisible(true)} hidden={!sidebarVisible()}>...

can't reset createInfiniteScroll

hello, at our team we are trying to create infinite scrolling with filters with @solid-primitives/pagination with signal: createInfiniteScroll but we encoutered a problem: You can't reset createInfiniteScroll cleanly, while you can clear all values like this: batch(() => { setPage(0);...

Help integrating microfuzz search library with solid

I want to integrate this library into my component https://github.com/Nozbe/microfuzz I have this code for it: ...

createResource doesn't rerun when passed store changes

Am I using this correctly? Ryan said it should work when wrapped in a function: https://github.com/solidjs/solid/discussions/902 ...

React Icons Error

React icons is not rendering on the UI please i need help

solid-eslint warning about event handlers

So, I get the eslintsolid/reactivity warning when I use reactive props in event handlers:
This function should be passed to a tracked scope (like createEffect) or an event handler because it contains reactivity, or else changes will be ignored.
```jsx createEffect(() => {...

Scroll & Drag Solid DND

Hi, do you know the best way to manage scroll (auto) when using solid dnd? Especially as I have the impression that solid DND doesn't seem to work, when you scroll manually....

How can this incredibly simple piece of code lead to "Maximum call stack size exceeded" ?

The entire code for this demo is here: https://playground.solidjs.com/anonymous/7ec72a47-1bb4-4e9f-bf1d-3103d3d2c2d0 I just adapted it from one of the tutorial pages. The culprit is one line, as far as I can tell: ...

How to protect all routes other than sign-in

Hi there, I am making an app where I only want signed-in users to see the content, I want all routes to automatically redirect to the sign-up page if the user is not signed in. Ideally, I don't want to have to add the boilerplate to check if the user is signed up on every single page, I also don't want to have to create and maintain a massive list of all the protected routes (which is virtually every route in my app) when using middleware. What is an easy way of setting something like this up?...

TypeError: Cannot read properties of undefined (reading 'remove') at reconcileArrays

I get this during a refetch() call of a resource. Pretty hard to debug and see what actually gets called where and so on. gets cought and rethrown in runComputation...

Validating a field based on promise values min and max with yup and react form handler

const schemaReference = (res) => { console.log(res); return yup.object({ unit: yup.string().required('Required'), reference: yup...

Reaching into nested properties and keeping them reactive?

Coming from React I really like that I can destruct nested props into single variables, in this example I have a JSON (using createResource with flow as the signal) that has a couple of levels where I parse it and loop it over with a <For> <For each={flow().ui.nodes}>{nodeValue}</For> The nodeValue function looks like this (I could of course inline it all, and I might, but for now it's its own function) ```typescript const nodeValue = (node) => {...

Testing difficulties in solid-start

I'm running into some perplexing errors with Vitest in my SSR-enabled Solid Start app. In the imports two files, I get Cannot set properties of undefined (setting 'modhash'). In one, it's caused by import { isBefore, parseISO } from "date-fns". In the other, by import { CentralStoreContext } from "../root".
In at least one of the test files, I've done my best to abstract the component being tested away from the routing, but I'm still getting this error. My root.tsx:...

ReactSVG like component in Solid

Hey, I recently was remaking my portfolio website in astro with some solid.js. I wanted to make an interactive carousel which basically displays some items. The problem is I need to dynamically get the SVG's (vite-plugin-solid-svg doesn't work in my case). I remember I used react-svg for that thing that exposed a ReactSVG component with a src prop. I would like to know if this is possible in solid, and if it is, has someone already done it?

Suspense not updating when navigating to Route directly

Hey folks, I am currently having a weird issue I can't quite solve: We have a route which receives data via routeData + createServerData$. The routes JSX is wrapped with <Suspense />....

How do you do logging errors etc. In solid start?

Like how do you get logs you can browse for instance in a web interface when solid start app is running in production? Things like errors, request times etc.

warnings when passing onClick as prop

I get a warning in the child component when I pass an event handler from the parent. In the parent it looks like this:
onSeeAlsoClick={[handleShowSeeAlso, index()]}
onSeeAlsoClick={[handleShowSeeAlso, index()]}
And in the child: ```<button...

Routes are being duplicated when HMR is on

It seems whenever the file updates the route is not actually refreshed and it just adds the updated content to the page. Disabling HMR solves this issue as it does a full reload.

Solidstart Astro or Vite

Created a SolidStart project and saw that it was using Astro. Looking at the docs it says the project should be in vite. Can anyone tell me what's going on? Mostly interested cause libraries are asking to add something to vite config and I don't know whether to skip that step or I've set up something wrong...