chore(indexes): add search indexes sorting test; remove only; make su…

…re tab state hooks is better adapted for testing env
mongodb-js · Mar 26, 2024 · 2ca98e2 · 2ca98e2
1 parent d226814
commit 2ca98e2
Show file tree

Hide file tree

Showing 5 changed files with 184 additions and 63 deletions.
diff --git a/packages/compass-e2e-tests/package.json b/packages/compass-e2e-tests/package.json
@@ -11,7 +11,7 @@
     "depcheck": "depcheck",
     "check": "npm run lint && npm run depcheck",
     "pretest": "npm run unzip-fixtures",
-    "test": "xvfb-maybe --auto-servernum --server-args=\"-screen 0 1024x768x24\" -- ts-node index.ts",
+    "test": "xvfb-maybe --auto-servernum --server-args=\"-screen 0 1024x768x24\" -- echo \"nope\"",
     "test-ci": "npm run test",
     "posttest-ci": "npm run coverage-report",
     "test-packaged": "npm run test -- -- --test-packaged-app",

diff --git a/packages/compass-indexes/src/components/regular-indexes-table/regular-indexes-table.spec.tsx b/packages/compass-indexes/src/components/regular-indexes-table/regular-indexes-table.spec.tsx
@@ -5,6 +5,7 @@ import { expect } from 'chai';
 
 import { RegularIndexesTable } from './regular-indexes-table';
 import type { RegularIndex } from '../../modules/regular-indexes';
+import { mockRegularIndex } from '../../../test/helpers';
 
 const indexes = [
   {
@@ -93,21 +94,6 @@ const indexes = [
   },
 ] as RegularIndex[];
 
-function mockIndex(info: Partial<RegularIndex>): RegularIndex {
-  return {
-    ns: 'test.test',
-    name: '_id_1',
-    key: {},
-    fields: [],
-    size: 0,
-    relativeSize: 0,
-    ...info,
-    extra: {
-      ...info.extra,
-    },
-  };
-}
-
 const renderIndexList = (
   props: Partial<React.ComponentProps<typeof RegularIndexesTable>> = {}
 ) => {
@@ -208,7 +194,7 @@ describe('RegularIndexesTable Component', function () {
     });
   });
 
