From: Daniel Kutyła <daniel.kutyla@contractors.roche.com>
Date: Tue, 11 Oct 2022 18:52:30 +0000 (+0200)
Subject: 19311: Added check for initial clear
X-Git-Tag: 2.5.0~32^2~4
X-Git-Url: https://git.arvados.org/arvados-workbench2.git/commitdiff_plain/235d9456eb6679611af96383f9dfcadc3462a7da

19311: Added check for initial clear

Arvados-DCO-1.1-Signed-off-by: Daniel Kutyła <daniel.kutyla@contractors.roche.com>
---

diff --git a/src/components/search-input/search-input.test.tsx b/src/components/search-input/search-input.test.tsx
index c57d3608..c1bd79ab 100644
--- a/src/components/search-input/search-input.test.tsx
+++ b/src/components/search-input/search-input.test.tsx
@@ -98,11 +98,30 @@ describe("<SearchInput />", () => {
     describe("on input target change", () => {
         it("clears the input value on selfClearProp change", () => {
             const searchInput = mount(<SearchInput selfClearProp="abc" value="123" onSearch={onSearch} debounce={1000}/>);
-            searchInput.setProps({ selfClearProp: 'aaa' });
-            jest.runTimersToTime(1000);
+            // initial no clear call
+            jest.runTimersToTime(0);
+            searchInput.setProps({ selfClearProp: '111' });
+            expect(onSearch).not.toBeCalledWith("");
+            expect(onSearch).toHaveBeenCalledTimes(0);
+
+            // second call trigger input clear
+            searchInput.setProps({ selfClearProp: 'aaa111' });
+            jest.runTimersToTime(0);
+            expect(onSearch).toBeCalledWith("");
+            expect(onSearch).toHaveBeenCalledTimes(1);
+
+            // third call trigger not input clear beacuse of the same selfClearProp value
+            searchInput.setProps({ selfClearProp: 'aaa111', value: '321' });
+            jest.runTimersToTime(0);
             expect(onSearch).toBeCalledWith("");
             expect(onSearch).toHaveBeenCalledTimes(1);
+            expect(searchInput.props().value).toBe('321');
+
+            // third call trigger input clear beacuse of different selfClearProp value
+            searchInput.setProps({ selfClearProp: 'aaa222' });
+            jest.runTimersToTime(0);
+            expect(onSearch).toBeCalledWith("");
+            expect(onSearch).toHaveBeenCalledTimes(2);
         });
     });
-
 });
diff --git a/src/components/search-input/search-input.tsx b/src/components/search-input/search-input.tsx
index 50338f40..2835f156 100644
--- a/src/components/search-input/search-input.tsx
+++ b/src/components/search-input/search-input.tsx
@@ -48,17 +48,17 @@ type SearchInputProps = SearchInputDataProps & SearchInputActionProps & WithStyl
 interface SearchInputState {
     value: string;
     label: string;
-    selfClearProp: string;
 }
 
+let selfClearPropState = '';
+
 export const DEFAULT_SEARCH_DEBOUNCE = 1000;
 
 export const SearchInput = withStyles(styles)(
     class extends React.Component<SearchInputProps> {
         state: SearchInputState = {
             value: "",
-            label: "",
-            selfClearProp: ""
+            label: ""
         };
 
         timeout: number;
@@ -97,9 +97,11 @@ export const SearchInput = withStyles(styles)(
             if (nextProps.value !== this.props.value) {
                 this.setState({ value: nextProps.value });
             }
-            if (this.state.value !== '' && nextProps.selfClearProp && nextProps.selfClearProp !== this.state.selfClearProp) {
-                this.props.onSearch('');
-                this.setState({ selfClearProp: nextProps.selfClearProp });
+            if (this.state.value !== '' && nextProps.selfClearProp && nextProps.selfClearProp !== selfClearPropState) {
+                if (selfClearPropState !== '') {
+                    this.props.onSearch('');
+                }
+                selfClearPropState = nextProps.selfClearProp;
             }
         }