Skip to content

Commit cbe9c29

Browse files
committed
update parts when row's visibility changes
1 parent 49ce5cf commit cbe9c29

File tree

2 files changed

+52
-51
lines changed

2 files changed

+52
-51
lines changed

packages/grid/src/vaadin-grid-mixin.js

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -642,10 +642,12 @@ export const GridMixin = (superClass) =>
642642

643643
if (row.parentElement === this.$.header) {
644644
this.$.table.toggleAttribute('has-header', this.$.header.querySelector('tr:not([hidden])'));
645+
this.__updateSectionRowsParts('header', [row]);
645646
}
646647

647648
if (row.parentElement === this.$.footer) {
648649
this.$.table.toggleAttribute('has-footer', this.$.footer.querySelector('tr:not([hidden])'));
650+
this.__updateSectionRowsParts('footer', [row]);
649651
}
650652

651653
// Make sure the section has a tabbable element
@@ -730,15 +732,16 @@ export const GridMixin = (superClass) =>
730732
iterateChildren(this.$.header, (headerRow, index) => {
731733
this.__initRow(headerRow, columnTree[index], 'header', index === columnTree.length - 1);
732734
});
735+
this.__updateSectionRowsParts('header', [...this.$.header.children]);
733736

734737
iterateChildren(this.$.footer, (footerRow, index) => {
735738
this.__initRow(footerRow, columnTree[columnTree.length - 1 - index], 'footer', index === 0);
736739
});
740+
this.__updateSectionRowsParts('footer', [...this.$.footer.children]);
737741

738742
// Sizer rows
739743
this.__initRow(this.$.sizer, columnTree[columnTree.length - 1]);
740744

741-
this.__updateHeaderAndFooterRowParts();
742745
this._resizeHandler();
743746
this._frozenCellsChanged();
744747
this._updateFirstAndLastColumn();
@@ -751,17 +754,15 @@ export const GridMixin = (superClass) =>
751754
}
752755

