oxform-core 0.1.0

package/src/tests/array/append.spec.ts

@@ -0,0 +1,138 @@
+import { FormApi } from '#form-api';
+import type { FormOptions } from '#form-api.types';
+import { sleep } from '#utils/testing/sleep';
+import { describe, expect, it } from 'vitest';
+import z from 'zod';
+
+const schema = z.object({
+  array: z.string().array(),
+});
+
+const defaultValues = {
+  array: ['item1', 'item2'],
+};
+
+const setup = (options?: Partial<FormOptions<typeof schema>>) => {
+  const form = new FormApi({
+    schema,
+    defaultValues,
+    ...options,
+  });
+
+  form['~mount']();
+
+  return { form };
+};
+
+describe('value updates', () => {
+  it('should append a value to the end of an array', () => {
+    const { form } = setup();
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.get('array')).toStrictEqual(['item1', 'item2', 'item3']);
+  });
+
+  it('should append a value if the array is undefined', () => {
+    const { form } = setup();
+
+    form.field.change('array', undefined as any);
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.get('array')).toStrictEqual(['item3']);
+  });
+
+  it('should append a value if the array is null', () => {
+    const { form } = setup();
+
+    form.field.change('array', null as any);
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.get('array')).toStrictEqual(['item3']);
+  });
+
+  it('should append a value if the array is empty', () => {
+    const { form } = setup();
+
+    form.field.change('array', []);
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.get('array')).toStrictEqual(['item3']);
+  });
+});
+
+describe('meta handling', () => {
+  it('should update the array field meta when appending', () => {
+    const { form } = setup();
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when appending with should.dirty false', () => {
+    const { form } = setup();
+
+    form.array.append('array', 'item3', { should: { dirty: false } });
+
+    expect(form.field.meta('array').dirty).toBe(false);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when appending with should.touch false', () => {
+    const { form } = setup();
+
+    form.array.append('array', 'item3', { should: { touch: false } });
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(false);
+  });
+
+  it('should update the last items meta when appending', () => {
+    const { form } = setup();
+
+    form.array.append('array', 'item3');
+
+    expect(form.field.meta('array.0').dirty).toBe(false);
+    expect(form.field.meta('array.0').touched).toBe(false);
+  });
+
+  it('should leave the rest of the items untouched when appending', () => {
+    const { form } = setup();
+
+    form.field.change('array.2', 'updated', { should: { touch: false } });
+    form.array.append('array', 'item3');
+
+    expect(form.field.meta('array.1').dirty).toBe(false);
+    expect(form.field.meta('array.1').touched).toBe(false);
+
+    expect(form.field.meta('array.2').dirty).toBe(true);
+    expect(form.field.meta('array.2').touched).toBe(false);
+  });
+});
+
+describe('validation', () => {
+  it('should validate a field', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.append('array', 2 as any);
+
+    await sleep(0);
+
+    expect(form.field.meta('array.2').valid).toBe(false);
+    expect(form.field.errors('array.2')).toHaveLength(1);
+  });
+
+  it('should not validate a field when should.validate is false', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.append('array', 2 as any, { should: { validate: false } });
+
+    expect(form.field.meta('array.2').valid).toBe(true);
+    expect(form.field.errors('array.2')).toHaveLength(0);
+  });
+});

package/src/tests/array/insert.spec.ts

