Skip to content

Fix raw JSON validation errors on endpoint creation - #236

Merged
morcen merged 1 commit into
mainfrom
fix/issue-140-endpoint-create-validation-errors
Sep 26, 2026
Merged

morcen merged 1 commit into
mainfrom
fix/issue-140-endpoint-create-validation-errors

Conversation

@morcen

@morcen morcen commented Sep 25, 2026 •

Copy link
Copy Markdown
Owner

What was broken

The "Create Endpoint" modal's save handler (resources/js/Pages/Endpoints/Index.vue) submits via a raw axios.post() call instead of Inertia's form.post(), because it needs to read the one-time plain_secret back from the JSON response on success. This bypasses Inertia's normal client-side error handling, which flattens Laravel's validation error response.

Laravel's default JSON validation-error response shapes each field as an array of messages, e.g. { "name": ["The name field is required."] }. The catch handler assigned this raw array straight into form.errors via form.setError(error.response.data.errors). InputError.vue expects its message prop to be a String, so Vue rendered the array via JSON.stringify, showing users a raw blob like ["The name field is required."] instead of a readable message — on every validation failure when creating an endpoint (duplicate name, invalid/unsafe URL, etc.).

What changed

  • Flatten each field's error array down to its first message before calling form.setError(), matching the error shape Inertia's own form submissions already produce elsewhere in the app.
  • Added tests/Feature/EndpointCreateValidationErrorFormatTest.php, a regression test pinning down the JSON validation-error response shape (array of messages per field) that the frontend fix depends on for the AJAX endpoints.store route.

Testing

  • vendor/bin/pint --dirty — passes
  • composer test (full PHPUnit suite) — 277 passed, 1 skipped, 0 failed

Fixes #140

The Create Endpoint modal submits via a raw axios call so it can read
back the one-time plain_secret on success, bypassing Inertia's normal
form submission which flattens Laravel's per-field array of validation
messages into a single string. Because form.setError() received the
raw array and InputError.vue renders its message as a string, every
validation failure (duplicate name, invalid URL, etc.) showed the user
a raw JSON blob like ["The name field is required."] instead of a
readable message.

Flatten each field's error array to its first message before calling
form.setError(), matching the shape Inertia's own form submissions
already produce elsewhere in the app.
@morcen
morcen merged commit cdbd35d into main Sep 26, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Create Endpoint shows raw JSON validation errors instead of readable text

1 participant