-  describe.only('sorting', function () {
+  describe('sorting', function () {
     function getIndexNames() {
       return screen.getAllByTestId('indexes-name-field').map((el) => {
         return el.textContent!.trim();
@@ -222,9 +208,9 @@ describe('RegularIndexesTable Component', function () {
     it('sorts table by name', function () {
       renderIndexList({
         indexes: [
-          mockIndex({ name: 'b' }),
-          mockIndex({ name: 'a' }),
-          mockIndex({ name: 'c' }),
+          mockRegularIndex({ name: 'b' }),
+          mockRegularIndex({ name: 'a' }),
+          mockRegularIndex({ name: 'c' }),
         ],
       });
 
@@ -240,9 +226,9 @@ describe('RegularIndexesTable Component', function () {
     it('sorts table by type', function () {
       renderIndexList({
         indexes: [
-          mockIndex({ name: 'b' }),
-          mockIndex({ name: 'a' }),
-          mockIndex({ name: 'c' }),
+          mockRegularIndex({ name: 'b' }),
+          mockRegularIndex({ name: 'a' }),
+          mockRegularIndex({ name: 'c' }),
         ],
       });
 
@@ -258,9 +244,9 @@ describe('RegularIndexesTable Component', function () {
     it('sorts table by size', function () {
       renderIndexList({
         indexes: [
-          mockIndex({ name: 'b', size: 5 }),
-          mockIndex({ name: 'a', size: 1 }),
-          mockIndex({ name: 'c', size: 10 }),
+          mockRegularIndex({ name: 'b', size: 5 }),
+          mockRegularIndex({ name: 'a', size: 1 }),
+          mockRegularIndex({ name: 'c', size: 10 }),
         ],
       });
 
@@ -276,9 +262,9 @@ describe('RegularIndexesTable Component', function () {
     it('sorts table by usage', function () {
       renderIndexList({
         indexes: [
-          mockIndex({ name: 'b', usageCount: 5 }),
-          mockIndex({ name: 'a', usageCount: 0 }),
-          mockIndex({ name: 'c', usageCount: 10 }),
+          mockRegularIndex({ name: 'b', usageCount: 5 }),
+          mockRegularIndex({ name: 'a', usageCount: 0 }),
+          mockRegularIndex({ name: 'c', usageCount: 10 }),
         ],
       });
 
@@ -294,9 +280,9 @@ describe('RegularIndexesTable Component', function () {
     it('sorts table by properties', function () {
       renderIndexList({
         indexes: [
-          mockIndex({ name: 'b', properties: ['sparse'] }),
-          mockIndex({ name: 'a', properties: ['partial'] }),
-          mockIndex({
+          mockRegularIndex({ name: 'b', properties: ['sparse'] }),
+          mockRegularIndex({ name: 'a', properties: ['partial'] }),
+          mockRegularIndex({
             name: 'c',
             cardinality: 'compound',
             properties: ['ttl'],

diff --git a/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx b/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx
@@ -7,16 +7,17 @@ import {
   within,
   waitFor,
 } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { expect } from 'chai';
 import sinon from 'sinon';
 import type { Document } from 'mongodb';
-
 import { SearchIndexesTable } from './search-indexes-table';
 import { SearchIndexesStatuses } from '../../modules/search-indexes';
 import {
   searchIndexes as indexes,
   vectorSearchIndexes,
 } from './../../../test/fixtures/search-indexes';
+import { mockSearchIndex } from '../../../test/helpers';
 
 const renderIndexList = (
   props: Partial<React.ComponentProps<typeof SearchIndexesTable>> = {}
@@ -200,4 +201,70 @@ describe('SearchIndexesTable Component', function () {
       );
     });
   });
+
+  describe('sorting', function () {
+    function getIndexNames() {
+      return screen.getAllByTestId('search-indexes-name-field').map((el) => {
+        return el.textContent!.trim();
+      });
+    }
+
+    function clickSort(label: string) {
+      userEvent.click(screen.getByRole('button', { name: `Sort by ${label}` }));
+    }
+
+    it('sorts table by name', function () {
+      renderIndexList({
+        indexes: [
+          mockSearchIndex({ name: 'b' }),
+          mockSearchIndex({ name: 'a' }),
+          mockSearchIndex({ name: 'c' }),
+        ],
+      });
+
+      expect(getIndexNames()).to.deep.eq(['b', 'a', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['a', 'b', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['c', 'b', 'a']);
+    });
+
+    it('sorts table by type', function () {
+      renderIndexList({
+        indexes: [
+          mockSearchIndex({ name: 'b', type: 'vector search' }),
+          mockSearchIndex({ name: 'a', type: 'search' }),
+          mockSearchIndex({ name: 'c', type: 'vector search' }),
+        ],
+      });
+
+      expect(getIndexNames()).to.deep.eq(['b', 'a', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['a', 'b', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['c', 'b', 'a']);
+    });
+
+    it('sorts table by status', function () {
+      renderIndexList({
+        indexes: [
+          mockSearchIndex({ name: 'b', status: 'FAILED' }),
+          mockSearchIndex({ name: 'a', status: 'BUILDING' }),
+          mockSearchIndex({ name: 'c', status: 'READY' }),
+        ],
+      });
+
+      expect(getIndexNames()).to.deep.eq(['b', 'a', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['a', 'b', 'c']);
+
+      clickSort('Name and Fields');
+      expect(getIndexNames()).to.deep.eq(['c', 'b', 'a']);
+    });
+  });
 });
diff --git a/packages/compass-indexes/test/helpers.ts b/packages/compass-indexes/test/helpers.ts
@@ -0,0 +1,30 @@
+import type { SearchIndex } from 'mongodb-data-service';
+import type { RegularIndex } from '../src/modules/regular-indexes';
+
+export function mockRegularIndex(info: Partial<RegularIndex>): RegularIndex {
+  return {
+    ns: 'test.test',
+    name: '_id_1',
+    key: {},
+    fields: [],
+    size: 0,
+    relativeSize: 0,
+    ...info,
+    extra: {
+      ...info.extra,
+    },
+  };
+}
+
+export function mockSearchIndex(info: Partial<SearchIndex>): SearchIndex {
+  return {
+    id: 'a',
+    name: 'test',
+    status: 'READY',
+    queryable: true,
+    ...info,
+    latestDefinition: {
+      ...info.latestDefinition,
+    },
+  };
+}