@@ -0,0 +1,182 @@
+import { FormApi } from '#form-api';
+import type { FormOptions } from '#form-api.types';
+import { sleep } from '#utils/testing/sleep';
+import { describe, expect, it } from 'vitest';
+import z from 'zod';
+
+const schema = z.object({
+  array: z.string().array(),
+});
+
+const defaultValues = {
+  array: ['item1', 'item2'],
+};
+
+const setup = (options?: Partial<FormOptions<typeof schema>>) => {
+  const form = new FormApi({
+    schema,
+    defaultValues,
+    ...options,
+  });
+
+  form['~mount']();
+
+  return { form };
+};
+
+describe('value updates', () => {
+  it('should insert string at beginning (index 0)', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual(['inserted', 'item1', 'item2']);
+  });
+
+  it('should insert string at middle index', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 1, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual(['item1', 'inserted', 'item2']);
+  });
+
+  it('should insert string at end (index equal to length)', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 2, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual(['item1', 'item2', 'inserted']);
+  });
+
+  it('should insert at an index greater than length', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 4, 'inserted');
+
+    expect(form.field.get('array')).toEqual(['item1', 'item2', undefined, undefined, 'inserted']);
+  });
+
+  it('should insert into an empty array', () => {
+    const { form } = setup();
+
+    form.field.change('array', []);
+    form.array.insert('array', 1, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual([undefined, 'inserted']);
+  });
+
+  it('should insert into an undefined array', () => {
+    const { form } = setup();
+
+    form.field.change('array', undefined as any);
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual(['inserted']);
+  });
+
+  it('should insert into a null array', () => {
+    const { form } = setup();
+
+    form.field.change('array', null as any);
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.get('array')).toStrictEqual(['inserted']);
+  });
+
+  it('should allow passing an updater function', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 0, value => value.length + ' updated');
+
+    expect(form.field.get('array')).toStrictEqual(['2 updated', 'item1', 'item2']);
+  });
+});
+
+describe('meta handling', () => {
+  it('should update the array field meta when inserting', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when inserting with should.dirty false', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 0, 'inserted', { should: { dirty: false } });
+
+    expect(form.field.meta('array').dirty).toBe(false);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when inserting with should.touch false', () => {
+    const { form } = setup();
+
+    form.array.insert('array', 0, 'inserted', { should: { touch: false } });
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(false);
+  });
+
+  it('should update the inserted item meta when inserting', () => {
+    const { form } = setup();
+
+    form.field.change('array.0', 'updated', { should: { touch: false } });
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.meta('array.0').dirty).toBe(false);
+    expect(form.field.meta('array.0').touched).toBe(false);
+  });
+
+  it('should leave the rest of the items untouched when inserting', () => {
+    const { form } = setup();
+
+    form.field.change('array.0', 'updated', { should: { touch: false } });
+    form.field.change('array.2', 'updated', { should: { dirty: false } });
+    form.array.insert('array', 0, 'inserted');
+
+    expect(form.field.meta('array.1').dirty).toBe(true);
+    expect(form.field.meta('array.1').touched).toBe(false);
+
+    expect(form.field.meta('array.2').dirty).toBe(false);
+    expect(form.field.meta('array.2').touched).toBe(false);
+
+    expect(form.field.meta('array.3').dirty).toBe(false);
+    expect(form.field.meta('array.3').touched).toBe(true);
+  });
+});
+
+describe('edge cases', () => {
+  it('handles negative index', () => {
+    const { form } = setup();
+
+    form.array.insert('array', -100, 'inserted');
+
+    expect(form.field.get('array')).toEqual(['inserted', 'item1', 'item2']);
+  });
+});
+
+describe('validation', () => {
+  it('should validate on insert by default', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.insert('array', 0, 0 as any);
+
+    await sleep(0);
+
+    expect(form.field.meta('array.0').valid).toBe(false);
+    expect(form.field.errors('array.0')).toHaveLength(1);
+  });
+
+  it('should not validate on insert by default when should.validate is false', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.insert('array', 0, 0 as any, { should: { validate: false } });
+
+    expect(form.field.meta('array.0').valid).toBe(true);
+    expect(form.field.errors('array.0')).toHaveLength(0);
+  });
+});

package/src/tests/array/move.spec.ts

