From 47e80f70a6abca8326a9de80480d34b72e0bb287 Mon Sep 17 00:00:00 2001 From: Mutasem Aldmour Date: Thu, 14 Nov 2024 13:45:20 +0100 Subject: [PATCH] fix flaky tests --- cypress/e2e/24-ndv-paired-item.cy.ts | 70 +++++++++++-------- cypress/pages/ndv.ts | 6 ++ cypress/support/commands.ts | 10 +++ cypress/support/index.ts | 8 ++- .../src/components/PanelDragButton.vue | 2 +- 5 files changed, 65 insertions(+), 31 deletions(-) diff --git a/cypress/e2e/24-ndv-paired-item.cy.ts b/cypress/e2e/24-ndv-paired-item.cy.ts index 1261a0fcd1..ef6a68e2d1 100644 --- a/cypress/e2e/24-ndv-paired-item.cy.ts +++ b/cypress/e2e/24-ndv-paired-item.cy.ts @@ -31,29 +31,31 @@ describe('NDV', () => { ndv.getters.inputTableRow(1).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.inputTableRow(1).realHover(); + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTableRow(1).realMouseMove(10, 10); ndv.getters.outputTableRow(4).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.inputTableRow(2).realHover(); + ndv.getters.inputTableRow(2).realMouseMove(10, 10); ndv.getters.outputTableRow(2).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.inputTableRow(3).realHover(); + ndv.getters.inputTableRow(3).realMouseMove(10, 10); ndv.getters.outputTableRow(6).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); // output to input - ndv.getters.outputTableRow(1).realHover(); + ndv.actions.dragMainPanelToLeft(); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.getters.inputTableRow(4).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.outputTableRow(4).realHover(); + ndv.getters.outputTableRow(4).realMouseMove(10, 10); ndv.getters.inputTableRow(1).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.outputTableRow(2).realHover(); + ndv.getters.outputTableRow(2).realMouseMove(10, 10); ndv.getters.inputTableRow(2).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.outputTableRow(6).realHover(); + ndv.getters.outputTableRow(6).realMouseMove(10, 10); ndv.getters.inputTableRow(3).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.outputTableRow(1).realHover(); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.getters.inputTableRow(4).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); }); @@ -75,31 +77,31 @@ describe('NDV', () => { ndv.actions.switchInputMode('Table'); ndv.actions.switchOutputMode('Table'); - ndv.getters.backToCanvas().realHover(); // reset to default hover + ndv.getters.backToCanvas().realMouseMove(10, 10); // reset to default hover ndv.getters.outputHoveringItem().should('not.exist'); ndv.getters.parameterExpressionPreview('value').should('include.text', '1111'); ndv.actions.selectInputNode('Set1'); - ndv.getters.backToCanvas().realHover(); // reset to default hover + ndv.getters.backToCanvas().realMouseMove(10, 10); // reset to default hover ndv.getters.inputTableRow(1).should('have.text', '1000'); ndv.getters.inputTableRow(1).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.inputTableRow(1).realHover(); - cy.wait(50); + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTbodyCell(1, 0).realMouseMove(10, 10); ndv.getters.outputHoveringItem().should('have.text', '1000'); ndv.getters.parameterExpressionPreview('value').should('include.text', '1000'); ndv.actions.selectInputNode('Sort'); + ndv.actions.dragMainPanelToLeft(); ndv.actions.changeOutputRunSelector('1 of 2 (6 items)'); - ndv.getters.backToCanvas().realHover(); // reset to default hover + ndv.getters.backToCanvas().realMouseMove(10, 10); // reset to default hover ndv.getters.inputTableRow(1).should('have.text', '1111'); ndv.getters.inputTableRow(1).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); - ndv.getters.inputTableRow(1).realHover(); - cy.wait(50); + ndv.getters.inputTbodyCell(1, 0).realMouseMove(10, 10); ndv.getters.outputHoveringItem().should('have.text', '1111'); ndv.getters.parameterExpressionPreview('value').should('include.text', '1111'); }); @@ -132,20 +134,22 @@ describe('NDV', () => { ndv.getters.inputTableRow(1).should('have.text', '1111'); ndv.getters.inputTableRow(1).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); + + ndv.actions.dragMainPanelToLeft(); ndv.getters.outputTableRow(1).should('have.text', '1111'); - ndv.getters.outputTableRow(1).realHover(); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.getters.outputTableRow(3).should('have.text', '4444'); - ndv.getters.outputTableRow(3).realHover(); + ndv.getters.outputTableRow(3).realMouseMove(10, 10); ndv.getters.inputTableRow(3).should('have.text', '4444'); ndv.getters.inputTableRow(3).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); ndv.actions.changeOutputRunSelector('2 of 2 (6 items)'); - cy.wait(50); ndv.getters.inputTableRow(1).should('have.text', '1000'); - ndv.getters.inputTableRow(1).realHover(); + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTableRow(1).realMouseMove(10, 10); ndv.getters.outputTableRow(1).should('have.text', '1000'); ndv.getters @@ -155,7 +159,8 @@ describe('NDV', () => { .should('equal', 'hovering-item'); ndv.getters.outputTableRow(3).should('have.text', '2000'); - ndv.getters.outputTableRow(3).realHover(); + ndv.actions.dragMainPanelToLeft(); + ndv.getters.outputTableRow(3).realMouseMove(10, 10); ndv.getters.inputTableRow(3).should('have.text', '2000'); @@ -175,14 +180,15 @@ describe('NDV', () => { ndv.actions.switchOutputBranch('False Branch (2 items)'); ndv.getters.outputTableRow(1).should('have.text', '8888'); - ndv.getters.outputTableRow(1).realHover(); + ndv.actions.dragMainPanelToLeft(); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.getters.inputTableRow(5).should('have.text', '8888'); ndv.getters.inputTableRow(5).invoke('attr', 'data-test-id').should('equal', 'hovering-item'); ndv.getters.outputTableRow(2).should('have.text', '9999'); - ndv.getters.outputTableRow(2).realHover(); + ndv.getters.outputTableRow(2).realMouseMove(10, 10); ndv.getters.inputTableRow(6).should('have.text', '9999'); @@ -192,29 +198,35 @@ describe('NDV', () => { workflowPage.actions.openNode('Set5'); + ndv.actions.dragMainPanelToRight(); ndv.actions.switchInputBranch('True Branch'); + + ndv.actions.dragMainPanelToLeft(); ndv.actions.changeOutputRunSelector('1 of 2 (2 items)'); ndv.getters.outputTableRow(1).should('have.text', '8888'); - ndv.getters.outputTableRow(1).realHover(); - cy.wait(100); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.getters.inputHoveringItem().should('not.exist'); ndv.getters.inputTableRow(1).should('have.text', '1111'); - ndv.getters.inputTableRow(1).realHover(); - cy.wait(100); + + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTableRow(1).realMouseMove(10, 10); ndv.getters.outputHoveringItem().should('not.exist'); ndv.actions.switchInputBranch('False Branch'); ndv.getters.inputTableRow(1).should('have.text', '8888'); - ndv.getters.inputTableRow(1).realHover(); + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTableRow(1).realMouseMove(10, 10); + ndv.actions.dragMainPanelToLeft(); ndv.actions.changeOutputRunSelector('2 of 2 (4 items)'); ndv.getters.outputTableRow(1).should('have.text', '1111'); - ndv.getters.outputTableRow(1).realHover(); + ndv.getters.outputTableRow(1).realMouseMove(10, 10); ndv.actions.changeOutputRunSelector('1 of 2 (2 items)'); ndv.getters.inputTableRow(1).should('have.text', '8888'); - ndv.getters.inputTableRow(1).realHover(); + ndv.actions.dragMainPanelToRight(); + ndv.getters.inputTableRow(1).realMouseMove(10, 10); ndv.getters.outputHoveringItem().should('have.text', '8888'); // todo there's a bug here need to fix ADO-534 // ndv.getters.outputHoveringItem().should('not.exist'); diff --git a/cypress/pages/ndv.ts b/cypress/pages/ndv.ts index 4504552e26..516a0a1ea8 100644 --- a/cypress/pages/ndv.ts +++ b/cypress/pages/ndv.ts @@ -323,6 +323,12 @@ export class NDV extends BasePage { addItemToFixedCollection: (paramName: string) => { this.getters.fixedCollectionParameter(paramName).getByTestId('fixed-collection-add').click(); }, + dragMainPanelToLeft: () => { + cy.drag('[data-test-id=panel-drag-button]', [-1000, 0], { moveTwice: true }); + }, + dragMainPanelToRight: () => { + cy.drag('[data-test-id=panel-drag-button]', [1000, 0], { moveTwice: true }); + }, }; } diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 6cad68b34f..bc5a18a34f 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -177,6 +177,16 @@ Cypress.Commands.add('drag', (selector, pos, options) => { pageY: newPosition.y, force: true, }); + if (options?.moveTwice) { + // first move like hover to trigger object to be visible + // like in main panel in ndv + element.trigger('mousemove', { + which: 1, + pageX: newPosition.x, + pageY: newPosition.y, + force: true, + }); + } if (options?.clickToFinish) { // Click to finish the drag // For some reason, mouseup isn't working when moving nodes diff --git a/cypress/support/index.ts b/cypress/support/index.ts index 2fd1faeb22..84796adf05 100644 --- a/cypress/support/index.ts +++ b/cypress/support/index.ts @@ -59,7 +59,13 @@ declare global { drag( selector: string | Chainable>, target: [number, number], - options?: { abs?: boolean; index?: number; realMouse?: boolean; clickToFinish?: boolean }, + options?: { + abs?: boolean; + index?: number; + realMouse?: boolean; + clickToFinish?: boolean; + moveTwice?: boolean; + }, ): void; draganddrop( draggableSelector: string, diff --git a/packages/editor-ui/src/components/PanelDragButton.vue b/packages/editor-ui/src/components/PanelDragButton.vue index 929d5f9b18..c203e9e335 100644 --- a/packages/editor-ui/src/components/PanelDragButton.vue +++ b/packages/editor-ui/src/components/PanelDragButton.vue @@ -35,7 +35,7 @@ const onDragStart = () => { @dragend="onDragEnd" >