753756
/** @private */
754-
__updateHeaderAndFooterRowParts() {
755-
['header', 'footer'].forEach((section) => {
756-
const visibleRows = [...this.$[section].querySelectorAll('tr:not([hidden])')];
757-
[...this.$[section].children].forEach((row) => {
758-
updatePart(row, row === visibleRows.at(0), `first-${section}-row`);
759-
updatePart(row, row === visibleRows.at(-1), `last-${section}-row`);
760-
761-
const cells = getBodyRowCells(row);
762-
updateCellsPart(cells, `first-${section}-row-cell`, row === visibleRows.at(0));
763-
updateCellsPart(cells, `last-${section}-row-cell`, row === visibleRows.at(-1));
764-
});
757+
__updateSectionRowsParts(section, rows) {
758+
const visibleRows = [...this.$[section].querySelectorAll('tr:not([hidden])')];
759+
rows.forEach((row) => {
760+
updatePart(row, row === visibleRows.at(0), `first-${section}-row`);
761+
updatePart(row, row === visibleRows.at(-1), `last-${section}-row`);
762+
763+
const cells = getBodyRowCells(row);
764+
updateCellsPart(cells, `first-${section}-row-cell`, row === visibleRows.at(0));
765+
updateCellsPart(cells, `last-${section}-row-cell`, row === visibleRows.at(-1));
765766
});
766767
}
767768

packages/grid/test/dom/__snapshots__/grid.test.snap.js

Lines changed: 39 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -220,14 +220,14 @@ snapshots["vaadin-grid basic shadow default"] =
220220
<tr
221221
aria-rowindex="4"
222222
hidden=""
223-
part="row footer-row first-footer-row last-footer-row"
223+
part="row footer-row"
224224
role="row"
225225
tabindex="-1"
226226
>
227227
<td
228228
first-column=""
229229
id="vaadin-grid-cell-2"
230-
part="cell footer-cell first-column-cell first-footer-row-cell last-footer-row-cell"
230+
part="cell footer-cell first-column-cell"
231231
role="gridcell"
232232
style="width: 100px; flex-grow: 1; order: 10000000;"
233233
tabindex="0"
@@ -238,7 +238,7 @@ snapshots["vaadin-grid basic shadow default"] =
238238
<td
239239
id="vaadin-grid-cell-3"
240240
last-column=""
241-
part="cell footer-cell last-column-cell first-footer-row-cell last-footer-row-cell"
241+
part="cell footer-cell last-column-cell"
242242
role="gridcell"
243243
style="width: 100px; flex-grow: 1; order: 20000000;"
244244
tabindex="-1"
@@ -446,14 +446,14 @@ snapshots["vaadin-grid basic shadow selected"] =
446446
<tr
447447
aria-rowindex="4"
448448
hidden=""
449-
part="row footer-row first-footer-row last-footer-row"
449+
part="row footer-row"
450450
role="row"
451451
tabindex="-1"
452452
>
453453
<td
454454
first-column=""
455455
id="vaadin-grid-cell-2"
456-
part="cell footer-cell first-column-cell first-footer-row-cell last-footer-row-cell"
456+
part="cell footer-cell first-column-cell"
457457
role="gridcell"
458458
style="width: 100px; flex-grow: 1; order: 10000000;"
459459
tabindex="0"
@@ -464,7 +464,7 @@ snapshots["vaadin-grid basic shadow selected"] =
464464
<td
465465
id="vaadin-grid-cell-3"
466466
last-column=""
467-
part="cell footer-cell last-column-cell first-footer-row-cell last-footer-row-cell"
467+
part="cell footer-cell last-column-cell"
468468
role="gridcell"
469469
style="width: 100px; flex-grow: 1; order: 20000000;"
470470
tabindex="-1"
@@ -671,14 +671,14 @@ snapshots["vaadin-grid basic shadow details opened"] =
671671
<tr
672672
aria-rowindex="4"
673673
hidden=""
674-
part="row footer-row first-footer-row last-footer-row"
674+
part="row footer-row"
675675
role="row"
676676
tabindex="-1"
677677
>
678678
<td
679679
first-column=""
680680
id="vaadin-grid-cell-2"
681-
part="cell footer-cell first-column-cell first-footer-row-cell last-footer-row-cell"
681+
part="cell footer-cell first-column-cell"
682682
role="gridcell"
683683
style="width: 100px; flex-grow: 1; order: 10000000;"
684684
tabindex="0"
@@ -689,7 +689,7 @@ snapshots["vaadin-grid basic shadow details opened"] =
689689
<td
690690
id="vaadin-grid-cell-3"
691691
last-column=""
692-
part="cell footer-cell last-column-cell first-footer-row-cell last-footer-row-cell"
692+
part="cell footer-cell last-column-cell"
693693
role="gridcell"
694694
style="width: 100px; flex-grow: 1; order: 20000000;"
695695
tabindex="-1"
@@ -1341,15 +1341,15 @@ snapshots["vaadin-grid column groups default"] =
13411341
<tr
13421342
aria-rowindex="1"
13431343
hidden=""
1344-
part="row header-row first-header-row"
1344+
part="row header-row"
13451345
role="row"
13461346
tabindex="-1"
13471347
>
13481348
<th
13491349
first-column=""
13501350
id="vaadin-grid-cell-0"
13511351
last-column=""
1352-
part="cell header-cell first-column-cell last-column-cell first-header-row-cell"
1352+
part="cell header-cell first-column-cell last-column-cell"
13531353
role="columnheader"
13541354
tabindex="-1"
13551355
>
@@ -1359,14 +1359,14 @@ snapshots["vaadin-grid column groups default"] =
13591359
</tr>
13601360
<tr
13611361
aria-rowindex="2"
1362-
part="row header-row last-header-row"
1362+
part="row header-row last-header-row first-header-row"
13631363
role="row"
13641364
tabindex="-1"
13651365
>
13661366
<th
13671367
first-column=""
13681368
id="vaadin-grid-cell-1"
1369-
part="cell header-cell first-column-cell last-header-row-cell"
1369+
part="cell header-cell first-column-cell last-header-row-cell first-header-row-cell"
13701370
role="columnheader"
13711371
style="width: 100px; flex-grow: 1;"
13721372
tabindex="0"
@@ -1377,7 +1377,7 @@ snapshots["vaadin-grid column groups default"] =
13771377
<th
13781378
id="vaadin-grid-cell-2"
13791379
last-column=""
1380-
part="cell header-cell last-column-cell last-header-row-cell"
1380+
part="cell header-cell last-column-cell last-header-row-cell first-header-row-cell"
13811381
role="columnheader"
13821382
style="width: 100px; flex-grow: 1;"
13831383
tabindex="-1"
@@ -1490,14 +1490,14 @@ snapshots["vaadin-grid column groups default"] =
14901490
<tr
14911491
aria-rowindex="4"
14921492
hidden=""
1493-
part="row footer-row first-footer-row"
1493+
part="row footer-row"
14941494
role="row"
14951495
tabindex="-1"
14961496
>
14971497
<td
14981498
first-column=""
14991499
id="vaadin-grid-cell-3"
1500-
part="cell footer-cell first-column-cell first-footer-row-cell"
1500+
part="cell footer-cell first-column-cell"
15011501
role="gridcell"
15021502
style="width: 100px; flex-grow: 1;"
15031503
tabindex="0"
@@ -1508,7 +1508,7 @@ snapshots["vaadin-grid column groups default"] =
15081508
<td
15091509
id="vaadin-grid-cell-4"
15101510
last-column=""
1511-
part="cell footer-cell last-column-cell first-footer-row-cell"
1511+
part="cell footer-cell last-column-cell"
15121512
role="gridcell"
15131513
style="width: 100px; flex-grow: 1;"
15141514
tabindex="-1"
@@ -1520,15 +1520,15 @@ snapshots["vaadin-grid column groups default"] =
15201520
<tr
15211521
aria-rowindex="5"
15221522
hidden=""
1523-
part="row footer-row last-footer-row"
1523+
part="row footer-row"
15241524
role="row"
15251525
tabindex="-1"
15261526
>
15271527
<td
15281528
first-column=""
15291529
id="vaadin-grid-cell-5"
15301530
last-column=""
1531-
part="cell footer-cell first-column-cell last-column-cell last-footer-row-cell"
1531+
part="cell footer-cell first-column-cell last-column-cell"
15321532
role="gridcell"
15331533
tabindex="-1"
15341534
>
@@ -1604,15 +1604,15 @@ snapshots["vaadin-grid column groups with footer"] =
16041604
<tr
16051605
aria-rowindex="1"
16061606
hidden=""
1607-
part="row header-row first-header-row"
1607+
part="row header-row"
16081608
role="row"
16091609
tabindex="-1"
16101610
>
16111611
<th
16121612
first-column=""
16131613
id="vaadin-grid-cell-0"
16141614
last-column=""
1615-
part="cell header-cell first-column-cell last-column-cell first-header-row-cell"
1615+
part="cell header-cell first-column-cell last-column-cell"
16161616
role="columnheader"
16171617
tabindex="-1"
16181618
>
@@ -1622,14 +1622,14 @@ snapshots["vaadin-grid column groups with footer"] =
16221622
</tr>
16231623
<tr
16241624
aria-rowindex="2"
1625-
part="row header-row last-header-row"
1625+
part="row header-row last-header-row first-header-row"
16261626
role="row"
16271627
tabindex="-1"
16281628
>
16291629
<th
16301630
first-column=""
16311631
id="vaadin-grid-cell-1"
1632-
part="cell header-cell first-column-cell last-header-row-cell"
1632+
part="cell header-cell first-column-cell last-header-row-cell first-header-row-cell"
16331633
role="columnheader"
16341634
style="width: 100px; flex-grow: 1;"
16351635
tabindex="0"
@@ -1640,7 +1640,7 @@ snapshots["vaadin-grid column groups with footer"] =
16401640
<th
16411641
id="vaadin-grid-cell-2"
16421642
last-column=""
1643-
part="cell header-cell last-column-cell last-header-row-cell"
1643+
part="cell header-cell last-column-cell last-header-row-cell first-header-row-cell"
16441644
role="columnheader"
16451645
style="width: 100px; flex-grow: 1;"
16461646
tabindex="-1"
@@ -1753,14 +1753,14 @@ snapshots["vaadin-grid column groups with footer"] =
17531753
<tr
17541754
aria-rowindex="4"
17551755
hidden=""
1756-
part="row footer-row first-footer-row"
1756+
part="row footer-row"
17571757
role="row"
17581758
tabindex="-1"
17591759
>
17601760
<td
17611761
first-column=""
17621762
id="vaadin-grid-cell-3"
1763-
part="cell footer-cell first-column-cell first-footer-row-cell"
1763+
part="cell footer-cell first-column-cell"
17641764
role="gridcell"
17651765
style="width: 100px; flex-grow: 1;"
17661766
tabindex="0"
@@ -1771,7 +1771,7 @@ snapshots["vaadin-grid column groups with footer"] =
17711771
<td
17721772
id="vaadin-grid-cell-4"
17731773
last-column=""
1774-
part="cell footer-cell last-column-cell first-footer-row-cell"
1774+
part="cell footer-cell last-column-cell"
17751775
role="gridcell"
17761776
style="width: 100px; flex-grow: 1;"
17771777
tabindex="-1"
@@ -1783,15 +1783,15 @@ snapshots["vaadin-grid column groups with footer"] =
17831783
<tr
17841784
aria-rowindex="5"
17851785
hidden=""
1786-
part="row footer-row last-footer-row"
1786+
part="row footer-row"
17871787
role="row"
17881788
tabindex="-1"
17891789
>
17901790
<td
17911791
first-column=""
17921792
id="vaadin-grid-cell-5"
17931793
last-column=""
1794-
part="cell footer-cell first-column-cell last-column-cell last-footer-row-cell"
1794+
part="cell footer-cell first-column-cell last-column-cell"
17951795
role="gridcell"
17961796
tabindex="-1"
17971797
>
@@ -1867,15 +1867,15 @@ snapshots["vaadin-grid column groups with header"] =
18671867
<tr
18681868
aria-rowindex="1"
18691869
hidden=""
1870-
part="row header-row first-header-row"
1870+
part="row header-row"
18711871
role="row"
18721872
tabindex="-1"
18731873
>
18741874
<th
18751875
first-column=""
18761876
id="vaadin-grid-cell-0"
18771877
last-column=""
1878-
part="cell header-cell first-column-cell last-column-cell first-header-row-cell"
1878+
part="cell header-cell first-column-cell last-column-cell"
18791879
role="columnheader"
18801880
tabindex="-1"
18811881
>
@@ -1885,14 +1885,14 @@ snapshots["vaadin-grid column groups with header"] =
18851885
</tr>
18861886
<tr
18871887
aria-rowindex="2"
1888-
part="row header-row last-header-row"
1888+
part="row header-row last-header-row first-header-row"
18891889
role="row"
18901890
tabindex="-1"
18911891
>
18921892
<th
18931893
first-column=""
18941894
id="vaadin-grid-cell-1"
1895-
part="cell header-cell first-column-cell last-header-row-cell"
1895+
part="cell header-cell first-column-cell last-header-row-cell first-header-row-cell"
18961896
role="columnheader"
18971897
style="width: 100px; flex-grow: 1;"
18981898
tabindex="0"
@@ -1903,7 +1903,7 @@ snapshots["vaadin-grid column groups with header"] =
19031903
<th
19041904
id="vaadin-grid-cell-2"
19051905
last-column=""
1906-
part="cell header-cell last-column-cell last-header-row-cell"
1906+
part="cell header-cell last-column-cell last-header-row-cell first-header-row-cell"
19071907
role="columnheader"
19081908
style="width: 100px; flex-grow: 1;"
19091909
tabindex="-1"
@@ -2016,14 +2016,14 @@ snapshots["vaadin-grid column groups with header"] =
20162016
<tr
20172017
aria-rowindex="4"
20182018
hidden=""
2019-
part="row footer-row first-footer-row"
2019+
part="row footer-row"
20202020
role="row"
20212021
tabindex="-1"
20222022
>
20232023
<td
20242024
first-column=""
20252025
id="vaadin-grid-cell-3"
2026-
part="cell footer-cell first-column-cell first-footer-row-cell"
2026+
part="cell footer-cell first-column-cell"
20272027
role="gridcell"
20282028
style="width: 100px; flex-grow: 1;"
20292029
tabindex="0"
@@ -2034,7 +2034,7 @@ snapshots["vaadin-grid column groups with header"] =
20342034
<td
20352035
id="vaadin-grid-cell-4"
20362036
last-column=""
2037-
part="cell footer-cell last-column-cell first-footer-row-cell"
2037+
part="cell footer-cell last-column-cell"
20382038
role="gridcell"
20392039
style="width: 100px; flex-grow: 1;"
20402040
tabindex="-1"
@@ -2046,15 +2046,15 @@ snapshots["vaadin-grid column groups with header"] =
20462046
<tr
20472047
aria-rowindex="5"
20482048
hidden=""
2049-
part="row footer-row last-footer-row"
2049+
part="row footer-row"
20502050
role="row"
20512051
tabindex="-1"
20522052
>
20532053
<td
20542054
first-column=""
20552055
id="vaadin-grid-cell-5"
20562056
last-column=""
2057-
part="cell footer-cell first-column-cell last-column-cell last-footer-row-cell"
2057+
part="cell footer-cell first-column-cell last-column-cell"
20582058
role="gridcell"
20592059
tabindex="-1"
20602060
>

0 commit comments

Comments
 (0)