Unit test for request cancel

apache · Nov 28, 2017 · bd0b5f0 · bd0b5f0
1 parent 02d9922
commit bd0b5f0
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 3 deletions.
diff --git a/superset/assets/javascripts/explore/components/controls/FilterControl.jsx b/superset/assets/javascripts/explore/components/controls/FilterControl.jsx
@@ -47,7 +47,9 @@ export default class FilterControl extends React.Component {
         return { filters: newStateFilters };
       });
       // if there is an outstanding request to fetch values, cancel it.
-      if (this.state.activeRequest) this.state.activeRequest.abort();
+      if (this.state.activeRequest) {
+        this.state.activeRequest.abort();
+      }
       this.setState({
         activeRequest: $.ajax({
           type: 'GET',
@@ -56,7 +58,7 @@ export default class FilterControl extends React.Component {
             this.setState((prevState) => {
               const newStateFilters = Object.assign([], prevState.filters);
               newStateFilters[index] = { valuesLoading: false, valueChoices: data };
-              return { filters: newStateFilters };
+              return { filters: newStateFilters, activeRequest: null };
             });
           },
         }),

diff --git a/superset/assets/spec/javascripts/explore/components/FilterControl_spec.jsx b/superset/assets/spec/javascripts/explore/components/FilterControl_spec.jsx
@@ -109,12 +109,15 @@ describe('FilterControl', () => {
     ]);
   });
 
+  before(() => {
+    sinon.stub($, 'ajax');
+  });
+
   after(() => {
     $.ajax.restore();
   });
 
   it('makes a GET request to retrieve value choices', () => {
-    sinon.stub($, 'ajax');
     wrapper.instance().fetchFilterValues(0, 'col1');
     expect($.ajax.getCall(0).args[0].type).to.deep.equal('GET');
     expect($.ajax.getCall(0).args[0].url).to.deep.equal('/superset/filter/qtable/1/col1/');
@@ -214,4 +217,31 @@ describe('FilterControl', () => {
       },
     ]);
   });
+
+  it('tracks an active filter select ajax request', () => {
+    const spyReq = sinon.spy();
+    $.ajax.reset();
+    $.ajax.onFirstCall().returns(spyReq);
+    wrapper.instance().fetchFilterValues(0, 'col1');
+    expect(wrapper.state().activeRequest).to.equal(spyReq);
+    // Sets active to null after success
+    $.ajax.getCall(0).args[0].success('choices');
+    expect(wrapper.state().filters[0].valuesLoading).to.equal(false);
+    expect(wrapper.state().filters[0].valueChoices).to.equal('choices');
+    expect(wrapper.state().activeRequest).to.equal(null);
+  });
+
+  it('cancels active request if another is submitted', () => {
+    const spyReq = sinon.spy();
+    spyReq.abort = sinon.spy();
+    $.ajax.reset();
+    $.ajax.onFirstCall().returns(spyReq);
+    wrapper.instance().fetchFilterValues(0, 'col1');
+    expect(wrapper.state().activeRequest).to.equal(spyReq);
+    const spyReq1 = sinon.spy();
+    $.ajax.onSecondCall().returns(spyReq1);
+    wrapper.instance().fetchFilterValues(1, 'col2');
+    expect(spyReq.abort.called).to.equal(true);
+    expect(wrapper.state().activeRequest).to.equal(spyReq1);
+  });
 });