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/09/05 15:06:30 UTC

[superset] 04/08: Move markdown in editmode

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 4559fe6337423ebc876de9b11751ccf823049ffb
Author: geido <di...@gmail.com>
AuthorDate: Mon Sep 5 16:48:30 2022 +0300

    Move markdown in editmode
---
 .../integration/dashboard/dashboard.helper.ts      | 13 ----
 .../cypress/integration/dashboard/editmode.test.ts | 52 ++++++++++++----
 .../cypress/integration/dashboard/markdown.test.ts | 72 ----------------------
 .../cypress-base/cypress/utils/index.ts            | 11 ++++
 4 files changed, 51 insertions(+), 97 deletions(-)

diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts
index e4395ee4cf..b693097d0f 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/dashboard.helper.ts
@@ -58,19 +58,6 @@ export const testItems = {
 export const CHECK_DASHBOARD_FAVORITE_ENDPOINT =
   '/superset/favstar/Dashboard/*/count';
 
-
-
-export function resize(selector: string) {
-  return {
-    to(cordX: number, cordY: number) {
-      cy.get(selector)
-        .trigger('mousedown', { which: 1, force: true })
-        .trigger('mousemove', { which: 1, cordX, cordY, force: true })
-        .trigger('mouseup', { which: 1, force: true });
-    },
-  };
-}
-
 export function cleanUp() {
   cy.deleteDashboardByName(testItems.dashboard);
   cy.deleteDashboardByName(testItems.defaultNameDashboard);
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
index 1fd94413c6..43dd4a4ecc 100644
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
+++ b/superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts
@@ -17,7 +17,7 @@
  * under the License.
  */
 import { SAMPLE_DASHBOARD_1 } from 'cypress/utils/urls';
-import { drag } from 'cypress/utils';
+import { drag, resize } from 'cypress/utils';
 import {
   interceptGet,
   interceptUpdate,
@@ -46,15 +46,15 @@ function openProperties() {
 }
 
 function openAdvancedProperties() {
-  return cy
+  cy
     .get('.ant-modal-body')
     .contains('Advanced')
     .should('be.visible')
     .click({ force: true });
 }
 
-function dragChart(chart = 'Unicode Cloud') {
-  drag('[data-test="card-title"]', chart).to(
+function dragComponent(component = 'Unicode Cloud', target='card-title') {
+  drag(`[data-test="${target}"]`, component).to(
     '[data-test="grid-content"] [data-test="dragdroppable-object"]',
   );
 }
@@ -103,8 +103,7 @@ function assertMetadata(text: string) {
     });
 }
 function clearAll(input: string) {
-  cy.get(input).type('{selectall}{backspace}');
-  return cy.wait(500);
+  return cy.get(input).type('{selectall}{backspace}');
 }
 
 describe('Dashboard edit', () => {
@@ -140,7 +139,7 @@ describe('Dashboard edit', () => {
     });
 
     it('should disable the Save button when undoing', () => {
-      dragChart();
+      dragComponent();
       cy.getBySel('header-save-button').should('be.enabled');
       discardChanges();
       cy.getBySel('header-save-button').should('be.disabled');
@@ -158,16 +157,45 @@ describe('Dashboard edit', () => {
     });
 
     it('should add charts', () => {
-      dragChart();
+      dragComponent();
       cy.getBySel('dashboard-component-chart-holder').should('have.length', 1);
     });
 
     it('should remove added charts', () => {
-      dragChart('% Rural');
+      dragComponent('% Rural');
       cy.getBySel('dashboard-component-chart-holder').should('have.length', 1);
       cy.getBySel('dashboard-delete-component-button').click();
       cy.getBySel('dashboard-component-chart-holder').should('have.length', 0);
     });
+
+    it('should add markdown component to dashboard', () => {
+      cy.getBySel('dashboard-builder-component-pane-tabs-navigation')
+        .find('#tabs-tab-2')
+        .click();
+
+      // add new markdown component
+      dragComponent('Markdown', 'new-component');
+
+      cy.get('[data-test="dashboard-markdown-editor"]')
+        .should(
+          'have.text',
+          '✨Markdown✨Markdown✨MarkdownClick here to edit markdown',
+        )
+        .click();
+
+      cy.getBySel('dashboard-component-chart-holder')
+        .contains('Click here to edit [markdown](https://bit.ly/1dQOfRK)');
+
+      cy.getBySel('dashboard-markdown-editor')
+        .click()
+        .type('Test resize');
+
+      resize(
+        '[data-test="dashboard-markdown-editor"] .resizable-container span div:last-child',
+      ).to(500, 600);
+
+      cy.getBySel('dashboard-markdown-editor').contains('Test resize');
+    });
   });
 
   describe('Edit properties', () => {
@@ -232,7 +260,7 @@ describe('Dashboard edit', () => {
     });
 
     it('should apply a valid color scheme', () => {
-      dragChart('Top 10 California Names Timeseries');
+      dragComponent('Top 10 California Names Timeseries');
       openProperties();
       selectColorScheme('lyftColors');
       applyChanges();
@@ -243,7 +271,7 @@ describe('Dashboard edit', () => {
     });
 
     it('label colors should take the precedence', () => {
-      dragChart('Top 10 California Names Timeseries');
+      dragComponent('Top 10 California Names Timeseries');
       openProperties();
       openAdvancedProperties();
       clearAll('#json_metadata').then(() => {
@@ -264,7 +292,7 @@ describe('Dashboard edit', () => {
     });
 
     it('should save', () => {
-      dragChart();
+      dragComponent();
       cy.getBySel('header-save-button').should('be.enabled');
       saveChanges();
       cy.getBySel('dashboard-component-chart-holder').should('have.length', 1);
diff --git a/superset-frontend/cypress-base/cypress/integration/dashboard/markdown.test.ts b/superset-frontend/cypress-base/cypress/integration/dashboard/markdown.test.ts
deleted file mode 100644
index 5d7d818508..0000000000
--- a/superset-frontend/cypress-base/cypress/integration/dashboard/markdown.test.ts
+++ /dev/null
@@ -1,72 +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 { TABBED_DASHBOARD, resize } from './dashboard.helper';
-import { drag } from 'cypress/utils';
-describe('Dashboard edit markdown', () => {
-  beforeEach(() => {
-    cy.login();
-    cy.visit(TABBED_DASHBOARD);
-  });
-
-  it('should add markdown component to dashboard', () => {
-    cy.get('.header-with-actions')
-      .find('[aria-label="Edit dashboard"]')
-      .click();
-
-    cy.get('[data-test="dashboard-builder-component-pane-tabs-navigation"]')
-      .find('.ant-tabs-tab')
-      .last()
-      .click();
-
-    // lazy load - need to open dropdown for the scripts to load
-    cy.get('.header-with-actions').find('[aria-label="more-horiz"]').click();
-    cy.get('[data-test="grid-row-background--transparent"]')
-      .first()
-      .as('component-background-first');
-    // add new markdown component
-    drag('[data-test="new-component"]', 'Markdown').to(
-      '@component-background-first',
-    );
-    cy.get('[data-test="dashboard-markdown-editor"]')
-      .should(
-        'have.text',
-        '✨Markdown✨Markdown✨MarkdownClick here to edit markdown',
-      )
-      .click();
-
-    cy.get('[data-test="dashboard-component-chart-holder"]')
-      .find('.ace_content')
-      .contains('Click here to edit [markdown](https://bit.ly/1dQOfRK)');
-
-    cy.get('[data-test="dashboard-markdown-editor"]')
-      .click()
-      .type('Test resize');
-
-    resize(
-      '[data-test="dashboard-markdown-editor"] .resizable-container span div:last-child',
-    ).to(500, 600);
-
-    cy.get('[data-test="dashboard-markdown-editor"]').contains('Test resize');
-
-    cy.get('[data-test="nav-list"]:first').click('right', { force: true });
-    cy.get('[data-test="dashboard-component-chart-holder"]')
-      .find('.ace_content')
-      .should('not.exist');
-  });
-});
diff --git a/superset-frontend/cypress-base/cypress/utils/index.ts b/superset-frontend/cypress-base/cypress/utils/index.ts
index 949817c84a..2b2b482803 100644
--- a/superset-frontend/cypress-base/cypress/utils/index.ts
+++ b/superset-frontend/cypress-base/cypress/utils/index.ts
@@ -108,4 +108,15 @@ export function waitForChartLoad(chart: ChartSpec) {
           .trigger('mouseup', { which: 1, force: true });
       },
     };
+  }
+
+  export function resize(selector: string) {
+    return {
+      to(cordX: number, cordY: number) {
+        cy.get(selector)
+          .trigger('mousedown', { which: 1, force: true })
+          .trigger('mousemove', { which: 1, cordX, cordY, force: true })
+          .trigger('mouseup', { which: 1, force: true });
+      },
+    };
   }
\ No newline at end of file