PivotGrid: fix z-index of fieldChooser (T1290333)

e2e/testcafe-devextreme/tests/pivotGrid/fieldChooser/fieldChooser.ts

@@ -7,7 +7,7 @@ import { createWidget } from '../../../helpers/createWidget';
 import { sales } from '../data.js';
 
 fixture.disablePageReloads`PivotGrid_fieldChooser`
-  .page(url(__dirname, '../container.html'));
+  .page(url(__dirname, '../../container.html'));
 
 test('Change dataFiels order with one invisible field (T1079461)', async (t) => {
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
@@ -547,3 +547,26 @@ test('Change dataFiels order when applyChangesMode is "onDemand" (T1097764)', as
     store: sales,
   },
 }));
+
+test('Field chooser can be clicked (T1290333)', async (t) => {
+  const pivotGrid = new PivotGrid('#container');
+
+  await t.click(pivotGrid.getFieldChooserButton());
+  await t
+    .expect(pivotGrid.getFieldChooser().element.exists)
+    .ok();
+}).before(async () => createWidget('dxPivotGrid', {
+  showBorders: true,
+  fieldPanel: {
+    showFilterFields: false,
+    visible: true,
+  },
+  dataSource: {
+    fields: [{
+      dataField: 'date',
+      dataType: 'date',
+      area: 'column',
+    }],
+    store: [],
+  },
+}));

packages/devextreme-scss/scss/widgets/base/pivotGrid/_index.scss

@@ -131,6 +131,8 @@ $pivotgrid-expand-icon-text-offset: 0;
       margin-right: 10px;
       float: right;
       display: inline-block;
+      position: relative;
+      z-index: 1;
 
       .dx-button {
         margin-top: $pivotgrid-button-top-padding;