diff --git a/e2e/testcafe-devextreme/tests/cardView/selection/functional.ts b/e2e/testcafe-devextreme/tests/cardView/selection/functional.ts index 49a82523f63e..ff18afe11777 100644 --- a/e2e/testcafe-devextreme/tests/cardView/selection/functional.ts +++ b/e2e/testcafe-devextreme/tests/cardView/selection/functional.ts @@ -968,3 +968,32 @@ test('Switching the showCheckBoxesMode option from always to onClick at runtime showCheckBoxesMode: 'always', }, })); + +test('"Deselect all" should work after changing showCheckboxMode', async (t) => { + const cardView = new CardView('#container'); + + await cardView.option('selection.showCheckBoxesMode', 'onClick'); + + await t.click( + cardView.getToolbar().getClearSelectionButton(), + ); + + await t + .expect(cardView.getToolbar().isClearSelectionButtonDisabled()) + .ok(); + + for (let i = 0; i < 6; i += 1) { + await t + .expect(cardView.getCard(i).isSelected) + .notOk(); + } +}).before(async () => createWidget('dxCardView', { + dataSource: [ + { a: 1 }, { a: 2 }, { a: 3 }, { a: 4 }, { a: 5 }, { a: 6 }, + ], + keyExpr: 'a', + selection: { + mode: 'multiple', + }, + selectedCardKeys: [1, 2], +})); diff --git a/e2e/testcafe-devextreme/tests/dataGrid/common/selection.ts b/e2e/testcafe-devextreme/tests/dataGrid/common/selection.ts index a6ea3f77618b..e2a69f3d9830 100644 --- a/e2e/testcafe-devextreme/tests/dataGrid/common/selection.ts +++ b/e2e/testcafe-devextreme/tests/dataGrid/common/selection.ts @@ -293,3 +293,36 @@ test('"Select All" checkbox should not react when not visible', async (t) => { width: 90, }], })); + +test('"Deselect all" should work after changing showCheckboxMode', async (t) => { + const dataGrid = new DataGrid('#container'); + + await dataGrid.option('selection.showCheckBoxesMode', 'onClick'); + + const selectAllCheckBox = new CheckBox( + dataGrid.getHeaders().getHeaderRow(0).getHeaderCell(0).getEditor().element, + ); + + await t.click(selectAllCheckBox.element); // select all + await t.click(selectAllCheckBox.element); // deselect all + + await t + .expect(selectAllCheckBox.option('value')) + .eql(false); + + for (let i = 0; i < 7; i += 1) { + await t + .expect(dataGrid.getDataRow(i).isSelected) + .notOk(); + } +}).before(async () => createWidget('dxDataGrid', { + dataSource: [ + { a: 1 }, { a: 2 }, { a: 3 }, { a: 4 }, { a: 5 }, { a: 6 }, { a: 7 }, + ], + keyExpr: 'a', + selection: { + mode: 'multiple', + showCheckBoxesMode: 'always', + }, + selectedRowKeys: [1, 2], +})); diff --git a/packages/devextreme/js/__internal/grids/grid_core/selection/m_selection.ts b/packages/devextreme/js/__internal/grids/grid_core/selection/m_selection.ts index c058a835c882..da67a32f4c54 100644 --- a/packages/devextreme/js/__internal/grids/grid_core/selection/m_selection.ts +++ b/packages/devextreme/js/__internal/grids/grid_core/selection/m_selection.ts @@ -440,6 +440,10 @@ export class SelectionController extends modules.Controller { this.selectRows(selectedRowKeys).always(() => { this._fireSelectionChanged(); }); + } else { + this.refresh().always(() => { + this._fireSelectionChanged(); + }); } this._columnsController.updateColumns(); diff --git a/packages/devextreme/js/__internal/grids/new/grid_core/selection/controller.ts b/packages/devextreme/js/__internal/grids/new/grid_core/selection/controller.ts index 262bb9e907c5..aeb452890f66 100644 --- a/packages/devextreme/js/__internal/grids/new/grid_core/selection/controller.ts +++ b/packages/devextreme/js/__internal/grids/new/grid_core/selection/controller.ts @@ -149,6 +149,14 @@ export class SelectionController { }); effect(() => { + /* + TODO: subscription to selectionHelper to update keys if it is reinitialized. + Need to get rid of `selectionHelper.peek()` inside of selectCards() + and pass selectionHelper from here + */ + // eslint-disable-next-line @typescript-eslint/no-unused-expressions + this.selectionHelper.value; + const isLoaded = this.dataController.isLoaded.value; if (isLoaded) { const selectedCardKeys = this.selectedCardKeys.peek();