diff --git a/webapp/src/components/__snapshots__/propertyValueElement.test.tsx.snap b/webapp/src/components/__snapshots__/propertyValueElement.test.tsx.snap index cc6f3c6d2..508bb2032 100644 --- a/webapp/src/components/__snapshots__/propertyValueElement.test.tsx.snap +++ b/webapp/src/components/__snapshots__/propertyValueElement.test.tsx.snap @@ -1,5 +1,44 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`components/propertyValueElement Generic fields should allow cancel 1`] = ` +
+ +
+`; + +exports[`components/propertyValueElement URL fields should allow cancel 1`] = ` +
+ +
+`; + exports[`components/propertyValueElement should match snapshot, date, array value 1`] = `
{ const {container} = render(component) expect(container).toMatchSnapshot() }) + + test('URL fields should allow cancel', () => { + const propertyTemplate: IPropertyTemplate = { + id: 'property_url', + name: 'Property URL', + type: 'url', + options: [], + } + + const component = wrapDNDIntl( + , + ) + + const {container} = render(component) + const editElement = container.querySelector('.Editable') + expect(editElement).toBeDefined() + + userEvent.type(editElement!, 'http://test{esc}') + expect(container).toMatchSnapshot() + }) + + test('Generic fields should allow cancel', () => { + const propertyTemplate: IPropertyTemplate = { + id: 'text', + name: 'Generic Text', + type: 'text', + options: [], + } + + const component = wrapDNDIntl( + , + ) + + const {container} = render(component) + const editElement = container.querySelector('.Editable') + expect(editElement).toBeDefined() + + userEvent.type(editElement!, 'http://test{esc}') + expect(container).toMatchSnapshot() + }) }) diff --git a/webapp/src/components/propertyValueElement.tsx b/webapp/src/components/propertyValueElement.tsx index 6b96b1d0c..b5c2ef4fc 100644 --- a/webapp/src/components/propertyValueElement.tsx +++ b/webapp/src/components/propertyValueElement.tsx @@ -182,7 +182,7 @@ const PropertyValueElement = (props:Props): JSX.Element => { placeholder={emptyDisplayValue} onChange={setValue} onSave={saveTextProperty} - onCancel={() => setValue(propertyValue)} + onCancel={() => setValue(propertyValue || '')} validator={(newValue) => validateProp(propertyTemplate.type, newValue)} /> ) @@ -236,7 +236,7 @@ const PropertyValueElement = (props:Props): JSX.Element => { autoExpand={true} onChange={setValue} onSave={saveTextProperty} - onCancel={() => setValue(propertyValue)} + onCancel={() => setValue(propertyValue || '')} validator={(newValue) => validateProp(propertyTemplate.type, newValue)} spellCheck={propertyTemplate.type === 'text'} />