SolidJS

S

SolidJS

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

Join

Content Security Policy Issues

When attempting to deploy with docker I get these errors in the console Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). and Content Security Policy: The page’s settings blocked the loading of a resource at http://localhost:4173/favicon.ico (“default-src”). ...

Build process stalls when global variables present

I am using solid-start and cloudflare-workers plugin for vite. I have API secrets that I defined within cloudflare. My problem is that my build process gets stalled when I define variables using these secrets, like so:
const secret: string = import.meta.env.DEV ? (process.env.SESSION_SECRET as string) : SESSION_SECRET
const secret: string = import.meta.env.DEV ? (process.env.SESSION_SECRET as string) : SESSION_SECRET
...

Unexpected token in testing render method

Hello, I'm just trying to test something and experienced with this problem. I follow the guide from https://docs.solidjs.com/guides/how-to-guides/testing-in-solid/vitest#creating-tests I can't get why that problem happens....

Module Federation inside a Monorepo

I have a Monorepo with multiple Solid Projects. I want to host some components inside one of them to use them in another. The motivation for this is, that the deployment for one of the projects is quite a long process. So I just want to import a "tab" component and be able to edit it remotely.

routeData arguments

How do I pass arguments from component props into a routeData function (for data-fetching with a key for example) ?

<Show> transition when opening/closing

If I use <Show> to show or hide some details, i.e. ```jsx const [isExpanded, setIsExpanded] = createSignal(false); ...

Solid Testing Library

Guys , I have a function which has some signal and store updation inside it and I call this function by Clicking a button. Whenever I am doing userEvent click on the button my signal is not updating. I have to manually update the signal like below . ```createRoot((dispose) => { setSingal({ list: Array(5).fill(0)}); dispose();...

How to create a signal for a webkitdirectory input

I have an app which looks like this: ```ts import { createSignal, type Component } from 'solid-js'; const App: Component = () => {...

Different suspense boundaries between client and server

During my work I noticed that by using only one global suspense boundary, many components unnecessarily rerender on the server. Wrapping the components with Suspense boundaries would reduce the amount of rerenders on the server. But adding these extra suspense boundaries impacts the client side navigation experience. What I'd like to do is to create different suspense boundaries depending if I am on the client or on the server, like so: ```jsx...

Props Reactivity to Signal and Signal Change to the props

Hi people, does someone ever face to the problem of passing props reactivity to an internal state and have to bubble up the change of internal change to the props. Like Modal Component that have a internal function to close (because the close button is inside) and a prop to say "Hey yo should open based on an external behavior"...

Using CSR mode, got asset error when there is a new build

I have a SolidStart project configured to use Client-side rendering (set ssr:false in vite.config.js) and deployed to Google Cloud. When there is a new deploy, the new bundle is generated with new hash. The browser is using the old bundle, so when I change pages, I got the bundle error as attached. What can I do to solve this?...

Deployment Failure on Netlify

Not sure if the problem is with the lockfile or the pnpm version? 2:37:15 PM: Found pnpm version (7.13.4) that doesn't match expected () Usage Error: Invalid package manager specification in CLI arguments; expected a semver version, range, or tag 2:37:15 PM: $ corepack prepare [--activate] [--all] [--json] [-o,--output] ......

onClick event not appearing in DOM

Hi I have my Popup component as child to my Modal component. I would like to set an onClick event on my Popup component to stop propagation of the click event up to the Modal component. However, the click event does not appear in the DOM at all. I have no clue how to debug this. Does anybody know what is going on? My Popup component: ```js...

How should i render components stored in array?

```js const arr = [<Component props={$prop}>, <ComponentTwo props={$prop}>] return(...

How "beta" is SolidStart?

Hey, sorry for the weird phrasing of the question. I am currently starting a new small customer project and was wondering if it would be worth checking out solidStart for this. However the beta disclaimer (while appreciated) is a bit discouraging. ...

Remove item from store list?

I have tried: ```typescript const itemId = 5; setMainStore( "mylist",...

setstore mutate more than one property in one call

Assume I have a store with a list of objects. Can I write a single call to setStore() (without produce or reconcile) that modifies two or more properties of one or more objects in the array ? In other words, if produce and reconcile already do this, how do they do it ? What do they return that enables them to mutate one object (not replace it, because it causes components with For to be recreated instead of updated) and change two or more properties in one go ?...

Resource refetch doesn't trigger effect

I have this effect in my root layout (solid-start) ```ts const user = useUser(); createEffect(() => {...

Triggering css transition on signal change?

Is that possible? Just when reactive variable gets changed, it would just do simple fade-in.

`@solidjs/router` doesn't seem to work with Capacitor

In my index.tsx, I defined the routing like this ``` <Router> <Routes>...