From 128bb0cc56357fd43c0fd6973f2370a165c13aae Mon Sep 17 00:00:00 2001 From: Avram Walden Date: Fri, 24 May 2024 12:26:36 -0700 Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20Fixes=20potential=20circu?= =?UTF-8?q?lar=20object?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + src/Form/index.tsx | 2 +- src/Inputs/DynamicInputs.tsx | 2 +- src/Inputs/Input.tsx | 2 +- tests/components/ContextTest.tsx | 14 +++++++++++-- tests/tsconfig.json | 6 ++++++ tests/useDynamicInputs.test.tsx | 34 +++++++++++++++++++++----------- yarn.lock | 8 ++++++++ 8 files changed, 52 insertions(+), 17 deletions(-) create mode 100644 tests/tsconfig.json diff --git a/package.json b/package.json index 349844c..856f60d 100644 --- a/package.json +++ b/package.json @@ -65,6 +65,7 @@ "@typescript-eslint/eslint-plugin": "^7.8.0", "@typescript-eslint/parser": "^7.8.0", "axios-mock-adapter": "^1.22.0", + "circular-json": "^0.5.9", "commitizen": "^4.3.0", "cz-conventional-changelog": "^3.3.0", "eslint": "^8.57", diff --git a/src/Form/index.tsx b/src/Form/index.tsx index 0c60180..3c3d126 100644 --- a/src/Form/index.tsx +++ b/src/Form/index.tsx @@ -67,7 +67,7 @@ const Form = ({ * otherwise submits using Inertia's `useForm.submit` method */ const submit = async (options?: Partial) => { - let shouldSubmit = to && onSubmit && onSubmit(contextValueObject()) === false ? false : true + let shouldSubmit = to && onSubmit?.(contextValueObject()) === false ? false : true if(shouldSubmit) { if(async) { diff --git a/src/Inputs/DynamicInputs.tsx b/src/Inputs/DynamicInputs.tsx index 1a37bd8..9a53d87 100644 --- a/src/Inputs/DynamicInputs.tsx +++ b/src/Inputs/DynamicInputs.tsx @@ -21,7 +21,7 @@ const DynamicInputs = ({ return ( <> - { React.cloneElement(addInputButton, { onClick: addInput, type: 'button' }) } + { React.cloneElement(addInputButton, { onClick: ( )=> addInput(), type: 'button' }) } { paths.map((path, i) => (
{ children }
diff --git a/src/Inputs/Input.tsx b/src/Inputs/Input.tsx index df62818..de63e29 100644 --- a/src/Inputs/Input.tsx +++ b/src/Inputs/Input.tsx @@ -30,7 +30,7 @@ const Input = ( defaultValue, clearErrorsOnChange, }) - + // console.log({ name, model, errorKey, defaultValue, inputName, inputId, value }) const handleChange = (e: React.ChangeEvent) => { const value = (e.target?.checked || e.target.value) as T setValue(value) diff --git a/tests/components/ContextTest.tsx b/tests/components/ContextTest.tsx index c5ffb4a..1cd3f68 100644 --- a/tests/components/ContextTest.tsx +++ b/tests/components/ContextTest.tsx @@ -1,5 +1,15 @@ import React, { useEffect } from 'react' import { NestedObject, useForm, UseFormProps } from '../../src' +import CircularJSON from 'circular-json' + +const safeStringify = (obj) => { + try { + return CircularJSON.stringify(obj) + } catch(err) { + console.error('Error stringifying object:', err) + return null + } +} interface ContextTestProps { cb?: (form: UseFormProps) => void @@ -15,10 +25,10 @@ const ContextTest = ({ cb }: ContextTestProps) => { return ( <>
- { JSON.stringify(form.data) } + { safeStringify(form.data) }
- { JSON.stringify(form.errors) } + { safeStringify(form.errors) }
) diff --git a/tests/tsconfig.json b/tests/tsconfig.json new file mode 100644 index 0000000..5e87bd6 --- /dev/null +++ b/tests/tsconfig.json @@ -0,0 +1,6 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "noUnusedLocals": false, + }, +} \ No newline at end of file diff --git a/tests/useDynamicInputs.test.tsx b/tests/useDynamicInputs.test.tsx index 291c61d..b684e55 100644 --- a/tests/useDynamicInputs.test.tsx +++ b/tests/useDynamicInputs.test.tsx @@ -6,6 +6,7 @@ import Input from '../src/Inputs/Input' import { DynamicInputs, useDynamicInputs } from '../src' import { act } from '@testing-library/react-hooks' import { multiRootData } from './components/data' +import ContextTest from './components/ContextTest' describe('DynamicInputs', () => { describe('With data object passed in', () => { @@ -91,26 +92,32 @@ describe('DynamicInputs', () => { }) }) - - - - - - + /** + * No data prop tests + */ describe('With no data object passed in', () => { it('renders dynamic input fields', () => { render(
- + + + + , ) const buttons = screen.getAllByRole('button') + const dataEl = screen.getByTestId('data') + + act(() => { + buttons[0].click() + }) expect(buttons.length).toBe(1) + expect(dataEl).toHaveTextContent('{"contact":{"phones":[{"title":"","number":"+1"}]}}') }) it('adds inputs', () => { @@ -166,17 +173,20 @@ describe('DynamicInputs', () => { return null } - let phones = form.getData('contact.phones') - expect(phones.length).toEqual(3) + + act(() => { + inputs.addInput() + inputs.addInput() + }) + + expect(form.getData('contact.phones').length).toEqual(2) act(() => { inputs.removeInput(1) }) - phones = form.getData('contact.phones') + expect(form.getData('contact.phones').length).toEqual(1) - expect(phones.length).toEqual(2) - expect(phones).not.toContainEqual({ number: '2234567890' }) }) }) }) diff --git a/yarn.lock b/yarn.lock index 4b0d679..a6c2f48 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3669,6 +3669,13 @@ __metadata: languageName: node linkType: hard +"circular-json@npm:^0.5.9": + version: 0.5.9 + resolution: "circular-json@npm:0.5.9" + checksum: a52a8ace55dbffd769cab749e2bce53fbd881f11dfdfe2b015e0770b83f01ca753e3d24f36d2a94ecb2ea840806b5386ef5c587ce533869951b96b79c058540b + languageName: node + linkType: hard + "cjs-module-lexer@npm:^1.0.0": version: 1.3.1 resolution: "cjs-module-lexer@npm:1.3.1" @@ -11888,6 +11895,7 @@ __metadata: "@typescript-eslint/parser": ^7.8.0 axios: ^1.6.8 axios-mock-adapter: ^1.22.0 + circular-json: ^0.5.9 commitizen: ^4.3.0 cz-conventional-changelog: ^3.3.0 eslint: ^8.57