diff --git a/packages/nc-gui/components/ProjectTreeView.vue b/packages/nc-gui/components/ProjectTreeView.vue index c0b74b81af..2959a0500a 100644 --- a/packages/nc-gui/components/ProjectTreeView.vue +++ b/packages/nc-gui/components/ProjectTreeView.vue @@ -226,7 +226,10 @@ @click.stop="addTab({ ...child }, false, true)" @contextmenu.prevent.stop="showCTXMenu($event, child, false, true)" > - + mdi-drag-vertical diff --git a/scripts/cypress/integration/common/1d_table_view_drag_drop_reorder.js b/scripts/cypress/integration/common/1d_table_view_drag_drop_reorder.js new file mode 100644 index 0000000000..abc50d61f0 --- /dev/null +++ b/scripts/cypress/integration/common/1d_table_view_drag_drop_reorder.js @@ -0,0 +1,92 @@ +import { isTestSuiteActive } from "../../support/page_objects/projectConstants"; + +export const genTest = (type, xcdb) => { + if (!isTestSuiteActive(type, xcdb)) return; + + describe(`${type.toUpperCase()} Table/view drag-drop reorder`, () => { + function validateTreeField(index, tblName) { + cy.get(`:nth-child(${index}) > .v-list-item__title > .caption`) + .contains(tblName) + .should("exist"); + } + + /* + Original order of list items + Actor, Address, Category, City, Country, Customer, FIlm, FilmText, Language, Payment, Rental Staff + ActorInfo, CustomerList, FilmList, NiceButSlowerFilmList, SalesByFilmCategory, SalesByStore, StaffList + */ + + it(`Table & View list, Drag/drop`, () => { + // expand tree-view menu + cy.get(".nc-project-tree") + .find(".v-list-item__title:contains(Tables)", { timeout: 10000 }) + .should("exist") + .first() + .click({ force: true }); + + validateTreeField(1, "Actor"); + + // move Actor field down, above Staff (drag, drop) + cy.get(".nc-child-draggable-icon-Actor").drag( + ".nc-child-draggable-icon-Staff" + ); + + validateTreeField(12, "Actor"); + + // move ActorInfo (View) field up to first place (drag, drop) + cy.get(".nc-child-draggable-icon-ActorInfo").drag( + ".nc-child-draggable-icon-Address" + ); + + validateTreeField(1, "ActorInfo"); + validateTreeField(2, "Address"); + validateTreeField(13, "Actor"); + + // restore ActorInfo field (drag, drop) + cy.get(".nc-child-draggable-icon-ActorInfo").drag( + ".nc-child-draggable-icon-Actor" + ); + + // restore Actor field (drag, drop) + cy.get(".nc-child-draggable-icon-Actor").drag( + ".nc-child-draggable-icon-Address" + ); + + validateTreeField(1, "Actor"); + validateTreeField(2, "Address"); + validateTreeField(12, "Staff"); + validateTreeField(13, "ActorInfo"); + validateTreeField(14, "CustomerList"); + + // undo project-tree expand operation + cy.get(".nc-project-tree") + .find(".v-list-item__title:contains(Tables)", { timeout: 10000 }) + .should("exist") + .first() + .click({ force: true }); + }); + }); +}; + +/** + * @copyright Copyright (c) 2021, Xgene Cloud Ltd + * + * @author Pranav C Balan + * @author Raju Udava + * + * @license GNU AGPL version 3 or any later version + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + * + */ diff --git a/scripts/cypress/integration/test/gqlTableOps.js b/scripts/cypress/integration/test/gqlTableOps.js index 98ab964907..8b7bd7c20f 100644 --- a/scripts/cypress/integration/test/gqlTableOps.js +++ b/scripts/cypress/integration/test/gqlTableOps.js @@ -2,6 +2,7 @@ let t0 = require("./explicitLogin"); let t01 = require("../common/00_pre_configurations"); let t1a = require("../common/1a_table_operations"); let t1c = require("../common/1c_sql_view"); +let t1d = require("../common/1d_table_view_drag_drop_reorder"); let t1b = require("../common/1b_table_column_operations"); let t2a = require("../common/2a_table_with_belongs_to_colulmn"); let t2b = require("../common/2b_table_with_m2m_column"); @@ -24,6 +25,7 @@ const nocoTestSuite = (type, xcdb) => { t1a.genTest(type, xcdb); t1b.genTest(type, xcdb); t1c.genTest(type, xcdb); + t1d.genTest(type, xcdb); t2a.genTest(type, xcdb); t2b.genTest(type, xcdb); t3a.genTest(type, xcdb); diff --git a/scripts/cypress/integration/test/restTableOps.js b/scripts/cypress/integration/test/restTableOps.js index d400433a3e..4eee66fade 100644 --- a/scripts/cypress/integration/test/restTableOps.js +++ b/scripts/cypress/integration/test/restTableOps.js @@ -3,6 +3,7 @@ let t01 = require("../common/00_pre_configurations"); let t1a = require("../common/1a_table_operations"); let t1b = require("../common/1b_table_column_operations"); let t1c = require("../common/1c_sql_view"); +let t1d = require("../common/1d_table_view_drag_drop_reorder"); let t2a = require("../common/2a_table_with_belongs_to_colulmn"); let t2b = require("../common/2b_table_with_m2m_column"); let t3a = require("../common/3a_filter_sort_fields_operations"); @@ -24,6 +25,7 @@ const nocoTestSuite = (type, xcdb) => { t1a.genTest(type, xcdb); t1b.genTest(type, xcdb); t1c.genTest(type, xcdb); + t1d.genTest(type, xcdb); t2a.genTest(type, xcdb); t2b.genTest(type, xcdb); t3a.genTest(type, xcdb);