diff --git a/cypress/fixtures/flows/dashboard-tables.json b/cypress/fixtures/flows/dashboard-tables.json index 8e4ea40d9..3996557ac 100644 --- a/cypress/fixtures/flows/dashboard-tables.json +++ b/cypress/fixtures/flows/dashboard-tables.json @@ -41,6 +41,30 @@ ] ] }, + { + "id": "dashboard-ui-table-fixed-height", + "type": "ui-table", + "z": "node-red-tab-tables", + "group": "dashboard-ui-group", + "name": "Fixed Height", + "label": "fixed height", + "action": "replace", + "order": 7, + "width": 6, + "height": 8, + "maxrows": 0, + "passthru": false, + "autocols": true, + "selectionType": "none", + "columns": [], + "x": 320, + "y": 320, + "wires": [ + [ + "test-helper" + ] + ] + }, { "id": "1ad285ca06fd711f", "type": "inject", @@ -67,7 +91,8 @@ "dashboard-ui-table-single-row-click", "dashboard-ui-table-multi-select", "dashboard-ui-table-table-buttons-string-value", - "dashboard-ui-table-buttons-text-from-payload" + "dashboard-ui-table-buttons-text-from-payload", + "dashboard-ui-table-fixed-height" ] ] }, diff --git a/cypress/tests/widgets/table.spec.js b/cypress/tests/widgets/table.spec.js index 622009a63..8996c4f19 100644 --- a/cypress/tests/widgets/table.spec.js +++ b/cypress/tests/widgets/table.spec.js @@ -10,6 +10,16 @@ describe('Node-RED Dashboard 2.0 - Tables', () => { cy.get('#nrdb-ui-widget-dashboard-ui-table-default').find('.v-data-table-footer').should('not.exist') }) + it('renders the provided data when a fixed widget size (not auto) is configured', () => { + // with a fixed size the table was clamped to a single grid row, hiding all but the first row + const widget = '#nrdb-ui-widget-dashboard-ui-table-fixed-height' + cy.get(widget).find('tbody tr').should('have.length', 5) + // a row beyond the first should be visible - i.e. not clipped into a single-row-high table + cy.get(widget).find('tbody tr').eq(3).should('be.visible') + // the table should fill the widget's fixed height rather than collapse to a single row + cy.get(widget).find('.nrdb-table').invoke('outerHeight').should('be.greaterThan', 150) + }) + it('render the provided data, with a pagination limit if defined', () => { cy.get('#nrdb-ui-widget-dashboard-ui-table-max-rows').find('tbody tr').should('have.length', 2) cy.get('#nrdb-ui-widget-dashboard-ui-table-max-rows').find('tbody .v-selection-control').should('have.length', 0) diff --git a/ui/src/widgets/ui-table/UITable.vue b/ui/src/widgets/ui-table/UITable.vue index ce43bac57..52231ed03 100644 --- a/ui/src/widgets/ui-table/UITable.vue +++ b/ui/src/widgets/ui-table/UITable.vue @@ -1,46 +1,48 @@ - {{ props.label }} - - - - - - - - - - - {{ col.title }} - - - - - - - - + + {{ props.label }} + + + + + + + + + + + {{ col.title }} + + + + + + + + +