diff --git a/packages/grid/src/vaadin-grid-a11y-mixin.js b/packages/grid/src/vaadin-grid-a11y-mixin.js index 28f813f0c0..bdf07bf48c 100644 --- a/packages/grid/src/vaadin-grid-a11y-mixin.js +++ b/packages/grid/src/vaadin-grid-a11y-mixin.js @@ -11,7 +11,7 @@ import { iterateChildren, iterateRowCells } from './vaadin-grid-helpers.js'; export const A11yMixin = (superClass) => class A11yMixin extends superClass { static get observers() { - return ['_a11yUpdateGridSize(size, _columnTree, _columnTree.*)']; + return ['_a11yUpdateGridSize(size, _columnTree)']; } /** @private */ diff --git a/packages/grid/src/vaadin-grid-array-data-provider-mixin.js b/packages/grid/src/vaadin-grid-array-data-provider-mixin.js index 661525d80b..e47c6c5a84 100644 --- a/packages/grid/src/vaadin-grid-array-data-provider-mixin.js +++ b/packages/grid/src/vaadin-grid-array-data-provider-mixin.js @@ -22,7 +22,7 @@ export const ArrayDataProviderMixin = (superClass) => } static get observers() { - return ['__dataProviderOrItemsChanged(dataProvider, items, isAttached, items.*, _filters, _sorters)']; + return ['__dataProviderOrItemsChanged(dataProvider, items, isAttached, _filters, _sorters, items.*)']; } /** @private */ diff --git a/packages/grid/src/vaadin-grid-column-mixin.js b/packages/grid/src/vaadin-grid-column-mixin.js index 85004dbe4a..6371aec271 100644 --- a/packages/grid/src/vaadin-grid-column-mixin.js +++ b/packages/grid/src/vaadin-grid-column-mixin.js @@ -241,21 +241,21 @@ export const ColumnBaseMixin = (superClass) => static get observers() { return [ - '_widthChanged(width, _headerCell, _footerCell, _cells.*)', - '_frozenChanged(frozen, _headerCell, _footerCell, _cells.*)', - '_frozenToEndChanged(frozenToEnd, _headerCell, _footerCell, _cells.*)', - '_flexGrowChanged(flexGrow, _headerCell, _footerCell, _cells.*)', - '_textAlignChanged(textAlign, _cells.*, _headerCell, _footerCell)', - '_orderChanged(_order, _headerCell, _footerCell, _cells.*)', + '_widthChanged(width, _headerCell, _footerCell, _cells)', + '_frozenChanged(frozen, _headerCell, _footerCell, _cells)', + '_frozenToEndChanged(frozenToEnd, _headerCell, _footerCell, _cells)', + '_flexGrowChanged(flexGrow, _headerCell, _footerCell, _cells)', + '_textAlignChanged(textAlign, _cells, _headerCell, _footerCell)', + '_orderChanged(_order, _headerCell, _footerCell, _cells)', '_lastFrozenChanged(_lastFrozen)', '_firstFrozenToEndChanged(_firstFrozenToEnd)', - '_onRendererOrBindingChanged(_renderer, _cells, _bodyContentHidden, _cells.*, path)', + '_onRendererOrBindingChanged(_renderer, _cells, _bodyContentHidden, path)', '_onHeaderRendererOrBindingChanged(_headerRenderer, _headerCell, path, header)', '_onFooterRendererOrBindingChanged(_footerRenderer, _footerCell)', '_resizableChanged(resizable, _headerCell)', - '_reorderStatusChanged(_reorderStatus, _headerCell, _footerCell, _cells.*)', - '_hiddenChanged(hidden, _headerCell, _footerCell, _cells.*)', - '_rowHeaderChanged(rowHeader, _cells.*)', + '_reorderStatusChanged(_reorderStatus, _headerCell, _footerCell, _cells)', + '_hiddenChanged(hidden, _headerCell, _footerCell, _cells)', + '_rowHeaderChanged(rowHeader, _cells)', '__headerFooterPartNameChanged(_headerCell, _footerCell, headerPartName, footerPartName)', ]; } @@ -444,11 +444,11 @@ export const ColumnBaseMixin = (superClass) => /** @private */ _rowHeaderChanged(rowHeader, cells) { - if (!cells.value) { + if (!cells) { return; } - cells.value.forEach((cell) => { + cells.forEach((cell) => { cell.setAttribute('role', rowHeader ? 'rowheader' : 'gridcell'); }); } diff --git a/packages/grid/src/vaadin-grid-mixin.js b/packages/grid/src/vaadin-grid-mixin.js index fb11ad58b5..2b6ef9ec35 100644 --- a/packages/grid/src/vaadin-grid-mixin.js +++ b/packages/grid/src/vaadin-grid-mixin.js @@ -86,10 +86,7 @@ export const GridMixin = (superClass) => ), ) { static get observers() { - return [ - '_columnTreeChanged(_columnTree, _columnTree.*)', - '_flatSizeChanged(_flatSize, __virtualizer, _hasData, _columnTree)', - ]; + return ['_columnTreeChanged(_columnTree)', '_flatSizeChanged(_flatSize, __virtualizer, _hasData, _columnTree)']; } static get properties() { @@ -510,9 +507,11 @@ export const GridMixin = (superClass) => } if (this._columnTree) { - this._columnTree[this._columnTree.length - 1].forEach( - (c) => c.isConnected && c.notifyPath && c.notifyPath('_cells.*', c._cells), - ); + this._columnTree[this._columnTree.length - 1].forEach((c) => { + if (c.isConnected && c._cells) { + c._cells = [...c._cells]; + } + }); } this.__afterCreateScrollerRowsDebouncer = Debouncer.debounce( @@ -677,8 +676,8 @@ export const GridMixin = (superClass) => detailsCell._vacant = false; } - if (column.notifyPath && !noNotify) { - column.notifyPath('_cells.*', column._cells); + if (!noNotify) { + column._cells = [...column._cells]; } } else { // Header & footer diff --git a/packages/grid/src/vaadin-grid-row-details-mixin.js b/packages/grid/src/vaadin-grid-row-details-mixin.js index 11d575a0b0..2c14dd1e0b 100644 --- a/packages/grid/src/vaadin-grid-row-details-mixin.js +++ b/packages/grid/src/vaadin-grid-row-details-mixin.js @@ -51,7 +51,7 @@ export const RowDetailsMixin = (superClass) => static get observers() { return [ - '_detailsOpenedItemsChanged(detailsOpenedItems.*, rowDetailsRenderer)', + '_detailsOpenedItemsChanged(detailsOpenedItems, rowDetailsRenderer)', '_rowDetailsRendererChanged(rowDetailsRenderer)', ]; } @@ -90,12 +90,7 @@ export const RowDetailsMixin = (superClass) => } /** @private */ - _detailsOpenedItemsChanged(changeRecord, rowDetailsRenderer) { - // Skip to avoid duplicate work of both `.splices` and `.length` updates. - if (changeRecord.path === 'detailsOpenedItems.length' || !changeRecord.value) { - return; - } - + _detailsOpenedItemsChanged(detailsOpenedItems, rowDetailsRenderer) { iterateChildren(this.$.items, (row) => { // Re-renders the row to possibly close the previously opened details. if (row.hasAttribute('details-opened')) { diff --git a/packages/grid/src/vaadin-grid-selection-mixin.js b/packages/grid/src/vaadin-grid-selection-mixin.js index f3754c6c17..318734d85d 100644 --- a/packages/grid/src/vaadin-grid-selection-mixin.js +++ b/packages/grid/src/vaadin-grid-selection-mixin.js @@ -33,7 +33,7 @@ export const SelectionMixin = (superClass) => } static get observers() { - return ['__selectedItemsChanged(itemIdPath, selectedItems.*)']; + return ['__selectedItemsChanged(itemIdPath, selectedItems)']; } /** diff --git a/packages/grid/test/array-data-provider.common.js b/packages/grid/test/array-data-provider.common.js index b0c662a595..93611f0e4c 100644 --- a/packages/grid/test/array-data-provider.common.js +++ b/packages/grid/test/array-data-provider.common.js @@ -43,22 +43,6 @@ describe('array data provider', () => { expect(getBodyCellContent(grid, 1, 0).textContent).to.equal('baz'); }); - it('should be observed for shift', () => { - grid.unshift('items', { - name: { - first: 'a', - last: 'b', - }, - }); - expect(grid.size).to.equal(3); - expect(getBodyCellContent(grid, 0, 0).textContent).to.equal('a'); - }); - - it('should be observed for mutation', () => { - grid.set('items.0.name.first', 'new'); - expect(getBodyCellContent(grid, 0, 0).textContent).to.equal('new'); - }); - it('should handle null', () => { grid.items = null; expect(grid.size).to.equal(0); diff --git a/packages/grid/test/selection.common.js b/packages/grid/test/selection.common.js index 9a9968ac04..ebf4eb463b 100644 --- a/packages/grid/test/selection.common.js +++ b/packages/grid/test/selection.common.js @@ -80,7 +80,7 @@ describe('selection', () => { describe('selectedItems', () => { it('should reflect changes', () => { - grid.push('selectedItems', cachedItems[1]); + grid.selectedItems = [...grid.selectedItems, cachedItems[1]]; expect(rows[1].hasAttribute('selected')).to.be.true; }); @@ -250,7 +250,7 @@ describe('multi selection column', () => { it('should have bound the body checkbox to selected items', () => { const selectCheckbox = firstBodyCheckbox; - grid.push('selectedItems', cachedItems[0]); + grid.selectedItems = [...grid.selectedItems, cachedItems[0]]; expect(selectCheckbox.checked).to.be.true; });