diff --git a/packages/nc-gui/components/smartsheet/expanded-form/Header.vue b/packages/nc-gui/components/smartsheet/expanded-form/Header.vue index acd49bb6fe..86604edfaa 100644 --- a/packages/nc-gui/components/smartsheet/expanded-form/Header.vue +++ b/packages/nc-gui/components/smartsheet/expanded-form/Header.vue @@ -54,7 +54,7 @@ const copyRecordUrl = () => { - + @@ -97,7 +97,7 @@ const copyRecordUrl = () => { /> - + {{ $t('general.cancel') }} diff --git a/packages/nocodb-sdk/package-lock.json b/packages/nocodb-sdk/package-lock.json index b075fa7af6..6d5f785843 100644 --- a/packages/nocodb-sdk/package-lock.json +++ b/packages/nocodb-sdk/package-lock.json @@ -15806,4 +15806,4 @@ "dev": true } } -} \ No newline at end of file +} diff --git a/scripts/cypress/integration/common/4g_table_view_expanded_form.js b/scripts/cypress/integration/common/4g_table_view_expanded_form.js new file mode 100644 index 0000000000..f09d0a17b9 --- /dev/null +++ b/scripts/cypress/integration/common/4g_table_view_expanded_form.js @@ -0,0 +1,105 @@ +import { isTestSuiteActive } from '../../support/page_objects/projectConstants'; + +function capitalizeFirstLetter(string) { + return string.charAt(0).toUpperCase() + string.slice(1); +} + +export const genTest = (apiType, dbType) => { + if (!isTestSuiteActive(apiType, dbType)) return; + + describe(`${apiType.toUpperCase()} api - Table views: Expanded form`, () => { + + before(() => { + cy.restoreLocalStorage(); + + // open a table to work on views + // + cy.openTableTab('Country', 25); + }); + + beforeEach(() => { + cy.restoreLocalStorage(); + }); + + afterEach(() => { + cy.saveLocalStorage(); + }); + + after(() => { + cy.restoreLocalStorage(); + cy.closeTableTab('Country'); + cy.saveLocalStorage(); + }); + + // Common routine to create/edit/delete GRID & GALLERY view + // Input: viewType - 'grid'/'gallery' + // + const viewTest = (viewType) => { + it(`Create ${viewType} view`, () => { + // click on 'Grid/Gallery' button on Views bar + cy.get(`.nc-create-${viewType}-view`).click(); + + // Pop up window, click Submit (accepting default name for view) + cy.getActiveModal('.nc-modal-view-create').find('.ant-btn-primary').click(); + cy.toastWait('View created successfully'); + + // validate if view was created && contains default name 'Country1' + cy.get(`.nc-${viewType}-view-item`) + .contains(`${capitalizeFirstLetter(viewType)}-1`) + .should('exist'); + }); + + + it(`Expand a row in ${viewType} and verify url`, () => { + + if (viewType === 'grid') { + cy.get('.nc-row-expand') + .first() + .click({ force: true }); + } else if (viewType === 'gallery') { + cy.get('.nc-gallery-container .ant-card') + .first() + .click({ force: true }); + } + cy.url().should('include', 'rowId=1'); + + // copy url + cy.get('.nc-copy-row-url').click(); + + cy.window().then((win) => { + win.navigator.clipboard.readText().then((text) => { + expect(text).to.contains('?rowId=1'); + }); + }); + + cy.get('.nc-expand-form-close-btn').click(); + + }); + + it(`Visit a ${viewType} row url and verify expanded form`, () => { + cy.url() + .then((url) => { + cy.restoreLocalStorage(); + cy.visit('/' + url.split('/').slice(3).join('/').split('?')[0] + '?rowId=2'); + cy.get('.nc-expanded-form-header').should('exist'); + cy.saveLocalStorage(); + }); + }); + + it(`Visit an invalid ${viewType} row url and verify expanded form`, () => { + cy.url() + .then((url) => { + cy.restoreLocalStorage(); + cy.visit('/' + url.split('/').slice(3).join('/').split('?')[0] + '?rowId=99999999'); + cy.get('.nc-expanded-form-header').should('not.exist'); + cy.saveLocalStorage(); + }); + }); + + + }; + + viewTest('grid'); // grid view + viewTest('gallery'); // gallery view + }); +}; diff --git a/scripts/cypress/integration/test/pg-restViews.js b/scripts/cypress/integration/test/pg-restViews.js index 83c25820ca..0d3b1da94c 100644 --- a/scripts/cypress/integration/test/pg-restViews.js +++ b/scripts/cypress/integration/test/pg-restViews.js @@ -6,6 +6,7 @@ let t4c = require("../common/4c_form_view_detailed"); let t4d = require("../common/4d_table_view_grid_locked"); let t4e = require("../common/4e_form_view_share"); let t4f = require("../common/4f_pg_grid_view_share"); +let t4g = require("../common/4g_table_view_expanded_form"); const { setCurrentMode, } = require("../../support/page_objects/projectConstants"); @@ -20,6 +21,7 @@ const nocoTestSuite = (apiType, dbType) => { t4b.genTest(apiType, dbType); t4d.genTest(apiType, dbType); t4e.genTest(apiType, dbType); + t4g.genTest(apiType, dbType); // tbd t4f.genTest(apiType, dbType); }; diff --git a/scripts/cypress/integration/test/restViews.js b/scripts/cypress/integration/test/restViews.js index a96ea487a1..5f4488e7f6 100644 --- a/scripts/cypress/integration/test/restViews.js +++ b/scripts/cypress/integration/test/restViews.js @@ -6,6 +6,7 @@ let t4c = require("../common/4c_form_view_detailed"); let t4d = require("../common/4d_table_view_grid_locked"); let t4e = require("../common/4e_form_view_share"); let t4f = require("../common/4f_grid_view_share"); +let t4g = require("../common/4g_table_view_expanded_form"); const { setCurrentMode, } = require("../../support/page_objects/projectConstants"); @@ -21,6 +22,7 @@ const nocoTestSuite = (apiType, dbType) => { t4d.genTest(apiType, dbType); t4e.genTest(apiType, dbType); t4f.genTest(apiType, dbType); + t4g.genTest(apiType, dbType); }; nocoTestSuite("rest", "mysql");