@@ -0,0 +1,175 @@
+import { FormApi } from '#form-api';
+import type { FormOptions } from '#form-api.types';
+import { describe, expect, it } from 'vitest';
+import z from 'zod';
+
+const schema = z.object({
+  array: z.string().array(),
+});
+
+const defaultValues = {
+  array: ['item1', 'item2', 'item3'],
+};
+
+const setup = (options?: Partial<FormOptions<typeof schema>>) => {
+  const form = new FormApi({
+    schema,
+    defaultValues,
+    ...options,
+  });
+
+  form['~mount']();
+
+  return { form };
+};
+
+describe('value updates', () => {
+  it('should move an item forward in an array', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 1);
+
+    expect(form.field.get('array')).toEqual(['item2', 'item1', 'item3']);
+  });
+
+  it('should move an item backward in an array', () => {
+    const { form } = setup();
+
+    form.array.move('array', 2, 1);
+
+    expect(form.field.get('array')).toEqual(['item1', 'item3', 'item2']);
+  });
+
+  it('moves an item from the beginning to the end of the array', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 2);
+
+    expect(form.field.get('array')).toEqual(['item2', 'item3', 'item1']);
+  });
+
+  it('moves an item from the end to the beginning of the array', () => {
+    const { form } = setup();
+
+    form.array.move('array', 2, 0);
+
+    expect(form.field.get('array')).toEqual(['item3', 'item1', 'item2']);
+  });
+});
+
+describe('meta handling', () => {
+  it('should update the array field meta when moving', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 1);
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when moving with should.dirty false', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 1, { should: { dirty: false } });
+
+    expect(form.field.meta('array').dirty).toBe(false);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when moving with should.touch false', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 1, { should: { touch: false } });
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(false);
+  });
+
+  it('should update the moved item meta when moving forwards', () => {
+    const { form } = setup();
+
+    form.field.change('array.0', 'updated', { should: { touch: false } });
+    form.field.change('array.1', 'updated', { should: { dirty: false } });
+    form.array.move('array', 0, 1);
+
+    expect(form.field.meta('array.0').dirty).toBe(false);
+    expect(form.field.meta('array.0').touched).toBe(true);
+
+    expect(form.field.meta('array.1').dirty).toBe(true);
+    expect(form.field.meta('array.1').touched).toBe(false);
+  });
+
+  it('should update the moved item meta when moving backwards', () => {
+    const { form } = setup();
+
+    form.field.change('array.0', 'updated', { should: { touch: false } });
+    form.field.change('array.1', 'updated', { should: { dirty: false } });
+    form.array.move('array', 1, 0);
+
+    expect(form.field.meta('array.0').dirty).toBe(true);
+    expect(form.field.meta('array.0').touched).toBe(false);
+
+    expect(form.field.meta('array.1').dirty).toBe(false);
+    expect(form.field.meta('array.1').touched).toBe(true);
+  });
+});
+
+describe('edge cases', () => {
+  it('should handle negative from as 0', () => {
+    const { form } = setup();
+
+    form.array.move('array', -100, 1);
+
+    expect(form.field.get('array')).toEqual(['item2', 'item1', 'item3']);
+  });
+
+  it('should handle negative to as 0', () => {
+    const { form } = setup();
+
+    form.array.move('array', 1, -100);
+
+    expect(form.field.get('array')).toEqual(['item2', 'item1', 'item3']);
+  });
+
+  it('should handle moving with the same index', () => {
+    const { form } = setup();
+
+    form.array.move('array', 0, 0);
+
+    expect(form.field.get('array')).toEqual(['item1', 'item2', 'item3']);
+  });
+
+  it('should move an item across a wide gap', () => {
+    const { form } = setup({
+      defaultValues: {
+        array: ['item1', 'item2', 'item3', 'item4', 'item5', 'item6', 'item7', 'item8', 'item9', 'item10'],
+      },
+    });
+
+    form.field.change('array.1', 'moved', { should: { touch: false } });
+    form.field.change('array.5', 'updated', { should: { dirty: false } });
+    form.array.move('array', 1, 8);
+
+    expect(form.field.get('array')).toEqual([
+      'item1',
+      'item3',
+      'item4',
+      'item5',
+      'updated',
+      'item7',
+      'item8',
+      'item9',
+      'moved',
+      'item10',
+    ]);
+
+    expect(form.field.meta('array.1').dirty).toEqual(false);
+    expect(form.field.meta('array.1').touched).toEqual(false);
+
+    expect(form.field.meta('array.4').dirty).toEqual(false);
+    expect(form.field.meta('array.4').touched).toEqual(true);
+
+    expect(form.field.meta('array.8').dirty).toEqual(true);
+    expect(form.field.meta('array.8').touched).toEqual(false);
+  });
+});

