Add tests

elastic · Sep 20, 2023 · 8500388 · 8500388
1 parent 84eb5fd
commit 8500388
Show file tree

Hide file tree

Showing 2 changed files with 124 additions and 20 deletions.
diff --git a/src/components/datagrid/controls/data_grid_toolbar.test.tsx b/src/components/datagrid/controls/data_grid_toolbar.test.tsx
@@ -135,6 +135,36 @@ describe('EuiDataGridToolbar', () => {
       </div>
     `);
   });
+
+  it('renders custom content if renderCustomToolbar is defined', () => {
+    const mockRenderCustomToolbar = jest.fn(() => (
+      <div data-test-subj="test">Custom</div>
+    ));
+    const component = shallow(
+      <EuiDataGridToolbar
+        {...requiredProps}
+        renderCustomToolbar={mockRenderCustomToolbar}
+      />
+    );
+
+    expect(component).toMatchInlineSnapshot(`
+      <div
+        data-test-subj="test"
+      >
+        Custom
+      </div>
+    `);
+    expect(mockRenderCustomToolbar).toHaveBeenCalledWith(
+      expect.objectContaining({
+        hasRoomForGridControls: true,
+        fullScreenControl: requiredProps.fullScreenSelector,
+        keyboardShortcutsControl: requiredProps.keyboardShortcuts,
+        displayControl: requiredProps.displaySelector,
+        columnControl: requiredProps.columnSelector,
+        columnSortingControl: requiredProps.columnSorting,
+      })
+    );
+  });
 });
 
 describe('checkOrDefaultToolBarDisplayOptions', () => {

diff --git a/src/components/datagrid/controls/display_selector.test.tsx b/src/components/datagrid/controls/display_selector.test.tsx
@@ -402,26 +402,100 @@ describe('useDataGridDisplaySelector', () => {
       });
     });
 
-    it('renders a reset button only when the user changes from the current settings', () => {
-      const component = mount(<MockComponent gridStyles={startingStyles} />);
-      openPopover(component);
-      expect(
-        component.find('[data-test-subj="resetDisplaySelector"]').exists()
-      ).toBe(false);
-
-      component.find('[data-test-subj="expanded"]').simulate('change');
-      component.find('[data-test-subj="auto"]').simulate('change');
-      expect(
-        component.find('[data-test-subj="resetDisplaySelector"]').exists()
-      ).toBe(true);
-
-      // Should hide the reset button again after it's been clicked
-      component
-        .find('button[data-test-subj="resetDisplaySelector"]')
-        .simulate('click');
-      expect(
-        component.find('[data-test-subj="resetDisplaySelector"]').exists()
-      ).toBe(false);
+    describe('reset button', () => {
+      it('renders a reset button only when the user changes from the current settings', () => {
+        const component = mount(<MockComponent gridStyles={startingStyles} />);
+        openPopover(component);
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+
+        component.find('[data-test-subj="expanded"]').simulate('change');
+        component.find('[data-test-subj="auto"]').simulate('change');
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(true);
+
+        // Should hide the reset button again after it's been clicked
+        component
+          .find('button[data-test-subj="resetDisplaySelector"]')
+          .simulate('click');
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+      });
+
+      it('renders the reset button after the user changed from the current settings and reopened popover', () => {
+        const component = mount(<MockComponent gridStyles={startingStyles} />);
+        openPopover(component);
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+
+        component.find('[data-test-subj="expanded"]').simulate('change');
+        component.find('[data-test-subj="auto"]').simulate('change');
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(true);
+
+        // Should show the reset button again after the popover was reopened
+        closePopover(component);
+        openPopover(component);
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(true);
+      });
+
+      it('hides the reset button even after changes if allowResetButton is false', () => {
+        const component = mount(
+          <MockComponent
+            showDisplaySelector={{
+              allowResetButton: false,
+            }}
+            gridStyles={startingStyles}
+          />
+        );
+        openPopover(component);
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+
+        component.find('[data-test-subj="expanded"]').simulate('change');
+        component.find('[data-test-subj="auto"]').simulate('change');
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+
+        // Should hide the reset button again after the popover was reopened
+        closePopover(component);
+        openPopover(component);
+        expect(
+          component.find('[data-test-subj="resetDisplaySelector"]').exists()
+        ).toBe(false);
+      });
+    });
+
+    describe('additionalDisplaySettings', () => {
+      it('renders custom content if additionalDisplaySettings is defined', () => {
+        const component = mount(
+          <MockComponent
+            showDisplaySelector={{
+              additionalDisplaySettings: (
+                <div data-test-subj="test-custom">Custom content</div>
+              ),
+            }}
+          />
+        );
+        openPopover(component);
+        expect(component.find('[data-test-subj="test-custom"]'))
+          .toMatchInlineSnapshot(`
+          <div
+            data-test-subj="test-custom"
+          >
+            Custom content
+          </div>
+        `);
+      });
     });
   });