Dashboard: Prevent non-repeating panels being dropped from repeated rows when collapsed/expanded (#50764)

* Mob: fix issue with repeating panels+rows, add e2e test

Co-authored-by: kay delaney <kay@grafana.com>
Co-authored-by: Joao Silva <joao.silva@grafana.com>
Co-authored-by: joshhunt <josh@trtr.co>
Co-authored-by: polibb <polina.boneva@grafana.com>

* Fix describe block description

Co-authored-by: kay delaney <kay@grafana.com>
Co-authored-by: Joao Silva <joao.silva@grafana.com>
Co-authored-by: joshhunt <josh@trtr.co>
Co-authored-by: polibb <polina.boneva@grafana.com>
This commit is contained in:
Ashley Harrison 2022-06-15 11:07:54 +01:00 committed by GitHub
parent 6a5419a9eb
commit 94d585063e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 45 additions and 4 deletions

View File

@ -44,7 +44,7 @@
"id": 2,
"panels": [],
"repeat": "row",
"title": "Row title $row",
"title": "Row $row",
"type": "row"
},
{
@ -119,7 +119,7 @@
"sort": "none"
}
},
"title": "Panel Title",
"title": "Row $row non-repeating panel",
"type": "timeseries"
},
{
@ -196,7 +196,7 @@
},
"repeat": "horizontal",
"repeatDirection": "h",
"title": "Horizontal repeating $horizontal",
"title": "Row $row repeating panel $horizontal",
"type": "timeseries"
}
],

View File

@ -0,0 +1,39 @@
import { e2e } from '@grafana/e2e';
const PAGE_UNDER_TEST = 'k3PEoCpnk/repeating-a-row-with-a-non-repeating-panel-and-horizontal-repeating-panel';
describe('Repeating a row with repeated panels and a non-repeating panel', () => {
beforeEach(() => {
e2e.flows.login('admin', 'admin');
});
it('should be able to collapse and expand a repeated row without losing panels', () => {
e2e.flows.openDashboard({ uid: PAGE_UNDER_TEST });
const panelsToCheck = [
'Row 2 non-repeating panel',
'Row 2 repeating panel 1',
'Row 2 repeating panel 2',
'Row 2 repeating panel 3',
];
// Collapse Row 1 first so the Row 2 panels all fit on the screen
e2e.components.DashboardRow.title('Row 1').click();
// Rows are expanded by default, so check that all panels are visible
panelsToCheck.forEach((title) => {
e2e.components.Panels.Panel.title(title).should('be.visible');
});
// Collapse the row and check panels are no longer visible
e2e.components.DashboardRow.title('Row 2').click();
panelsToCheck.forEach((title) => {
e2e.components.Panels.Panel.title(title).should('not.exist');
});
// Expand the row and check all panels are visible again
e2e.components.DashboardRow.title('Row 2').click();
panelsToCheck.forEach((title) => {
e2e.components.Panels.Panel.title(title).should('be.visible');
});
});
});

View File

@ -546,7 +546,9 @@ export class DashboardModel implements TimeModel {
}
cleanUpRowRepeats(rowPanels: PanelModel[]) {
const panelsToRemove = rowPanels.filter((p) => !p.repeat && p.repeatPanelId);
const panelIds = rowPanels.map((row) => row.id);
// Remove repeated panels whose parent is in this row as these will be recreated later in processRowRepeats
const panelsToRemove = rowPanels.filter((p) => !p.repeat && p.repeatPanelId && panelIds.includes(p.repeatPanelId));
pull(rowPanels, ...panelsToRemove);
pull(this.panels, ...panelsToRemove);