Bug: Incorrect Validation Message Format for Numeric Comparisons #35

Component

• formulus (React Native mobile app)

• formulus-formplayer (React web app)

• synkronus (Go backend server)

• synkronus-cli (Command-line utility)

• Documentation

• Other (please specify)

User Story

As a user filling out forms in Formulus, I want to see clear and understandable validation error messages so that I can quickly understand what value is required and fix my input.

Description

Validation error messages for numeric fields with minimum or maximum constraints display raw comparison operators and values instead of user-friendly text. For example, the error message shows "must be > 25" instead of a properly formatted message like "Value must be greater than 25".

Details

• When does this bug occur? Always when validation fails for numeric fields with minimum/maximum constraints
• What triggers the bug? Entering a numeric value that violates the field's minimum or maximum constraint and attempting to submit or validate the form
• Any patterns or related issues?
  • Affects all comparison operators (>, >=, <, <=)
  • Likely affects all numeric validation constraints (minimum, maximum, exclusiveMinimum, exclusiveMaximum)
  • The issue appears to be in the validation message formatting layer

Steps to Reproduce

1. Create a form schema with a numeric field that has a minimum or maximum constraint (e.g., "minimum": 25 or "maximum": 100)

2. Open the form in Formulus

3. Enter a value that violates the constraint (e.g., enter 20 when minimum is 25)

4. Attempt to submit or validate the form

5. Observe the error message displaying "must be > 25" or similar unformatted text

Expected Behavior

Validation error messages should display in a user-friendly, natural language format, such as:

• "Value must be greater than 25"
• "Value must be at least 25"
• "Value must be less than 100"
• "Value must be between 10 and 50"

The message should clearly communicate the validation requirement using proper English phrasing rather than raw comparison operators.

Actual Behavior

The error message displays the raw comparison operator and value in an unformatted way:

• "must be > 25"
• "must be > [any other figure]"
• Similar issues occur with other comparison operators (<, >=, <=)

This creates confusion and a poor user experience as the message appears technical and unclear.

Acceptance Criteria

• Validation error messages for numeric fields use natural language (e.g., "must be greater than" instead of "must be >")
• All comparison operators are properly formatted:
  • > → "must be greater than" or "must be more than"
  • >= → "must be at least" or "must be greater than or equal to"
  • < → "must be less than" or "must be below"
  • <= → "must be at most" or "must be less than or equal to"
• Error messages are clear and understandable to end users
• The bug can be reproduced using the steps above and then verified as fixed
• All numeric validation constraints (minimum, maximum, exclusiveMinimum, exclusiveMaximum) display properly formatted messages

Environment

OS:

Node.js version:

Go version:

Docker version:

Component version/branch:

Additional Context

• This issue likely originates from the JSON Schema validation error message formatting
• Other form libraries (like react-jsonschema-form, jsonforms) handle this by customizing error message templates
• May need to update the validation layer to format error messages before displaying them to users
• Consider using the field's title/label in the error message for better context (e.g., "Value must be greater than 25")

Example error message displayed:
"must be > 25"

Expected format:
"Value must be greater than 25"