@zeedhi/teknisa-components-common 1.107.1 → 1.108.0

package/tests/unit/components/tek-grid/grid-column.spec.ts

@@ -1,270 +1,270 @@
-import { Http } from '@zeedhi/core';
-import {
-  IFilterOperation,
-  IFilterPropsComponent,
-  IFilterRelation,
-  ITekGridColumn,
-  TekGrid,
-  TekGridColumn,
-} from '../../../../src';
-
-jest.mock('lodash.debounce', () => jest.fn((fn) => fn));
-const flushPromises = () => new Promise(setImmediate);
-
-describe('TekGridColumn', () => {
-  let baseProps: ITekGridColumn;
-  let httpSpy: jest.SpyInstance;
-
-  beforeEach(() => {
-    httpSpy = jest.spyOn(Http, 'get').mockImplementation((url: string) => {
-      if (url === '/zeedhi') {
-        return Promise.resolve({
-          data: {
-            data: [
-              { id: 1, name: 'employee 1', department: 1 },
-              { id: 2, name: 'employee 2', department: 1 },
-              { id: 3, name: 'employee 3', department: 1 },
-              { id: 4, name: 'employee 4', department: 2 },
-              { id: 5, name: 'employee 5', department: 2 },
-              { id: 15, name: 'employee 15', department: 2 },
-            ],
-            pagination: {
-              page: 1,
-              total: 5,
-              limit: 15,
-            },
-          },
-        });
-      }
-
-      if (url === '/grid') {
-        return Promise.resolve({
-          data: {
-            data: [
-              { id: 1, employee_id: 1, department: 1 },
-              { id: 2, employee_id: 2, department: 1 },
-              { id: 3, employee_id: 3, department: 1 },
-            ],
-            pagination: {
-              page: 1,
-              total: 5,
-              limit: 15,
-            },
-          },
-        });
-      }
-
-      return Promise.reject();
-    });
-
-    baseProps = {
-      name: 'employee_id',
-      componentProps: {
-        name: 'ZdSelect',
-        dataText: 'name',
-        datasource: {
-          type: 'tek-rest',
-          route: '/zeedhi',
-          lazyLoad: false,
-        },
-      },
-    };
-  });
-
-  afterEach(() => {
-    httpSpy.mockClear();
-  });
-
-  describe('constructor()', () => {
-    it('should create new column with default values', () => {
-      const props: ITekGridColumn = {
-        name: 'employee_id',
-      };
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(props, grid);
-
-      expect(column.filterProps).toEqual([]);
-      expect(column.groupLabelForEmptyValue).toBe('');
-      expect(column.filterable).toBeTruthy();
-      expect(column.isVisible).toBeTruthy();
-      expect(column.storeData).toBeTruthy();
-    });
-
-    it('should create new column replacing default values', () => {
-      const filterProps: IFilterPropsComponent = {
-        name: 'name',
-        relation: 'AND' as IFilterRelation,
-        operation: 'CONTAINS' as IFilterOperation,
-      };
-      const groupLabelForEmptyValue = 'Empty';
-      const props: ITekGridColumn = {
-        filterProps,
-        groupLabelForEmptyValue,
-        name: 'employee_id',
-        isVisible: false,
-        filterable: false,
-        storeData: false,
-      };
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(props, grid);
-
-      expect(column.filterProps).toEqual(filterProps);
-      expect(column.groupLabelForEmptyValue).toBe(groupLabelForEmptyValue);
-      expect(column.filterable).toBeFalsy();
-      expect(column.isVisible).toBeFalsy();
-      expect(column.storeData).toBeFalsy();
-    });
-  });
-
-  describe('getLookupData()', () => {
-    it('should get lookup data', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(baseProps, grid);
-
-      let data = column.getLookupData('name', 'employee 1');
-      expect(data).toEqual({});
-
-      await flushPromises();
-      data = column.getLookupData('name', 'employee 1');
-      expect(data).toEqual({ id: 1, name: 'employee 1', department: 1 });
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-    });
-
-    it('should get lookup data using memory', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      baseProps.componentProps!.datasource = {
-        data: [
-          { id: 1, name: 'employee 1 memory', department: 1 },
-          { id: 2, name: 'employee 2 memory', department: 1 },
-          { id: 3, name: 'employee 3 memory', department: 1 },
-          { id: 4, name: 'employee 4 memory', department: 2 },
-          { id: 5, name: 'employee 5 memory', department: 2 },
-          { id: 15, name: 'employee 15 memory', department: 2 },
-        ],
-      };
-      const column = new TekGridColumn(baseProps, grid);
-
-      const data = column.getLookupData('name', 'employee 1 memory');
-      expect(data).toEqual({ id: 1, name: 'employee 1 memory', department: 1 });
-      expect(httpSpy).toHaveBeenCalledTimes(0);
-    });
-
-    it('should get lookup data using filter when storeData is false', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      baseProps.storeData = false;
-      const column = new TekGridColumn(baseProps, grid);
-
-      let data = column.getLookupData('name', 'employee 1');
-      expect(data).toEqual({});
-
-      await flushPromises();
-      data = column.getLookupData('name', 'employee 1');
-      expect(data).toEqual({ id: 1, name: 'employee 1', department: 1 });
-      expect(httpSpy).toHaveBeenCalledWith('/zeedhi', expect.objectContaining({
-        params: expect.objectContaining({
-          name: ['employee 1'],
-        }),
-      }));
-    });
-  });
-
-  describe('getBatchLookupData', () => {
-    it('when called, should lookup for a batch of values asynchonously, adding them to lookupData', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      baseProps.storeData = false;
-      const column = new TekGridColumn(baseProps, grid);
-
-      const data = await column.getBatchLookupData('id', [1, 2]);
-      expect(data).toEqual([
-        { id: 1, name: 'employee 1', department: 1 },
-        { id: 2, name: 'employee 2', department: 1 },
-      ]);
-
-      expect(column.getLookupData('id', '1')).toEqual({ id: 1, name: 'employee 1', department: 1 });
-      expect(column.getLookupData('id', '2')).toEqual({ id: 2, name: 'employee 2', department: 1 });
-
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-    });
-
-    it('when called with values that are already in lookupData, should not call datasource.get', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      baseProps.storeData = false;
-      const column = new TekGridColumn(baseProps, grid);
-
-      column.lookupData = {
-        1: { id: 1, name: 'employee 1', department: 1 },
-      };
-      (column as any).lookupDatasource?.data.push({ id: 2, name: 'employee 2', department: 1 });
-
-      const data = await column.getBatchLookupData('id', [1, 2]);
-      expect(data).toEqual([
-        { id: 1, name: 'employee 1', department: 1 },
-        { id: 2, name: 'employee 2', department: 1 },
-      ]);
-
-      expect(httpSpy).toHaveBeenCalledTimes(0);
-    });
-  });
-
-  describe('memorySearch()', () => {
-    it('should search in memory', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(baseProps, grid);
-
-      let data = await column.memorySearch('employee 15');
-      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-
-      baseProps.componentProps!.dataText = ['id'];
-      const column2 = new TekGridColumn(baseProps, grid);
-
-      data = await column2.memorySearch('3');
-      expect(data).toEqual([{ id: 3, name: 'employee 3', department: 1 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(2);
-    });
-
-    it('should not make request if data is already in memory', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(baseProps, grid);
-
-      let data = await column.memorySearch('employee 15');
-      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-
-      data = await column.memorySearch('employee 2');
-      expect(data).toEqual([{ id: 2, name: 'employee 2', department: 1 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-    });
-
-    it('should always make another request when storeData is false', async () => {
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      baseProps.storeData = false;
-      const column = new TekGridColumn(baseProps, grid);
-
-      let data = await column.memorySearch('employee 15');
-      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(1);
-
-      data = await column.memorySearch('employee 2');
-      expect(data).toEqual([{ id: 2, name: 'employee 2', department: 1 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(2);
-
-      data = await column.memorySearch('employee 3');
-      expect(data).toEqual([{ id: 3, name: 'employee 3', department: 1 }]);
-      expect(httpSpy).toHaveBeenCalledTimes(3);
-    });
-
-    it('should throw error if column doesn\'t have a datasource', async () => {
-      baseProps = {
-        name: 'employee_id',
-        componentProps: {
-          name: 'ZdTextInput',
-        },
-      };
-      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
-      const column = new TekGridColumn(baseProps, grid);
-
-      await expect(column.memorySearch('')).rejects.toThrow();
-    });
-  });
-});
+import { Http } from '@zeedhi/core';
+import {
+  IFilterOperation,
+  IFilterPropsComponent,
+  IFilterRelation,
+  ITekGridColumn,
+  TekGrid,
+  TekGridColumn,
+} from '../../../../src';
+
+jest.mock('lodash.debounce', () => jest.fn((fn) => fn));
+const flushPromises = () => new Promise(setImmediate);
+
+describe('TekGridColumn', () => {
+  let baseProps: ITekGridColumn;
+  let httpSpy: jest.SpyInstance;
+
+  beforeEach(() => {
+    httpSpy = jest.spyOn(Http, 'get').mockImplementation((url: string) => {
+      if (url === '/zeedhi') {
+        return Promise.resolve({
+          data: {
+            data: [
+              { id: 1, name: 'employee 1', department: 1 },
+              { id: 2, name: 'employee 2', department: 1 },
+              { id: 3, name: 'employee 3', department: 1 },
+              { id: 4, name: 'employee 4', department: 2 },
+              { id: 5, name: 'employee 5', department: 2 },
+              { id: 15, name: 'employee 15', department: 2 },
+            ],
+            pagination: {
+              page: 1,
+              total: 5,
+              limit: 15,
+            },
+          },
+        });
+      }
+
+      if (url === '/grid') {
+        return Promise.resolve({
+          data: {
+            data: [
+              { id: 1, employee_id: 1, department: 1 },
+              { id: 2, employee_id: 2, department: 1 },
+              { id: 3, employee_id: 3, department: 1 },
+            ],
+            pagination: {
+              page: 1,
+              total: 5,
+              limit: 15,
+            },
+          },
+        });
+      }
+
+      return Promise.reject();
+    });
+
+    baseProps = {
+      name: 'employee_id',
+      componentProps: {
+        name: 'ZdSelect',
+        dataText: 'name',
+        datasource: {
+          type: 'tek-rest',
+          route: '/zeedhi',
+          lazyLoad: false,
+        },
+      },
+    };
+  });
+
+  afterEach(() => {
+    httpSpy.mockClear();
+  });
+
+  describe('constructor()', () => {
+    it('should create new column with default values', () => {
+      const props: ITekGridColumn = {
+        name: 'employee_id',
+      };
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(props, grid);
+
+      expect(column.filterProps).toEqual([]);
+      expect(column.groupLabelForEmptyValue).toBe('');
+      expect(column.filterable).toBeTruthy();
+      expect(column.isVisible).toBeTruthy();
+      expect(column.storeData).toBeTruthy();
+    });
+
+    it('should create new column replacing default values', () => {
+      const filterProps: IFilterPropsComponent = {
+        name: 'name',
+        relation: 'AND' as IFilterRelation,
+        operation: 'CONTAINS' as IFilterOperation,
+      };
+      const groupLabelForEmptyValue = 'Empty';
+      const props: ITekGridColumn = {
+        filterProps,
+        groupLabelForEmptyValue,
+        name: 'employee_id',
+        isVisible: false,
+        filterable: false,
+        storeData: false,
+      };
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(props, grid);
+
+      expect(column.filterProps).toEqual(filterProps);
+      expect(column.groupLabelForEmptyValue).toBe(groupLabelForEmptyValue);
+      expect(column.filterable).toBeFalsy();
+      expect(column.isVisible).toBeFalsy();
+      expect(column.storeData).toBeFalsy();
+    });
+  });
+
+  describe('getLookupData()', () => {
+    it('should get lookup data', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(baseProps, grid);
+
+      let data = column.getLookupData('name', 'employee 1');
+      expect(data).toEqual({});
+
+      await flushPromises();
+      data = column.getLookupData('name', 'employee 1');
+      expect(data).toEqual({ id: 1, name: 'employee 1', department: 1 });
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+    });
+
+    it('should get lookup data using memory', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      baseProps.componentProps!.datasource = {
+        data: [
+          { id: 1, name: 'employee 1 memory', department: 1 },
+          { id: 2, name: 'employee 2 memory', department: 1 },
+          { id: 3, name: 'employee 3 memory', department: 1 },
+          { id: 4, name: 'employee 4 memory', department: 2 },
+          { id: 5, name: 'employee 5 memory', department: 2 },
+          { id: 15, name: 'employee 15 memory', department: 2 },
+        ],
+      };
+      const column = new TekGridColumn(baseProps, grid);
+
+      const data = column.getLookupData('name', 'employee 1 memory');
+      expect(data).toEqual({ id: 1, name: 'employee 1 memory', department: 1 });
+      expect(httpSpy).toHaveBeenCalledTimes(0);
+    });
+
+    it('should get lookup data using filter when storeData is false', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      baseProps.storeData = false;
+      const column = new TekGridColumn(baseProps, grid);
+
+      let data = column.getLookupData('name', 'employee 1');
+      expect(data).toEqual({});
+
+      await flushPromises();
+      data = column.getLookupData('name', 'employee 1');
+      expect(data).toEqual({ id: 1, name: 'employee 1', department: 1 });
+      expect(httpSpy).toHaveBeenCalledWith('/zeedhi', expect.objectContaining({
+        params: expect.objectContaining({
+          name: ['employee 1'],
+        }),
+      }));
+    });
+  });
+
+  describe('getBatchLookupData', () => {
+    it('when called, should lookup for a batch of values asynchonously, adding them to lookupData', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      baseProps.storeData = false;
+      const column = new TekGridColumn(baseProps, grid);
+
+      const data = await column.getBatchLookupData('id', [1, 2]);
+      expect(data).toEqual([
+        { id: 1, name: 'employee 1', department: 1 },
+        { id: 2, name: 'employee 2', department: 1 },
+      ]);
+
+      expect(column.getLookupData('id', '1')).toEqual({ id: 1, name: 'employee 1', department: 1 });
+      expect(column.getLookupData('id', '2')).toEqual({ id: 2, name: 'employee 2', department: 1 });
+
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+    });
+
+    it('when called with values that are already in lookupData, should not call datasource.get', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      baseProps.storeData = false;
+      const column = new TekGridColumn(baseProps, grid);
+
+      column.lookupData = {
+        1: { id: 1, name: 'employee 1', department: 1 },
+      };
+      (column as any).lookupDatasource?.data.push({ id: 2, name: 'employee 2', department: 1 });
+
+      const data = await column.getBatchLookupData('id', [1, 2]);
+      expect(data).toEqual([
+        { id: 1, name: 'employee 1', department: 1 },
+        { id: 2, name: 'employee 2', department: 1 },
+      ]);
+
+      expect(httpSpy).toHaveBeenCalledTimes(0);
+    });
+  });
+
+  describe('memorySearch()', () => {
+    it('should search in memory', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(baseProps, grid);
+
+      let data = await column.memorySearch('employee 15');
+      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+
+      baseProps.componentProps!.dataText = ['id'];
+      const column2 = new TekGridColumn(baseProps, grid);
+
+      data = await column2.memorySearch('3');
+      expect(data).toEqual([{ id: 3, name: 'employee 3', department: 1 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(2);
+    });
+
+    it('should not make request if data is already in memory', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(baseProps, grid);
+
+      let data = await column.memorySearch('employee 15');
+      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+
+      data = await column.memorySearch('employee 2');
+      expect(data).toEqual([{ id: 2, name: 'employee 2', department: 1 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+    });
+
+    it('should always make another request when storeData is false', async () => {
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      baseProps.storeData = false;
+      const column = new TekGridColumn(baseProps, grid);
+
+      let data = await column.memorySearch('employee 15');
+      expect(data).toEqual([{ id: 15, name: 'employee 15', department: 2 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(1);
+
+      data = await column.memorySearch('employee 2');
+      expect(data).toEqual([{ id: 2, name: 'employee 2', department: 1 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(2);
+
+      data = await column.memorySearch('employee 3');
+      expect(data).toEqual([{ id: 3, name: 'employee 3', department: 1 }]);
+      expect(httpSpy).toHaveBeenCalledTimes(3);
+    });
+
+    it('should throw error if column doesn\'t have a datasource', async () => {
+      baseProps = {
+        name: 'employee_id',
+        componentProps: {
+          name: 'ZdTextInput',
+        },
+      };
+      const grid = new TekGrid({ name: 'grid', component: 'TekGrid' });
+      const column = new TekGridColumn(baseProps, grid);
+
+      await expect(column.memorySearch('')).rejects.toThrow();
+    });
+  });
+});