test(cypress): Add test for filter, sort, fields, column, row creation

Signed-off-by: Pranav C <pranavxc@gmail.com>

cypress/integration/graphql/project_operations_spec.js

@@ -16,11 +16,14 @@ describe('GraphQL Project operations', () => {
     cy.contains('Ok & Save Project', {timeout: 3000}).click()
     cy.url({timeout: 12000}).should('contain', '#/nc/')
   });
+
   it('Stop Project', () => {
+    cy.wait(100000)
     // cy.get('.nc-graphql-project-row .mdi-stop-circle-outline', {timeout: 10000}).last().trigger('onmouseover').trigger('mouseenter')
     cy.get('.nc-graphql-project-row .mdi-stop-circle-outline', {timeout: 10000}).last().invoke('show').click();
     cy.contains('Submit').closest('button').click();
   });
+
   it('Start Project', () => {
     cy.get('.nc-graphql-project-row .mdi-play-circle-outline', {timeout: 10000}).last().invoke('show').click();
     cy.contains('Submit').closest('button').click();

cypress/integration/rest/api_operations_spec.js

@@ -6,13 +6,69 @@ describe('Rest api - CRUD/Filter', () => {
 
     // open country table
     cy.openTableTab('Country');
+    // cy.intercept({
+    //   method: "GET",
+    //   url: "/nc/**/api/v1/Country**",
+    //   hostname: 'localhost',
+    //   port: 8080
+    // }).as("dataGetFirst");
+    // cy.wait("@dataGetFirst");
+    // todo: wait until api call completes
+    cy.wait(2000)
 
   })
 
-  // create a new random table
+  // check pagination
   it('Check country table - ', () => {
-    cy.get('.nc-pagination').should('exist')
+    cy.get('.nc-pagination').should('exist');
+    cy.get('.nc-pagination .v-pagination > li:last-child').click()
+    cy.get('.nc-pagination .v-pagination > li:contains(2)').should('have.class', 'v-pagination__item--active')
   });
 
+  // create new row
+  it('Create new row', () => {
+    cy.get('.nc-add-new-row-btn').click();
+
+    cy.get('#data-table-form-Country > input').first().type('Test Country');
+
+    cy.contains('Save Row').filter('button').click()
+
+    // todo: verify
+  })
+
+  // Test sort
+  it('Add sort option', () => {
+    cy.get('.nc-sort-menu-btn').click()
+    cy.contains('Add Sort Option').click();
+    cy.get('.nc-sort-field-select div').first().click()
+    cy.get('.menuable__content__active .v-list-item:contains(Country)').click()
+    cy.get('.nc-sort-dir-select div').first().click()
+    cy.get('.menuable__content__active .v-list-item:contains("Z -> A")').click()
+    cy.contains('Zambia').should('exist')
+  })
+
+
+  // Test fields
+  it('Add fields options', () => {
+    cy.get('.nc-fields-menu-btn').click()
+    cy.get('.menuable__content__active .v-list-item label:contains(LastUpdate)').click()
+    cy.get('th:contains(LastUpdate)').should('not.exist')
+  })
+
+
+  // Test filter
+  it('Add filter options', () => {
+    cy.get('.nc-filter-menu-btn').click()
+    cy.contains('Add Filter').click();
+
+    cy.get('.nc-filter-field-select').last().click();
+    cy.get('.menuable__content__active .v-list-item:contains(Country)').click()
+    cy.get('.nc-filter-operation-select').last().click();
+    cy.get('.menuable__content__active .v-list-item:contains("is equal")').click()
+    cy.get('.nc-filter-value-select input:text').last().type('India');
+
+    cy.get('td:contains(India)').should('exist')
+
+  })
 
 })

cypress/integration/rest/table_operations_spec.js

@@ -115,4 +115,6 @@ describe('Rest api - Table', () => {
   });
 
 
+
+
 })

docker-compose-cypress.yml

