diff --git a/src/property-filter/__tests__/property-filter-token-editor.test.tsx b/src/property-filter/__tests__/property-filter-token-editor.test.tsx index b0ab7c1ab8..354f54751e 100644 --- a/src/property-filter/__tests__/property-filter-token-editor.test.tsx +++ b/src/property-filter/__tests__/property-filter-token-editor.test.tsx @@ -139,6 +139,70 @@ describe.each([false, true])('token editor, expandToViewport=%s', expandToViewpo expect(editor.header.getElement()).toHaveTextContent(i18nStrings.editTokenHeader!); }); + describe('changing token property to another property sets correct default value type', () => { + function changeTokenProperty(propertyKey: string) { + const propertyFilter = createWrapper().findPropertyFilter()!; + const tokens = propertyFilter.findTokens(); + + tokens[0].findLabel().click(); + const dropdown = propertyFilter.findTokens()[0].findEditorDropdown({ expandToViewport })!; + const select = dropdown.findForm().findSelect()!; + select.openDropdown(); + select.selectOptionByValue(propertyKey); + dropdown.findSubmitButton().click(); + } + + const baseProps: Partial = { + filteringProperties: [ + { key: 'string', propertyLabel: 'string', operators: ['=', '!='], groupValuesLabel: '' }, + { key: 'other-string', propertyLabel: 'string-other', operators: ['=', '!='], groupValuesLabel: '' }, + { key: 'enum', propertyLabel: 'enum', operators: [{ operator: '=', tokenType: 'enum' }], groupValuesLabel: '' }, + { + key: 'date', + propertyLabel: 'date', + operators: [{ operator: '=', form: () =>
}], + groupValuesLabel: '', + }, + ], + query: { tokens: [{ propertyKey: 'string', value: 'value', operator: '=' }], operation: 'and' }, + expandToViewport, + }; + + test('string property initializes to string', () => { + const onChange = jest.fn(); + renderComponent({ ...baseProps, onChange }); + + changeTokenProperty('other-string'); + expect(onChange).toHaveBeenCalledWith( + expect.objectContaining({ + detail: { tokens: [{ propertyKey: 'other-string', operator: '=', value: '' }], operation: 'and' }, + }) + ); + }); + + test('enum property initializes to empty array', () => { + const onChange = jest.fn(); + renderComponent({ ...baseProps, onChange }); + changeTokenProperty('enum'); + expect(onChange).toHaveBeenCalledWith( + expect.objectContaining({ + detail: { tokens: [{ propertyKey: 'enum', operator: '=', value: [] }], operation: 'and' }, + }) + ); + }); + + test('custom property initializes to null', () => { + const onChange = jest.fn(); + renderComponent({ ...baseProps, onChange }); + changeTokenProperty('date'); + expect(onChange).toHaveBeenCalledWith( + expect.objectContaining({ + detail: { tokens: [{ propertyKey: 'date', operator: '=', value: null }], operation: 'and' }, + }) + ); + }); + }); + describe('form controls content', () => { test('default', () => { renderComponent({ @@ -501,7 +565,7 @@ describe('token editor with groups', () => { expect.objectContaining({ detail: { operation: 'and', - tokenGroups: [{ propertyKey: 'other-string', operator: '=', value: null }], + tokenGroups: [{ propertyKey: 'other-string', operator: '=', value: '' }], tokens: [], }, }) diff --git a/src/property-filter/token-editor.tsx b/src/property-filter/token-editor.tsx index 39b3da709e..081b2b3c2e 100644 --- a/src/property-filter/token-editor.tsx +++ b/src/property-filter/token-editor.tsx @@ -105,7 +105,9 @@ export function TokenEditor({ ? temporaryToken.operator : allowedOperators[0]; const matchedProperty = filteringProperties.find(property => property.propertyKey === newPropertyKey) ?? null; - setTemporaryToken({ ...temporaryToken, property: matchedProperty, operator, value: null }); + const isCustomType = !!matchedProperty?.getValueFormRenderer(operator); + const value = isCustomType || matchedProperty?.getTokenType(operator) === 'enum' ? null : ''; + setTemporaryToken({ ...temporaryToken, property: matchedProperty, operator, value }); }; const operator = temporaryToken.operator;