You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by di...@apache.org on 2022/08/30 15:55:44 UTC

[superset] 01/01: Enhance dashboards list tests

This is an automated email from the ASF dual-hosted git repository.

diegopucci pushed a commit to branch chore/cypress-runtime-enhancements
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 9366d170daafd629025086e7f100de2013b32931
Author: geido <di...@gmail.com>
AuthorDate: Tue Aug 30 18:55:22 2022 +0300

    Enhance dashboards list tests
---
 .../integration/dashboard_list/card_view.test.ts   | 124 --------------
 .../integration/dashboard_list/list.test.ts        | 184 +++++++++++++++++++++
 .../integration/dashboard_list/list_view.test.ts   |  61 -------
 .../cypress-base/cypress/support/index.ts          |  34 ++++
 .../cypress-base/cypress/utils/urls.ts             |  20 +++
 5 files changed, 238 insertions(+), 185 deletions(-)

diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard_list/card_view.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard_list/card_view.test.ts
deleted file mode 100644
index 8bfc35d71c..0000000000
--- a/superset-frontend/cypress-base/cypress/integration/dashboard_list/card_view.test.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import { DASHBOARD_LIST } from './dashboard_list.helper';
-
-describe('Dashboard card view', () => {
-  beforeEach(() => {
-    cy.login();
-    cy.visit(DASHBOARD_LIST);
-    cy.get('[aria-label="card-view"]').click();
-  });
-
-  xit('should load cards', () => {
-    cy.get('[data-test="dashboard-list-view"]');
-    cy.get('[data-test="styled-card"]').should('be.visible');
-    cy.get('[data-test="styled-card"]').should('have.length', 4); // failed, xit-ed
-  });
-
-  it('should allow to favorite/unfavorite dashboard card', () => {
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-selected']")
-      .should('not.exist');
-    cy.get("[data-test='card-actions']")
-      .find("[aria-label='favorite-unselected']")
-      .first()
-      .click();
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-selected']")
-      .should('be.visible');
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-unselected']")
-      .should('not.exist');
-
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-unselected']")
-      .should('not.exist');
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-selected']")
-      .click();
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-unselected']")
-      .should('be.visible');
-    cy.get("[data-test='card-actions']")
-      .first()
-      .find("[aria-label='favorite-selected']")
-      .should('not.exist');
-  });
-
-  xit('should sort correctly', () => {
-    // sort alphabetical
-    cy.get('.Select__control').last().should('be.visible');
-    cy.get('.Select__control').last().click({ force: true });
-    cy.get('.Select__menu').contains('Alphabetical').click();
-    cy.get('[data-test="dashboard-list-view"]').should('be.visible');
-    // TODO this line was flaky
-    cy.get('[data-test="styled-card"]').first().contains('Tabbed Dashboard');
-    cy.get('[data-test="styled-card"]').last().contains("World Bank's Data");
-
-    // sort recently modified
-    cy.get('.Select__control').last().should('be.visible');
-    cy.get('.Select__control').last().click({ force: true });
-    cy.get('.Select__menu').contains('Recently Modified').click();
-    cy.get('[data-test="dashboard-list-view"]').should('be.visible');
-    cy.get('[data-test="styled-card"]').first().contains('Tabbed Dashboard');
-    cy.get('[data-test="styled-card"]').last().contains("World Bank's Data");
-  });
-
-  // real flaky
-  xit('should delete correctly', () => {
-    // show delete modal
-    cy.get('[data-test="more-horiz"]').last().trigger('mouseover');
-    cy.get('[data-test="dashboard-card-option-delete-button"]')
-      .last()
-      .should('be.visible')
-      .click();
-    cy.get('[data-test="modal-confirm-button"]').should(
-      'have.attr',
-      'disabled',
-    );
-    cy.get('[data-test="Please Confirm-modal"]').should('be.visible');
-    cy.get("[data-test='delete-modal-input']").type('DELETE');
-    cy.get('[data-test="modal-confirm-button"]').should(
-      'not.have.attr',
-      'disabled',
-    );
-    cy.get('[data-test="modal-cancel-button"]').click();
-  });
-
-  // real flaky
-  xit('should edit correctly', () => {
-    // show edit modal
-    cy.get('[data-test="more-horiz"]').last().trigger('mouseover');
-    cy.get('[data-test="dashboard-card-option-edit-button"]')
-      .last()
-      .should('be.visible')
-      .click();
-    cy.get('[data-test="dashboard-edit-properties-form"]').should('be.visible');
-    cy.get('[data-test="dashboard-title-input"]').should('not.have.value');
-    cy.get('[data-test="properties-modal-cancel-button"]')
-      .contains('Cancel')
-      .click();
-  });
-});
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard_list/list.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard_list/list.test.ts
new file mode 100644
index 0000000000..d8dc3285ec
--- /dev/null
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard_list/list.test.ts
@@ -0,0 +1,184 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { DASHBOARD_LIST } from 'cypress/utils/urls';
+
+function refresh() {
+  cy.loginGoTo(DASHBOARD_LIST);
+}
+
+function revertChanges() {
+  cy.deleteDashboardByName('0 - Sample dashboard');
+  cy.deleteDashboardByName('1 - Sample dashboard');
+  cy.deleteDashboardByName('0 - Sample dashboard | EDITED');
+}
+
+function ensureAuth() {
+  cy.login();
+}
+
+function toggleBulkSelect() {
+  cy.getBySel("bulk-select").click();
+}
+
+function setGridMode(type: 'card' | 'list') {
+  cy.get(`[aria-label="${type}-view"]`).click();
+}
+
+function orderAlphabetical() {
+  cy.get('[aria-label="Sort"]').first().click();
+  cy.get('[title="Alphabetical"]').click();
+}
+
+describe('Dashboards list', () => {
+  beforeEach(() => {
+    ensureAuth();
+    revertChanges();
+  });
+
+  describe('list mode', () => {
+    before(() => {
+      refresh()
+      setGridMode('list');
+    });
+
+    it('should load rows in list mode', () => {
+      cy.getBySel("listview-table").should('be.visible');
+      cy.getBySel("sort-header").eq(1).contains('Title');
+      cy.getBySel("sort-header").eq(2).contains('Modified by');
+      cy.getBySel("sort-header").eq(3).contains('Status');
+      cy.getBySel("sort-header").eq(4).contains('Modified');
+      cy.getBySel("sort-header").eq(5).contains('Created by');
+      cy.getBySel("sort-header").eq(6).contains('Owners');
+      cy.getBySel("sort-header").eq(7).contains('Actions');
+    });
+
+    it('should sort correctly in list mode', () => {
+      cy.getBySel("sort-header").eq(1).click();
+      cy.getBySel("table-row").first()
+        .contains("ECharts Dashboard");
+      cy.getBySel("sort-header").eq(1).click();
+      cy.getBySel("table-row").first()
+        .contains("World Bank's Data");
+      cy.getBySel("sort-header").eq(1).click();
+    });
+
+    it('should bulk select in list mode', () => {
+      toggleBulkSelect();
+      cy.get('#header-toggle-all').click();
+      cy.get('[aria-label="checkbox-on"]').should('have.length', 6);
+      cy.getBySel("bulk-select-copy").contains('5 Selected');
+      cy.getBySel("bulk-select-action").should('have.length', 2).then($btns => {
+        expect($btns).to.contain('Delete');
+        expect($btns).to.contain('Export');
+      });
+      cy.getBySel("bulk-select-deselect-all").click();
+      cy.get('[aria-label="checkbox-on"]').should('have.length', 0);
+      cy.getBySel("bulk-select-copy").contains('0 Selected');
+      cy.getBySel("bulk-select-action").should('not.exist');
+    });
+  });
+
+  describe('card mode', () => {
+    before(() => {
+      refresh();
+      setGridMode('card');
+    });
+
+    it('should load rows in card mode', () => {
+      cy.getBySel("listview-table").should('not.exist');
+      cy.getBySel("styled-card").should('have.length', 5);
+    });
+
+    it('should bulk select in card mode', () => {
+      toggleBulkSelect();
+      cy.getBySel("styled-card").click({multiple: true});
+      cy.getBySel("bulk-select-copy").contains('5 Selected');
+      cy.getBySel("bulk-select-action").should('have.length', 2).then($btns => {
+        expect($btns).to.contain('Delete');
+        expect($btns).to.contain('Export');
+      });
+      cy.getBySel("bulk-select-deselect-all").click();
+      cy.getBySel("bulk-select-copy").contains('0 Selected');
+      cy.getBySel("bulk-select-action").should('not.exist');
+    });
+
+    it('should sort in card mode', () => {
+      orderAlphabetical();
+      cy.getBySel("styled-card").first().contains('ECharts Dashboard');
+    });
+  });
+
+  describe('common actions', () => {
+    beforeEach(() => {
+      cy.createDashboard('0 - Sample dashboard');
+      cy.createDashboard('1 - Sample dashboard');
+      refresh();
+      setGridMode('card');
+      orderAlphabetical();
+    });
+
+    it('should allow to favorite/unfavorite dashboard', () => {
+      cy.intercept(`/superset/favstar/Dashboard/*/select/`).as('select');
+      cy.intercept(`/superset/favstar/Dashboard/*/unselect/`).as('unselect');
+
+      cy.getBySel('styled-card').first().contains('0 - Sample dashboard')
+      cy.getBySel('styled-card').first().find("[aria-label='favorite-unselected']")
+        .click();
+      cy.wait('@select');
+      cy.getBySel('styled-card').first().find("[aria-label='favorite-selected']")
+        .click();
+      cy.wait('@unselect');
+      cy.getBySel('styled-card')
+        .first()
+        .find("[aria-label='favorite-selected']")
+        .should('not.exist');
+    });
+
+    it('should bulk delete correctly', () => {
+      toggleBulkSelect();
+
+      cy.getBySel("styled-card").eq(0).contains('0 - Sample dashboard').click();
+      cy.getBySel("styled-card").eq(1).contains('1 - Sample dashboard').click();
+      cy.getBySel("bulk-select-action").eq(0).contains('Delete').click();
+      cy.getBySel('delete-modal-input').type('DELETE');
+      cy.getBySel('modal-confirm-button').click();
+      cy.getBySel("styled-card").eq(0).should('not.contain', '0 - Sample dashboard');
+      cy.getBySel("styled-card").eq(1).should('not.contain', '1 - Sample dashboard');
+
+    });
+
+   it('should delete correctly', () => {
+      cy.getBySel("styled-card").eq(0).contains('0 - Sample dashboard');
+      cy.get('[aria-label="more-vert"]').first().click();
+      cy.getBySel('dashboard-card-option-delete-button').click();
+      cy.getBySel('delete-modal-input').type('DELETE');
+      cy.getBySel('modal-confirm-button').click();
+      cy.getBySel("styled-card").eq(0).should('not.contain', '0 - Sample dashboard');
+    });
+
+    it('should edit correctly', () => {
+      cy.getBySel("styled-card").eq(0).contains('0 - Sample dashboard');
+      cy.get('[aria-label="more-vert"]').first().click();
+      cy.getBySel('dashboard-card-option-edit-button').click();
+      cy.getBySel('dashboard-title-input').type(' | EDITED');
+      cy.get('button:contains("Save")').click();
+      cy.getBySel("styled-card").eq(0).contains('0 - Sample dashboard | EDITED');
+    });
+  });
+});
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard_list/list_view.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard_list/list_view.test.ts
deleted file mode 100644
index a758552481..0000000000
--- a/superset-frontend/cypress-base/cypress/integration/dashboard_list/list_view.test.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import { DASHBOARD_LIST } from './dashboard_list.helper';
-
-describe('dashboard list view', () => {
-  beforeEach(() => {
-    cy.login();
-    cy.visit(DASHBOARD_LIST);
-    cy.get('[aria-label="list-view"]').click();
-  });
-
-  xit('should load rows', () => {
-    cy.get('[data-test="listview-table"]').should('be.visible');
-    // check dashboard list view header
-    cy.get('[data-test="sort-header"]').eq(1).contains('Title');
-    cy.get('[data-test="sort-header"]').eq(2).contains('Modified by');
-    cy.get('[data-test="sort-header"]').eq(3).contains('Status');
-    cy.get('[data-test="sort-header"]').eq(4).contains('Modified');
-    cy.get('[data-test="sort-header"]').eq(5).contains('Created by');
-    cy.get('[data-test="sort-header"]').eq(6).contains('Owners');
-    cy.get('[data-test="sort-header"]').eq(7).contains('Actions');
-    cy.get('[data-test="table-row"]').should('have.length', 4); // failed, xit-ed
-  });
-
-  xit('should sort correctly', () => {
-    cy.get('[data-test="sort-header"]').eq(1).click();
-    cy.get('[data-test="sort-header"]').eq(1).click();
-    cy.get('[data-test="table-row"]')
-      .first()
-      .find('[data-test="table-row-cell"]')
-      .find('[data-test="cell-text"]')
-      .contains("World Bank's Data");
-  });
-
-  it('should bulk delete correctly', () => {
-    cy.get('[data-test="listview-table"]').should('be.visible');
-    cy.get('[data-test="bulk-select"]').eq(0).click();
-    cy.get('[aria-label="checkbox-off"]').eq(1).siblings('input').click();
-    cy.get('[aria-label="checkbox-off"]').eq(2).siblings('input').click();
-    cy.get('[data-test="bulk-select-action"]').eq(0).click();
-    cy.get('[data-test="delete-modal-input"]').eq(0).type('DELETE');
-    cy.get('[data-test="modal-confirm-button"]').eq(0).click();
-    cy.get('[aria-label="checkbox-on"]').should('not.exist');
-  });
-});
diff --git a/superset-frontend/cypress-base/cypress/support/index.ts b/superset-frontend/cypress-base/cypress/support/index.ts
index 7ededd67a5..782490b250 100644
--- a/superset-frontend/cypress-base/cypress/support/index.ts
+++ b/superset-frontend/cypress-base/cypress/support/index.ts
@@ -24,6 +24,14 @@ const TokenName = Cypress.env('TOKEN_NAME');
 
 require('cy-verify-downloads').addCustomCommand();
 
