form icon indicating copy to clipboard operation
form copied to clipboard

Excessive rerenders with SolidJS and classList

Open mac501pl opened this issue 10 months ago • 1 comments

Describe the bug

Using Solid's classList inside a form.Field when name attribute and onBlur handler are present causes the field to be rerendered multiple times when blurred (10 times initially, 4 times each following blur)

Your minimal, reproducible example

https://stackblitz.com/edit/solidjs-templates-zqhzdfcv?file=src%2Findex.tsx

Steps to reproduce

  1. Open up the preview in a new tab and open the console
  2. Click inside and then click outside the input field
  3. "rerender" gets logged multiple times

Expected behavior

Rerender to happen at most once

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

Tested on the latest Chrome/Windows 11

TanStack Form adapter

solid-form

TanStack Form version

v1.3.0

TypeScript version

v5.8.3

Additional context

Removing the name attribute fixes the issue

mac501pl avatar Apr 05 '25 22:04 mac501pl

I just realized that under the Solid context the field isn't "rerendered" as I described, but the test function is still called more times than it should be :)

mac501pl avatar Apr 05 '25 23:04 mac501pl