feat(app): create better custom error message from the provided input

[ravvi-kumar]

related discussion #361

[fabian-hiller]

Please explain this PR. With the changes we recently added in #397, you can access the issue and therefore the current value. You should have everything you need to create rich error messages.

[ravvi-kumar]

Hi @fabian-hiller,
i checked the changes in the PR that you mentioned, but i couldn't find the solution i was looking for. can you help me out if i am missing anything. my goal is to achieve this scenerio which is using zod's refine method to create a custom error message which returns a clear message including the input from the data provided in the runtime. here is the code example : -

.refine(
        (val) => {
          const options = val.options.map((v) => v.value);
          return options.includes(val.initial_value);
        },
        (val) => ({
          message: 'Scope: initial_value "${val.initial_value}" must exist in options',
        })
      )

i am trying to acheive the same with the custom method, but the current blocked that i am facing is that i am unable to include the provided input along with the error message , example : -

custom((val) =>
                        val.options.map((v) => v.value).includes(val.initial_value)
                        // #TODO : return better error message
                        // `Type: initial_value "${val.initial_value}" must exist in options`
                    ),

i have done some changes in the "custom" function and made it to accept a third optional parameter which will modify the error message with the provided input, it won't effect anywhere else. and i have also added a test case .
hope this test case might bring clear explaination of what i am trying to acheive .

  test('should return custom error message including input value', () => {
    const val = -1;
    const error = `provided value is : ${val}`;
    const validate = custom<number>((input) => input > 0, undefined, (input) => `provided value is : ${input}`);
    expect(validate._parse(val).issues?.[0].context.message).toBe(error);
  })

please do let me know if there is something that i am missing, thanks.

[fabian-hiller]

With the latest version you should be able to write the following. Try it out in our playground. I am currently rewriting Valibot and improving the types. I expect that // @ts-ignore (or any other workaround) will not be necessary in the next version.

import * as v from 'valibot';

const Schema = v.object(
  {
    initial: v.string(),
    options: v.array(v.string())
  },
  [
    v.custom(
      (input) => input.options.includes(input.initial),
      // @ts-ignore
      (issue) => `Scope: initial_value "${issue.input.initial}" must exist in options`
    )
  ]
);

[ravvi-kumar]

@fabian-hiller ,
thanks it worked.