Replaced numeric fields in bad input state with invalid value

Author: zonia3000

jschema/__tests__/bad_input_checker.test.js renamed to jschema/__tests__/bad_input.test.js

@@ -1,8 +1,7 @@
 import { describe, it, expect, vi } from 'vitest';
 import { FormManager } from '../src/lib/components/form_manager';
-import { checkBadInputs } from '../src/lib/components/bad_input_checker';
 
-describe('bad_input_checker', () => {
+describe('badInput', () => {
 	it('Detect bad input in nested object', () => {
 		const manager = new FormManager(
 			{
@@ -21,9 +20,9 @@ describe('bad_input_checker', () => {
 			},
 			vi.fn()
 		);
-		expect(() => checkBadInputs(manager.root)).not.toThrowError();
+		expect(manager.getFormData()).deep.eq({ foo: { bar: null } });
 		manager.root.children[0].children[0].badInput = true;
-		expect(() => checkBadInputs(manager.root)).toThrowError('Invalid JSON Schema data');
+		expect(manager.getFormData()).deep.eq({ foo: { bar: 'invalid' } });
 	});
 
 	it('Detect bad input in nested array', () => {
@@ -43,9 +42,9 @@ describe('bad_input_checker', () => {
 			},
 			vi.fn()
 		);
-		expect(() => checkBadInputs(manager.root)).not.toThrowError();
+		expect(manager.getFormData()).deep.eq({ foo: [0] });
 		manager.root.children[0].children[0].badInput = true;
-		expect(() => checkBadInputs(manager.root)).toThrowError('Invalid JSON Schema data');
+		expect(manager.getFormData()).deep.eq({ foo: ['invalid'] });
 	});
 
 	it('Detect bad input in nested tuple', () => {
@@ -69,8 +68,8 @@ describe('bad_input_checker', () => {
 			},
 			vi.fn()
 		);
-		expect(() => checkBadInputs(manager.root)).not.toThrowError();
+		expect(manager.getFormData()).deep.eq({ foo: [0] });
 		manager.root.children[0].children[0].badInput = true;
-		expect(() => checkBadInputs(manager.root)).toThrowError('Invalid JSON Schema data');
+		expect(manager.getFormData()).deep.eq({ foo: ['invalid'] });
 	});
 });

jschema/src/lib/components/bad_input_checker.js

@@ -19,7 +19,6 @@ import {
 	isTuple
 } from './property_utils.js';
 import { SchemaValidator } from './jschema_validation.js';
-import { checkBadInputs } from './bad_input_checker';
 
 /**
  * Creates the object used to draw the JSON Schema form, provides the functions to initialize new form elements,
@@ -380,7 +379,6 @@ export class FormManager {
 			const errors = this.validator.getErrors();
 			throw new JsonSchemaDataError(errors);
 		}
-		checkBadInputs(this.root);
 	}
 
 	/**
@@ -397,6 +395,9 @@ export class FormManager {
 				);
 			default:
 				if (element instanceof ValueFormElement) {
+					if (element instanceof NumberFormElement && element.badInput) {
+						return 'invalid';
+					}
 					return element.value;
 				}
 				throw new Error(`Unsupported type ${element.type}`);

jschema/src/lib/components/form_manager.js

@@ -9,8 +9,8 @@
 	let validationError = '';
 
 	function handleValueChange() {
-		formElement.notifyChange();
 		validate();
+		formElement.notifyChange();
 	}
 
 	function validate() {

jschema/src/lib/components/properties/NumberProperty.svelte

@@ -225,7 +225,7 @@ test('JSON Schema validation', async ({ page, workflow }) => {
 		await input.pressSequentially('e');
 		expect(form.getByText('Should be a number')).toHaveCount(1);
 		await page.getByRole('button', { name: 'Save changes' }).click();
-		await page.getByText('Form contains invalid input').waitFor();
+		await page.getByText('must be integer').waitFor();
 		await page.getByRole('button', { name: 'Discard changes' }).click();
 	});