DataGrid – Header filters show "No data to display" when "not and" or "not or" operations are used in the filter panel (T1291737) (DevExpress#29931)

Author: tongsonbarbs

e2e/testcafe-devextreme/tests/dataGrid/common/headerFilter/headerFilter.ts

@@ -358,3 +358,33 @@ test('Header filter search input loses focus on first key in datetime columns (T
     },
   }],
 }));
+
+test('DataGrid – Header filters show "No data to display" when "not and" or "not or" operations are used in the filter panel (T1291737)', async (t) => {
+  const dataGrid = new DataGrid(GRID_CONTAINER);
+  const headerFilterButton = dataGrid.getHeaders()
+    .getHeaderRow(0)
+    .getHeaderCell(0)
+    .getFilterIcon();
+  const headerFilter = new HeaderFilter();
+  const listCount = headerFilter.getList().getItems();
+
+  await dataGrid.isReady();
+  await t.click(headerFilterButton);
+
+  await t
+    .expect(listCount.count)
+    .eql(9);
+}).before(async () => createWidget('dxDataGrid', {
+  dataSource: getData(10, 1),
+  keyExpr: 'field_0',
+  filterValue: [
+    '!',
+    [['field_0', '=', 'val_0_0']],
+  ],
+  filterPanel: {
+    visible: true,
+  },
+  headerFilter: {
+    visible: true,
+  },
+}));

packages/devextreme/js/__internal/filter_builder/m_utils.ts

@@ -779,6 +779,8 @@ export function removeFieldConditionsFromFilter(filter, dataField) {
 
 function syncConditionIntoGroup(filter, addedFilter, canPush) {
   const result: any[] = [];
+  const isNegation = isNegationGroup(filter);
+
   filter.forEach((item) => {
     if (isCondition(item)) {
       if (isMatchedCondition(item, addedFilter[0])) {
@@ -805,6 +807,10 @@ function syncConditionIntoGroup(filter, addedFilter, canPush) {
     result.push(addedFilter);
   }
 
+  if (isNegation) {
+    return ['!', result.length === 1 ? result[0] : result];
+  }
+
   return result.length === 1 ? result[0] : result;
 }
 

…pshots__/view.intergration.test.tsx.snap …apshots__/view.integration.test.tsx.snappackages/devextreme/js/__internal/grids/new/grid_core/filtering/header_filter/__snapshots__/view.intergration.test.tsx.snap renamed to packages/devextreme/js/__internal/grids/new/grid_core/filtering/header_filter/__snapshots__/view.integration.test.tsx.snap packages/devextreme/js/__internal/grids/new/grid_core/filtering/header_filter/__snapshots__/view.intergration.test.tsx.snap renamed to packages/devextreme/js/__internal/grids/new/grid_core/filtering/header_filter/__snapshots__/view.integration.test.tsx.snap

@@ -3,6 +3,7 @@ import {
   afterEach, describe, expect, it,
 } from '@jest/globals';
 import $ from '@js/core/renderer';
+import type { Filter } from '@ts/grids/grid_core/data_controller/m_data_controller';
 import CardView from '@ts/grids/new/card_view/widget';
 import type {
   HeaderFilterSearchColumnOptions,
@@ -270,6 +271,36 @@ describe('Options', () => {
 
       expect(popupContentElement).toMatchSnapshot();
     });
+
+    it.each<{
+      filterValue: Filter; result: number;
+    }>([
+      {
+        filterValue: ['!', [['A', '=', 'A_0']]], result: 4,
+      },
+    ])('should render correct list total count if filterValue has negation', ({ filterValue, result }) => {
+      const cardView = setup({
+        dataSource: [
+          { A: 'A_0' }, { A: 'A_1' }, { A: 'A_2' }, { A: 'A_3' }, { A: 'A_4' },
+        ],
+        columns: [{
+          dataField: 'A',
+        }],
+        filterValue,
+        headerFilter: {
+          visible: true,
+        },
+        filterSyncEnabled: true,
+        filterPanel: { visible: true },
+      });
+
+      openHeaderFilterPopup(cardView);
+      const { element: popupContentElement } = getPopup();
+      const { instance } = getPopupList(popupContentElement);
+      const listCount = instance._selection.options.totalCount();
+
+      expect(listCount).toStrictEqual(result);
+    });
   });
 
   describe('Column.HeaderFilter', () => {