COMPASS-564: Refactor sort indexes store and test

mongodb-js · Dec 18, 2016 · ee2ac56 · ee2ac56
1 parent 8aaa422
commit ee2ac56
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 37 deletions.
diff --git a/src/internal-packages/indexes/lib/component/index-header-column.jsx b/src/internal-packages/indexes/lib/component/index-header-column.jsx
@@ -68,7 +68,7 @@ class IndexHeaderColumn extends React.Component {
   render() {
     return (
       <th
-        data-test-id={this.props.hook}
+        data-test-id={this.props.dataTestId}
         className={this._renderClassName()}
         onClick={this.handleIndexSort.bind(this)}>
         {this.props.name}
@@ -82,7 +82,7 @@ IndexHeaderColumn.displayName = 'IndexHeaderColumn';
 
 IndexHeaderColumn.propTypes = {
   sortOrder: React.PropTypes.string.isRequired,
-  hook: React.PropTypes.string.isRequired,
+  dataTestId: React.PropTypes.string.isRequired,
   name: React.PropTypes.string.isRequired
 };
 

diff --git a/src/internal-packages/indexes/lib/component/index-header.jsx b/src/internal-packages/indexes/lib/component/index-header.jsx
@@ -55,13 +55,19 @@ class IndexHeader extends React.Component {
     return (
       <thead>
         <tr>
-          <IndexHeaderColumn hook="th-name" name="Name and Definition" sortOrder={this.state.sortOrder} />
-          <IndexHeaderColumn hook="th-type" name="Type" sortOrder={this.state.sortOrder} />
-          <IndexHeaderColumn hook="th-size" name="Size" sortOrder={this.state.sortOrder} />
-          <IndexHeaderColumn hook="th-usage" name="Usage" sortOrder={this.state.sortOrder} />
-          <IndexHeaderColumn hook="th-properties" name="Properties" sortOrder={this.state.sortOrder} />
+          <IndexHeaderColumn
+            dataTestId="index-header-name" name="Name and Definition" sortOrder={this.state.sortOrder} />
+          <IndexHeaderColumn
+            dataTestId="index-header-type" name="Type" sortOrder={this.state.sortOrder} />
+          <IndexHeaderColumn
+            dataTestId="index-header-size" name="Size" sortOrder={this.state.sortOrder} />
+          <IndexHeaderColumn
+            dataTestId="index-header-usage" name="Usage" sortOrder={this.state.sortOrder} />
+          <IndexHeaderColumn
+            dataTestId="index-header-properties" name="Properties" sortOrder={this.state.sortOrder} />
           {this.CollectionStore.isWritable() ?
-            <IndexHeaderColumn hook="th-drop" name="Drop" sortOrder={this.state.sortOrder}/>
+            <IndexHeaderColumn
+              dataTestId="index-header-drop" name="Drop" sortOrder={this.state.sortOrder}/>
             : null}
         </tr>
       </thead>

diff --git a/src/internal-packages/indexes/lib/store/sort-indexes-store.js b/src/internal-packages/indexes/lib/store/sort-indexes-store.js
@@ -17,6 +17,8 @@ const SortIndexesStore = Reflux.createStore({
    * Initialize the sort indexes store.
    */
   init: function() {
+    this.sortField = DEFAULT;
+    this.sortOrder = ASC;
     this.listenTo(LoadIndexesStore, this.loadIndexes);
     this.listenTo(UpdateIndexesStore, this.loadIndexes);
     this.listenTo(Action.sortIndexes, this.sortIndexes);
@@ -29,18 +31,19 @@ const SortIndexesStore = Reflux.createStore({
    */
   loadIndexes(indexes) {
     this.indexes = indexes;
-    this.sortField = DEFAULT;
-    this.sortOrder = ASC;
-    this.trigger(this.indexes, this.sortOrder, this.sortField);
+    this.sortIndexes(this.sortField, false);
   },
 
   /**
    * Sort the indexes
    *
    * @param {String} column - The column to sort on.
+   * @param {Boolean} reverse - If we should reverse the order.
    */
-  sortIndexes: function(column) {
-    this._setOrder(column);
+  sortIndexes: function(column, reverse = true) {
+    if (reverse) {
+      this._setOrder(column);
+    }
     this.indexes.sort(this._comparator(this._field()));
     this.trigger(this.indexes, this.sortOrder, this.sortField);
   },

diff --git a/test/compass-functional.test.js b/test/compass-functional.test.js
@@ -591,27 +591,42 @@ describe('Compass Functional Test Suite #spectron', function() {
           });
 
           context('when the index is valid', function() {
-            it('adds the index to the list', function() {
-              return client
-                .inputCreateIndexDetails({ name: 'name_1', field: 'name' })
-                .clickCreateIndexModalButton()
-                .waitForIndexCreation('name_1')
-                // Sort the indexes as well to handle any stray side-effects
-                .clickIndexTableNameHeader('th-usage')
-                .clickIndexTableNameHeader('th-name')
-                .getIndexNames()
-                .should.eventually.deep.equal([ '_id_', 'name_1' ]);
+            context('when the indexes are sorted', function() {
+              it('adds the index to the list', function() {
+                return client
+                  .inputCreateIndexDetails({ name: 'name_1', field: 'name' })
+                  .clickCreateIndexModalButton()
+                  .waitForIndexCreation('name_1')
+                  .clickIndexTableHeader('index-header-name')
+                  .getIndexNames()
+                  .should.eventually.include('name_1');
+              });
+
+              it('retains the previous sorting of the list', function() {
+                return client
+                  .getIndexNames()
+                  .should.eventually.deep.equal([ 'name_1', '_id_' ]);
+              });
             });
-            it('allows another index to be added', function() {
-              return client
-                .clickCreateIndexButton()
-                .waitForCreateIndexModal()
-                .inputCreateIndexDetails({ type: '-1 (desc)' })
-                .inputCreateIndexDetails({ name: 'name_-1', field: 'name'})
-                .clickCreateIndexModalButton()
-                .waitForIndexCreation('name_-1')
-                .getIndexNames()
-                .should.eventually.deep.equal([ '_id_', 'name_1', 'name_-1' ]);
+
+            context('when adding another index', function() {
+              it('allows another index to be added', function() {
+                return client
+                  .clickCreateIndexButton()
+                  .waitForCreateIndexModal()
+                  .inputCreateIndexDetails({ type: '-1 (desc)' })
+                  .inputCreateIndexDetails({ name: 'name_-1', field: 'name'})
+                  .clickCreateIndexModalButton()
+                  .waitForIndexCreation('name_-1')
+                  .getIndexNames()
+                  .should.eventually.include('name_-1');
+              });
+
+              it('retains the current index table sort order', function() {
+                return client
+                  .getIndexNames()
+                  .should.eventually.deep.equal([ 'name_1', 'name_-1', '_id_' ]);
+              });
             });
           });
         });
@@ -620,8 +635,7 @@ describe('Compass Functional Test Suite #spectron', function() {
           context('when clicking on the name header', function() {
             it('sorts the indexes by name', function() {
               return client
-                .clickIndexTableNameHeader('th-usage')
-                .clickIndexTableNameHeader('th-name')
+                .clickIndexTableHeader('index-header-name')
                 .getIndexNames()
                 .should.eventually.deep.equal([ '_id_', 'name_-1', 'name_1' ]);
             });

diff --git a/test/support/spectron-support.js b/test/support/spectron-support.js
@@ -665,9 +665,9 @@ function addClickCommands(client) {
   });
 
   /**
-   * Click on the name header in the index table.
+   * Click on the header in the index table.
    */
-  client.addCommand('clickIndexTableNameHeader', function(columnName) {
+  client.addCommand('clickIndexTableHeader', function(columnName) {
     const base = selector('indexes-table');
     const column = selector(columnName);
     return this.click(`${base} ${column}`);