test(zoom-handling): adjust tests for changes in zoom behaviour

xyflow · Oct 6, 2020 · 9e2ecf3 · 9e2ecf3
1 parent 0373b53
commit 9e2ecf3
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 9 deletions.
diff --git a/cypress/integration/flow/basic.spec.js b/cypress/integration/flow/basic.spec.js
@@ -119,7 +119,7 @@ describe('Basic Flow Rendering', () => {
     // for d3 we have to pass the window to the event
     // https://github.com/cypress-io/cypress/issues/3441
     cy.window().then((win) => {
-      cy.get('.react-flow__zoompane')
+      cy.get('.react-flow__renderer')
         .trigger('mousedown', 'topLeft', { which: 1, view: win })
         .trigger('mousemove', 'bottomLeft')
         .trigger('mouseup', { force: true, view: win })
@@ -133,7 +133,7 @@ describe('Basic Flow Rendering', () => {
   it('zooms the pane', () => {
     const styleBeforeZoom = Cypress.$('.react-flow__nodes').css('transform');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .trigger('wheel', 'topLeft', { deltaY: -200 })
       .then(() => {
         const styleAfterZoom = Cypress.$('.react-flow__nodes').css('transform');

diff --git a/cypress/integration/flow/controls.spec.js b/cypress/integration/flow/controls.spec.js
@@ -36,7 +36,7 @@ describe('Controls Testing', () => {
     // for d3 we have to pass the window to the event
     // https://github.com/cypress-io/cypress/issues/3441
     cy.window().then((win) => {
-      cy.get('.react-flow__zoompane')
+      cy.get('.react-flow__renderer')
         .trigger('mousedown', 'topLeft', { which: 1, view: win })
         .trigger('mousemove', 'bottomLeft')
         .trigger('mouseup', { force: true, view: win })

diff --git a/cypress/integration/flow/empty.spec.js b/cypress/integration/flow/empty.spec.js
@@ -16,6 +16,8 @@ describe('Empty Flow Rendering', () => {
       .trigger('mousedown', 'topLeft', { which: 1, force: true })
       .trigger('mousemove', 'bottomLeft', { which: 1 })
       .trigger('mouseup', 'bottomLeft', { force: true });
+
+    cy.get('body').type('{shift}', { release: true });
   });
 
   it('renders an empty mini map', () => {

diff --git a/cypress/integration/flow/interaction.spec.js b/cypress/integration/flow/interaction.spec.js
@@ -52,7 +52,7 @@ describe('Interaction Flow Rendering', () => {
   it('tries to zoom by scroll', () => {
     const styleBeforeZoom = Cypress.$('.react-flow__nodes').css('transform');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .dblclick()
       .then(() => {
         const styleAfterZoom = Cypress.$('.react-flow__nodes').css('transform');
@@ -63,7 +63,7 @@ describe('Interaction Flow Rendering', () => {
   it('tries to zoom by double click', () => {
     const styleBeforeZoom = Cypress.$('.react-flow__nodes').css('transform');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .trigger('wheel', 'topLeft', { deltaY: -200 })
       .then(() => {
         const styleAfterZoom = Cypress.$('.react-flow__nodes').css('transform');
@@ -122,7 +122,7 @@ describe('Interaction Flow Rendering', () => {
   it('zooms by scroll', () => {
     const styleBeforeZoom = Cypress.$('.react-flow__nodes').css('transform');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .trigger('wheel', 'topLeft', { deltaY: 200 })
       .then(() => {
         const styleAfterZoom = Cypress.$('.react-flow__nodes').css('transform');
@@ -137,7 +137,7 @@ describe('Interaction Flow Rendering', () => {
   it('zooms by double click', () => {
     const styleBeforeZoom = Cypress.$('.react-flow__nodes').css('transform');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .dblclick()
       .then(() => {
         const styleAfterZoom = Cypress.$('.react-flow__nodes').css('transform');

diff --git a/cypress/integration/flow/minimap.spec.js b/cypress/integration/flow/minimap.spec.js
@@ -19,7 +19,7 @@ describe('Minimap Testing', () => {
     const viewBoxBeforeZoom = Cypress.$('.react-flow__minimap').attr('viewBox');
     const maskPathBeforeZoom = Cypress.$('.react-flow__minimap-mask').attr('d');
 
-    cy.get('.react-flow__zoompane')
+    cy.get('.react-flow__renderer')
       .trigger('wheel', 'topLeft', { deltaY: -200 })
       .then(() => {
         const viewBoxAfterZoom = Cypress.$('.react-flow__minimap').attr('viewBox');
@@ -53,7 +53,7 @@ describe('Minimap Testing', () => {
     // for d3 we have to pass the window to the event
     // https://github.com/cypress-io/cypress/issues/3441
     cy.window().then((win) => {
-      cy.get('.react-flow__zoompane')
+      cy.get('.react-flow__renderer')
         .trigger('mousedown', 'topLeft', { which: 1, view: win })
         .trigger('mousemove', 'bottomLeft')
         .trigger('mouseup', { force: true, view: win })