Fix raw JSON validation errors on endpoint creation - #236
Merged
Merged
Conversation
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.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What was broken
The "Create Endpoint" modal's save handler (
resources/js/Pages/Endpoints/Index.vue) submits via a rawaxios.post()call instead of Inertia'sform.post(), because it needs to read the one-timeplain_secretback 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."] }. Thecatchhandler assigned this raw array straight intoform.errorsviaform.setError(error.response.data.errors).InputError.vueexpects itsmessageprop to be aString, so Vue rendered the array viaJSON.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
form.setError(), matching the error shape Inertia's own form submissions already produce elsewhere in the app.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 AJAXendpoints.storeroute.Testing
vendor/bin/pint --dirty— passescomposer test(full PHPUnit suite) — 277 passed, 1 skipped, 0 failedFixes #140