Add option for the properties form to only update on submit (#23)
All checks were successful
continuous-integration/drone/push Build is passing

Reviewed-on: https://git.siklos-chaneru.duckdns.org/Siklos/svg-layout-designer-react/pulls/23
This commit is contained in:
Siklos 2022-08-11 08:37:10 -04:00
parent 7c16d6c97d
commit ac56f84196
12 changed files with 256 additions and 53 deletions

View file

@ -8,6 +8,7 @@ describe.concurrent('Properties', () => {
render(<Properties
properties={undefined}
onChange={() => {}}
onSubmit={() => {}}
/>);
expect(screen.queryByText('id')).toBeNull();
@ -16,7 +17,7 @@ describe.concurrent('Properties', () => {
expect(screen.queryByText('y')).toBeNull();
});
it('Some properties', () => {
it('Some properties, change values with dynamic input', () => {
const prop = {
id: 'stuff',
parentId: 'parentId',
@ -32,6 +33,7 @@ describe.concurrent('Properties', () => {
const { container, rerender } = render(<Properties
properties={prop}
onChange={handleChange}
onSubmit={() => {}}
/>);
expect(screen.queryByText('id')).toBeDefined();
@ -39,10 +41,10 @@ describe.concurrent('Properties', () => {
expect(screen.queryByText('x')).toBeDefined();
expect(screen.queryByText('y')).toBeDefined();
let propertyId = container.querySelector('#property-id');
let propertyParentId = container.querySelector('#property-parentId');
let propertyX = container.querySelector('#property-x');
let propertyY = container.querySelector('#property-y');
let propertyId = container.querySelector('#id');
let propertyParentId = container.querySelector('#parentId');
let propertyX = container.querySelector('#x');
let propertyY = container.querySelector('#y');
expect(propertyId).toBeDefined();
expect((propertyId as HTMLInputElement).value).toBe('stuff');
expect(propertyParentId).toBeDefined();
@ -65,12 +67,13 @@ describe.concurrent('Properties', () => {
rerender(<Properties
properties={Object.assign({}, prop)}
onChange={handleChange}
onSubmit={() => {}}
/>);
propertyId = container.querySelector('#property-id');
propertyParentId = container.querySelector('#property-parentId');
propertyX = container.querySelector('#property-x');
propertyY = container.querySelector('#property-y');
propertyId = container.querySelector('#id');
propertyParentId = container.querySelector('#parentId');
propertyX = container.querySelector('#x');
propertyY = container.querySelector('#y');
expect(propertyId).toBeDefined();
expect((propertyId as HTMLInputElement).value).toBe('stuffed');
expect(propertyParentId).toBeDefined();