package/src/tests/array/prepend.spec.ts

@@ -0,0 +1,138 @@
+import { FormApi } from '#form-api';
+import type { FormOptions } from '#form-api.types';
+import { sleep } from '#utils/testing/sleep';
+import { describe, expect, it } from 'vitest';
+import z from 'zod';
+
+const schema = z.object({
+  array: z.string().array(),
+});
+
+const defaultValues = {
+  array: ['item1', 'item2'],
+};
+
+const setup = (options?: Partial<FormOptions<typeof schema>>) => {
+  const form = new FormApi({
+    schema,
+    defaultValues,
+    ...options,
+  });
+
+  form['~mount']();
+
+  return { form };
+};
+
+describe('value updates', () => {
+  it('should prepend a value to the end of an array', () => {
+    const { form } = setup();
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.get('array')).toStrictEqual(['item0', 'item1', 'item2']);
+  });
+
+  it('should prepend a value if the array is undefined', () => {
+    const { form } = setup();
+
+    form.field.change('array', undefined as any);
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.get('array')).toStrictEqual(['item0']);
+  });
+
+  it('should prepend a value if the array is null', () => {
+    const { form } = setup();
+
+    form.field.change('array', null as any);
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.get('array')).toStrictEqual(['item0']);
+  });
+
+  it('should prepend a value if the array is empty', () => {
+    const { form } = setup();
+
+    form.field.change('array', []);
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.get('array')).toStrictEqual(['item0']);
+  });
+});
+
+describe('meta handling', () => {
+  it('should update the array field meta when prepending', () => {
+    const { form } = setup();
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when prepending with should.dirty false', () => {
+    const { form } = setup();
+
+    form.array.prepend('array', 'item0', { should: { dirty: false } });
+
+    expect(form.field.meta('array').dirty).toBe(false);
+    expect(form.field.meta('array').touched).toBe(true);
+  });
+
+  it('should not update the array field meta when prepending with should.touch false', () => {
+    const { form } = setup();
+
+    form.array.prepend('array', 'item0', { should: { touch: false } });
+
+    expect(form.field.meta('array').dirty).toBe(true);
+    expect(form.field.meta('array').touched).toBe(false);
+  });
+
+  it('should update the first items meta when prepending', () => {
+    const { form } = setup();
+
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.meta('array.0').dirty).toBe(false);
+    expect(form.field.meta('array.0').touched).toBe(false);
+  });
+
+  it('should leave the rest of the items untouched when prepending', () => {
+    const { form } = setup();
+
+    form.field.change('array.0', 'updated', { should: { touch: false } });
+    form.array.prepend('array', 'item0');
+
+    expect(form.field.meta('array.1').dirty).toBe(true);
+    expect(form.field.meta('array.1').touched).toBe(false);
+
+    expect(form.field.meta('array.2').dirty).toBe(false);
+    expect(form.field.meta('array.2').touched).toBe(false);
+  });
+});
+
+describe('validation', () => {
+  it('should validate a field', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.prepend('array', 0 as any);
+
+    await sleep(0);
+
+    expect(form.field.meta('array.0').valid).toBe(false);
+    expect(form.field.errors('array.0')).toHaveLength(1);
+  });
+
+  it('should not validate a field when should.validate is false', async () => {
+    const { form } = setup({ validate: { change: schema } });
+
+    form.array.prepend('array', 0 as any, { should: { validate: false } });
+
+    expect(form.field.meta('array.0').valid).toBe(true);
+    expect(form.field.errors('array.0')).toHaveLength(0);
+  });
+});