diff --git a/packages/main/src/Table.js b/packages/main/src/Table.js index f0d8fe5fb833..6e4afab70c2a 100644 --- a/packages/main/src/Table.js +++ b/packages/main/src/Table.js @@ -51,6 +51,7 @@ const metadata = { propertyName: "rows", type: HTMLElement, individualSlots: true, + invalidateOnChildChange: true, }, /** @@ -434,6 +435,7 @@ class Table extends UI5Element { const columnSettings = this.getColumnPropagationSettings(); const columnSettingsString = JSON.stringify(columnSettings); const rowsCount = this.rows.length; + const selectedRows = this.selectedRows; this.rows.forEach((row, index) => { if (row._columnsInfoString !== columnSettingsString) { @@ -455,6 +457,8 @@ class Table extends UI5Element { this._noDataDisplayed = !this.rows.length && !this.hideNoData; this.visibleColumnsCount = this.visibleColumns.length; + + this._allRowsSelected = selectedRows.length === this.rows.length; } onAfterRendering() { diff --git a/packages/main/test/specs/Table.spec.js b/packages/main/test/specs/Table.spec.js index 1a2160c3bca9..0db974a8298f 100644 --- a/packages/main/test/specs/Table.spec.js +++ b/packages/main/test/specs/Table.spec.js @@ -371,6 +371,36 @@ describe("Table general interaction", () => { assert.strictEqual(await selectionChangeCount.getProperty("value"), "5", "Enter key over an already selected row should trigger selection-change event"); }); + it("test selectAll functionallity in MultiSelect mode", async () => { + await browser.url("http://localhost:8080/test-resources/pages/TableSelection.html"); + const firstRow = await browser.$("#firstRowMultiSelect"); + const secondRow = await browser.$("#secondRowMultiSelect"); + const thirdRow = await browser.$("#thirdRowMultiSelect"); + const forthRow = await browser.$("#forthRowMultiSelect"); + const table = await browser.$("#multi"); + const selectAllCheckBox = await table.shadow$("thead ui5-checkbox"); + + // act + await firstRow.setProperty("selected", true); + await secondRow.setProperty("selected", true); + await thirdRow.setProperty("selected", true); + await forthRow.setProperty("selected", true); + + // assert + assert.ok(await firstRow.getAttribute("selected"), "The first row is selected"); + assert.ok(await secondRow.getAttribute("selected"), "The second row is selected"); + assert.ok(await thirdRow.getAttribute("selected"), "The third row is selected"); + assert.ok(await forthRow.getAttribute("selected"), "The forth row is selected"); + assert.ok(await selectAllCheckBox.getProperty("checked"), "Select all checkbox is checked"); + + // act + await forthRow.setProperty("selected", false); + + // assert + assert.notOk(await forthRow.getAttribute("selected"), "The forth row is not selected"); + assert.notOk(await selectAllCheckBox.getProperty("checked"), "Select all checkbox is not checked"); + }); + it("test mouse and keyboard interaction over Active/Inactive row in Default mode", async () => { const table = await browser.$("#default"); const firstRow = await browser.$("#firstRowDefaultMode");