+Cypress.Commands.add('getBySel', (selector, ...args) => {
+  return cy.get(`[data-test=${selector}]`, ...args)
+});
+
+Cypress.Commands.add('getBySelLike', (selector, ...args) => {
+  return cy.get(`[data-test*=${selector}]`, ...args)
+});
+
 /* eslint-disable consistent-return */
 Cypress.on('uncaught:exception', err => {
   // ignore ResizeObserver client errors, as they are unrelated to operation
@@ -45,6 +53,11 @@ Cypress.Commands.add('login', () => {
   });
 });
 
+Cypress.Commands.add('loginGoTo', url => {
+  cy.login();
+  cy.visit(url);
+});
+
 Cypress.Commands.add('visitChartByName', name => {
   cy.request(`/chart/api/read?_flt_3_slice_name=${name}`).then(response => {
     cy.visit(`${BASE_EXPLORE_URL}{"slice_id": ${response.body.pks[0]}}`);
@@ -141,6 +154,27 @@ Cypress.Commands.add(
   },
 );
 
+Cypress.Commands.add('createDashboard', (dashboardName: string) =>
+  cy
+  .request({
+    method: 'POST',
+    url: `/api/v1/dashboard/`,
+    body: {
+      dashboard_title: dashboardName,
+    },
+    headers: {
+      Cookie: `csrf_access_token=${window.localStorage.getItem(
+        'access_token',
+      )}`,
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${TokenName}`,
+      'X-CSRFToken': `${window.localStorage.getItem('access_token')}`,
+      Referer: `${Cypress.config().baseUrl}/`,
+    },
+  })
+  .then(resp => resp),
+);
+
 Cypress.Commands.add('deleteDashboardByName', (name: string) =>
   cy.getDashboards().then((dashboards: any) => {
     dashboards?.forEach((element: any) => {
diff --git a/superset-frontend/cypress-base/cypress/utils/urls.ts b/superset-frontend/cypress-base/cypress/utils/urls.ts
new file mode 100644
index 0000000000..227a627afb
--- /dev/null
+++ b/superset-frontend/cypress-base/cypress/utils/urls.ts
@@ -0,0 +1,20 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+ export const DASHBOARD_LIST = '/dashboard/list/';
\ No newline at end of file