Jetstream API feature doesn't work with Inertia.js

[wlepinski]

• Jetstream Version: v2.2.5
• Jetstream Stack: Inertia
• Uses Teams: yes
• Laravel Version: v8.34.0
• PHP Version: PHP 8.0.3
• Database Driver & Version: MySQL 8.0

Description:

I followed the installation instructions of both Laravel and Jetstream. After enabling the Feature::api() on config/jetstream.php and pointing the browser to http://{domain}/user/api-tokens I see a blank screen with the following error on console:

app.js:22 Uncaught (in promise) DOMException: Failed to execute 'replaceState' on 'History': [object Object] could not be cloned.
    at Object.replaceState (http://example-app.test/js/app.js:22:11271)
    at Object.remember (http://example-app.test/js/app.js:22:12779)
    at r.watch.immediate (http://example-app.test/js/app.js:10:2587)
    at callWithErrorHandling (http://example-app.test/js/app.js:5827:22)
    at callWithAsyncErrorHandling (http://example-app.test/js/app.js:5836:21)
    at job (http://example-app.test/js/app.js:7770:17)
    at doWatch (http://example-app.test/js/app.js:7817:13)
    at Module.watch (http://example-app.test/js/app.js:7678:12)
    at Object.i [as form] (http://example-app.test/js/app.js:10:2531)
    at Proxy.data (http://example-app.test/js/app.js:17379:41)
app.js:22 Uncaught (in promise) DOMException: Failed to execute 'replaceState' on 'History': [object Object] could not be cloned.
    at Object.replaceState (http://example-app.test/js/app.js:22:11271)
    at Object.saveScrollPositions (http://example-app.test/js/app.js:22:4063)
    at Object.resetScrollPositions (http://example-app.test/js/app.js:22:4409)
    at http://example-app.test/js/app.js:22:11110

No other changes were done except the features list inside config/jetstream.php. While searching for the issue online I found this https://github.com/inertiajs/inertia/issues/309.

Steps To Reproduce:

• Install Laravel and Laravel Sail using curl -s "https://laravel.build/example-app" | bash
• Follow the instructions to bring the environment up using Laravel Sail
• Install Jetstream using ./vender/bin/sail composer require laravel/jetstream
• Edit the file config/jetstream.php and enable all features inside the features list
• Navigate to http://localhost/user/api-tokens

[ogu45]

I have same problem.

[dillingham]

This seems related to inertia / deepclone / remember feature.

I updated to the latest releases 0.8.6 & 0.3.6 but still seems to exist.

You can bypass this by adding {remember: false} on any form setting form data to objects.

resources/js/Pages/API/ApiTokenManager.vue

createApiTokenForm: this.$inertia.form({
    name: '',
    permissions: this.defaultPermissions,
}, {remember: false}),

---

related issues: https://github.com/inertiajs/inertia/issues/552, https://github.com/inertiajs/inertia/issues/578

related pull request: https://github.com/inertiajs/inertia/pull/575

[driesvints]

Thanks. Looks like this is an Inertia issue so please follow up on their issue tracker.

[reinink]

This has been fixed in Inertia here: https://github.com/inertiajs/inertia/pull/587

[dillingham]

confirmed bumping to latest versions of inertia works:

"@inertiajs/inertia": "^0.8.6",
"@inertiajs/inertia-vue3": "^0.3.7",

npm update && npm run dev

[reinink]

Thanks @dillingham!! I appreciate your help tracking this one down. 👍

[dillingham]

@reinink no problem, thanks for the quick fix! 🙌

[petethewizard]

I am having this issue with the latest Inertia and Jetstream, any ideas @driesvints ? Adding, {remember: false} doesn't help.

[samuelsennev]

Hey guys!

I have this laravel-inertia application with a presence channel chat and I've been facing this issue as well (still didn't fix it).

Settings inertiajs/inertia-laravel: ^0.4.3 @inertiajs/inertia: ^0.10.0 @inertiajs/inertia-vue3: ^0.5.1

What is happening

With the presence channel set, when I connect to it and then leave it, everything works perfectly.

The error occurs when, in a second scenario, when I try to leave the channel after sending a message.

As I said, when I dont send a message, everything works fine, I can connect to it and leave it, without triggering this exception.

There is no error related with broadcast event, as well with the message sent. The exception is triggered when I try to leave the channel after, and only after, i send a message.