@@ -12,6 +12,8 @@ services:
   xc-cypress-nocodb:
     network_mode: host
     image: node:14-alpine
+    environment:
+      - EE=true
     volumes:
       - ./packages/nocodb:/home/app
     command:
@@ -28,6 +30,7 @@ services:
     environment:
       - HOST=0.0.0.0
       - PORT=3000
+      - EE=true
     volumes:
       - ./packages/nc-gui:/home/app
       - ./packages/nc-lib-gui:/home/nc-lib-gui

packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue

@@ -26,7 +26,7 @@
           v-else
           :key="i + '_4'"
           v-model="filter.logicOp"
-          class="flex-shrink-1 flex-grow-0 elevation-0 caption"
+          class="flex-shrink-1 flex-grow-0 elevation-0 caption "
           :items="['and' ,'or']"
           solo
           flat
@@ -43,7 +43,7 @@
           v-if="filter.readOnly"
           :key="i + '_5'"
           v-model="filter.field"
-          class="caption"
+          class="caption "
           placeholder="Field"
           solo
           flat
@@ -60,7 +60,7 @@
           v-else
           :key="i + '_6'"
           v-model="filter.field"
-          class="caption"
+          class="caption nc-filter-field-select"
           :items="fieldList"
           placeholder="Field"
           solo
@@ -77,7 +77,7 @@
         <v-select
           :key="'k' + i"
           v-model="filter.op"
-          class="flex-shrink-1 flex-grow-0 caption"
+          class="flex-shrink-1 flex-grow-0 caption  nc-filter-operation-select"
           :items="opList"
           placeholder="Operation"
           solo
@@ -101,7 +101,7 @@
           flat
           hide-details
           dense
-          class="caption"
+          class="caption nc-filter-value-select"
           :disabled="filter.readOnly"
           @click.stop
         />

packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue

@@ -8,6 +8,7 @@
         overlap
       >
         <v-btn
+          class="nc-filter-menu-btn"
           :disabled="isLocked"
           outlined
           small

packages/nc-gui/components/project/spreadsheet/components/fieldsMenu.vue

@@ -8,6 +8,7 @@
         overlap
       >
         <v-btn
+          class="nc-fields-menu-btn"
           :disabled="isLocked"
           outlined
           small

packages/nc-gui/components/project/spreadsheet/components/pagination.vue

@@ -5,7 +5,8 @@
     style="max-width: 100%"
     :length="Math.ceil(count / size)"
     :total-visible="8"
-    color="primary lighten-2 nc-pagination"
+    color="primary lighten-2"
+    class="nc-pagination"
     @input="$emit('input',page)"
   />
   <div v-else class="mx-auto d-flex align-center mt-n1 " style="max-width:250px">

packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue

@@ -8,6 +8,7 @@
         overlap
       >
         <v-btn
+          class="nc-sort-menu-btn"
           :disabled="isLocked"
           small
           text
@@ -35,7 +36,7 @@
           <v-select
             :key="i + 'sel1'"
             v-model="sort.field"
-            class="caption"
+            class="caption nc-sort-field-select"
             :items="fieldList"
             label="Field"
             solo
@@ -51,7 +52,7 @@
           <v-select
             :key="i + 'sel2'"
             v-model="sort.order"
-            class="flex-shrink-1 flex-grow-0 caption"
+            class="flex-shrink-1 flex-grow-0 caption nc-sort-dir-select"
             :items="[{text : 'A -> Z', value: ''},{text : 'Z -> A', value: '-'}]"
             label="Operation"
             solo

packages/nc-gui/components/project/spreadsheet/rowsXcDataTable.vue

@@ -84,6 +84,7 @@
         outlined
         small
         text
+        btn.class="nc-add-new-row-btn"
         @click="insertNewRow(true,true)"
       >
         <v-icon small class="mr-1" color="grey  darken-3">

packages/nocodb/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "nocodb",
-  "version": "0.11.25",
+  "version": "0.11.26",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {