diff --git a/packages/react/test-app/Pages/Links/PropUpdate.jsx b/packages/react/test-app/Pages/Links/PropUpdate.jsx
new file mode 100644
index 000000000..4f2837598
--- /dev/null
+++ b/packages/react/test-app/Pages/Links/PropUpdate.jsx
@@ -0,0 +1,15 @@
+import { Link } from '@inertiajs/react'
+import { useState } from 'react'
+
+export default () => {
+ const [href, setHref] = useState('/sleep')
+
+ return (
+
+
+
+ The Link
+
+
+ )
+}
diff --git a/packages/svelte/test-app/Pages/Links/PropUpdate.svelte b/packages/svelte/test-app/Pages/Links/PropUpdate.svelte
new file mode 100644
index 000000000..e22ed5c60
--- /dev/null
+++ b/packages/svelte/test-app/Pages/Links/PropUpdate.svelte
@@ -0,0 +1,16 @@
+
+
+
+
+
+ The Link
+
+
diff --git a/packages/vue3/test-app/Pages/Links/PropUpdate.vue b/packages/vue3/test-app/Pages/Links/PropUpdate.vue
new file mode 100644
index 000000000..4b792d5d7
--- /dev/null
+++ b/packages/vue3/test-app/Pages/Links/PropUpdate.vue
@@ -0,0 +1,13 @@
+
+
+
+
+
+ The Link
+
+
diff --git a/tests/app/server.js b/tests/app/server.js
index 213ccca6c..e17e23f3d 100644
--- a/tests/app/server.js
+++ b/tests/app/server.js
@@ -72,6 +72,7 @@ app.get('/links/headers/version', (req, res) =>
inertia.render(req, res, { component: 'Links/Headers', version: 'example-version-header' }),
)
app.get('/links/data-loading', (req, res) => inertia.render(req, res, { component: 'Links/DataLoading' }))
+app.get('/links/prop-update', (req, res) => inertia.render(req, res, { component: 'Links/PropUpdate' }))
app.get('/visits/partial-reloads', (req, res) =>
inertia.render(req, res, {
@@ -311,7 +312,7 @@ app.get('/deferred-props/page-2', (req, res) => {
})
app.get('/svelte/props-and-page-store', (req, res) =>
- inertia.render(req, res, { component: 'Svelte/PropsAndPageStore', props: { foo: req.query.foo || 'default' }}),
+ inertia.render(req, res, { component: 'Svelte/PropsAndPageStore', props: { foo: req.query.foo || 'default' } }),
)
app.all('/sleep', (req, res) => setTimeout(() => res.send(''), 2000))
diff --git a/tests/links.spec.ts b/tests/links.spec.ts
index a45217788..adc8bda05 100644
--- a/tests/links.spec.ts
+++ b/tests/links.spec.ts
@@ -754,3 +754,12 @@ test.describe('data-loading attribute', () => {
await expect(link2).not.toHaveAttribute('data-loading')
})
})
+
+test('will update href if prop is updated', async ({ page }) => {
+ await page.goto('/links/prop-update')
+ const link = await page.getByRole('link', { name: 'The Link' })
+ const button = await page.getByRole('button', { name: 'Change URL' })
+ await expect(link).toHaveAttribute('href', /\/sleep$/)
+ await button.click()
+ await expect(link).toHaveAttribute('href', /\/something-else$/)
+})