Ensuring that debounced update function is canceled upon reset + unit…

… tests. Fixes #884

src/components/control-component.js

@@ -400,6 +400,13 @@ function createControlClass(s = defaultStrategy) {
             return;
           }
           case 'validate':
+          case 'reset':
+            if (intent.type === 'reset') {
+              this.setViewValue(modelValue);
+              if (this.handleUpdate.cancel) {
+                this.handleUpdate.cancel();
+              }
+            }
             if (containsEvent(validateOn, 'change')) {
               this.validate({ clearIntents: intent });
             }

src/reducers/form-actions-reducer.js

@@ -22,7 +22,7 @@ import getFormValue from '../utils/get-form-value';
 const resetFieldState = (field, customInitialFieldState) => {
   if (!isPlainObject(field)) return field;
 
-  const intents = [{ type: 'validate' }];
+  const intents = [{ type: 'reset' }];
   let resetValue = getMeta(field, 'initialValue');
   const loadedValue = getMeta(field, 'loadedValue');
 

src/utils/debounce.js

@@ -18,5 +18,10 @@ export default function debounce(func, delay) {
     if (laterFunc) laterFunc();
   };
 
+  debouncedFunc.cancel = () => {
+    clearTimeout(timeout);
+    laterFunc = undefined;
+  };
+
   return debouncedFunc;
 }

test/control-component-spec.js

@@ -2144,6 +2144,66 @@ Object.keys(testContexts).forEach((testKey) => {
         assert.equal(get(store.getState().test, 'foo'), 'debounced');
         assert.equal(input.value, 'debounced');
       });
+
+      it('should cancel debounced changes when control is reset', (done) => {
+        const initialState = getInitialState({ foo: 'bar' });
+        const store = testCreateStore({
+          test: modelReducer('test', initialState),
+          testForm: formReducer('test', initialState),
+        });
+
+        const control = testRender(
+          <Control.text
+            model="test.foo"
+            debounce={10}
+          />, store);
+
+        const input = TestUtils.findRenderedDOMComponentWithTag(control, 'input');
+        input.value = 'debounced';
+
+        TestUtils.Simulate.change(input);
+
+        store.dispatch(actions.reset('test'));
+
+        setTimeout(() => {
+          assert.equal(get(store.getState().test, 'foo'), 'bar');
+          assert.equal(input.value, 'bar');
+          done();
+        }, 20);
+      });
+
+      it('should cancel debounced changes when control is reset then unmounted', (done) => {
+        const initialState = getInitialState({ foo: 'bar' });
+        const store = testCreateStore({
+          test: modelReducer('test', initialState),
+          testForm: formReducer('test', initialState),
+        });
+
+        const container = document.createElement('div');
+
+        const control = ReactDOM.render(
+          <Provider store={store}>
+            <Control.text
+              model="test.foo"
+              debounce={10}
+            />
+          </Provider>,
+        container);
+
+        const input = TestUtils.findRenderedDOMComponentWithTag(control, 'input');
+        input.value = 'debounced';
+
+        TestUtils.Simulate.change(input);
+
+        store.dispatch(actions.reset('test'));
+        ReactDOM.unmountComponentAtNode(container);
+
+        setTimeout(() => {
+          assert.equal(get(store.getState().test, 'foo'), 'bar');
+          assert.equal(input.value, 'bar');
+          done();
+        }, 20);
+      });
     });
 
     describe('persist prop', () => {

test/field-actions-spec.js

@@ -180,10 +180,10 @@ Object.keys(testContexts).forEach((testKey) => {
 
         const resetState = reducer(undefined, actions.reset('test'));
 
-        assert.include(resetState.$form.intents, { type: 'validate' });
+        assert.include(resetState.$form.intents, { type: 'reset' });
 
-        assert.include(resetState.button.$form.intents, { type: 'validate' },
-          'should intend to revalidate subfields');
+        assert.include(resetState.button.$form.intents, { type: 'reset' },
+          'should intend to revalidate subfields (handled with reset)');
       });
     });