Remote form field.as('text', defaultValue) uses stale field value across dynamic route records
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 20.8k
- Forks
- 2.3k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 156
Description
Describe the bug
When using experimental remote forms ( @sveltejs/kit@2.59.1) on a dynamic edit route, field.as('text', defaultValue) can display a stale value from a previously visited record instead of the current route data.
The route data is correct, but the value returned by .as('text', data.task.title).value is stale.
Workaround: Old way.... this works correctly:
<input {...taskInfo.fields.title.as('text')} value={data.task.title} />
In the attached screenshot, the title should say "Hello World 2" (from the data load), instead it shows the previously visited stale title.
src/routes/tasks/[id]/edit/+page.svelte
Reproduction
<script lang="ts"> import { taskInfo } from './task-edit.remote'; let { data } = $props(); </script><div>data.task.title: {data.task.title}</div>
<div>field.value(): {taskInfo.fields.title.value()}</div>
<div>as value: {taskInfo.fields.title.as('text', data.task.title).value}</div>
Server load
export async function load({ params }) {
const id = Number(params.id);
const rows = await db.select().from(task).where(eq(task.id, id));
return {
task: rows[0]
};
}
Steps:
Navigate to /tasks/1/edit.
Edit or interact with the title input.
Navigate back to the task list.
Navigate to /tasks/2/edit.
Observe that data.task.title is correct for task 2, but the input may show the stale title from task 1.
Expected behavior
field.as('text', data.task.title) should render the current data.task.title when the route data changes, or the docs should clarify that the second argument is only a fallback behind existing remote form input state.
Actual behavior
The input can show a stale value from a previous dynamic route record.
This works correctly:
<input {...taskInfo.fields.title.as('text')} value={data.task.title} />
Logs
System Info
@sveltejs/kit@2.59.1
Severity
annoyance
Additional Information
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the reproduction in src/routes/tasks/[id]/edit/+page.svelte and reproduce the navigation from task 1 to task 2. Trace taskInfo.fields.title.as('text', data.task.title) and its remote-form state across the route change. Done means the field shows the current data.task.title, or the documented fallback behavior is made explicit.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100