Skip to content
This repository has been archived by the owner on Nov 27, 2023. It is now read-only.

Update E2E 10-branching_actions tests #1516

Merged
merged 4 commits into from
Mar 21, 2023
Merged

Update E2E 10-branching_actions tests #1516

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
360bd8c
Add/fix cypress commands,
unsortedhashsets Mar 20, 2023
97f3522
Rename 09-step test
unsortedhashsets Mar 20, 2023
b9911a5
Update e2e test for 10-branching actions
unsortedhashsets Mar 20, 2023
16d48f9
Merge branch 'main' into E2E_brnaches_refactoring
kahboom Mar 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion cypress/e2e/09-step_actions_from_canvas/step_extension_actions_from_canvas.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ describe('Test for Step extensions', () => {
cy.uploadInitialState('TimerLogCamelRoute.yaml');
});

it('User sees a step extension(http)', () => {
it('User sees a step extension(transform)', () => {
cy.insertStepMiniCatalog('transform');
cy.openStepConfigurationTab('transform');

Expand Down
193 changes: 51 additions & 142 deletions cypress/e2e/10-branching_actions_from_canvas/branches_from_canvas.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,152 +1,95 @@
describe('Test for Branching actions from the canvas', () => {
beforeEach(() => {
let url = Cypress.config().baseUrl;
cy.visit(url);

cy.intercept('/v1/integrations/dsls').as('getDSLs');
cy.intercept('/v1/view-definitions').as('getViewDefinitions');
cy.intercept('/v1/integrations*').as('getIntegration');

// Upload the initial state (TimerLogCamelRoute.yaml)
cy.get('[data-testid="toolbar-show-code-btn"]').click();
cy.get('[data-testid="sourceCode--clearButton"]').should('be.visible').click({ force: true });
cy.get('.pf-c-code-editor__main').should('be.visible');
cy.get('.pf-c-code-editor__main > input').attachFile('EipAction.yaml');
cy.get('[data-testid="sourceCode--applyButton"]').click();
cy.openHomePage();
cy.uploadInitialState('EipAction.yaml');

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
cy.zoomOutXTimes(3)
});

it(' User appends a branch from the canvas', () => {
// Add additional branch with Append button
cy.get('[data-testid="viz-step-choice"]').first().children('[data-testid="stepNode__appendStep-btn"]').click();
// Click on the add branch menu item
cy.get('[data-testid="miniCatalog__branches"]').click();
// Click on the add branch button to add first branch
cy.get('[data-testid="addBranch__button"]').click();
// Blocked due to:
// https://github.com/KaotoIO/kaoto-ui/issues/1381
// https://github.com/KaotoIO/kaoto-ui/issues/1473
// cy.appendBranch(0);

// Temporary Blocker check
cy.get('[data-testid="viz-step-choice"]').eq(0).children('[data-testid="stepNode__appendStep-btn"]').should('be.disabled');

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();
// Temporary solution with Choice extension
cy.openStepConfigurationTab('choice', 0);
cy.addBranchChoiceExtension();
cy.closeStepConfigurationTab();

// CHECK that new node with empty slot was created
cy.get('[data-testid="viz-step-choice"]').should('have.length', 2);
cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
cy.get('.stepNode').eq(12).should('have.attr', 'data-testid', 'viz-step-slot');

// Blocked due to: https://github.com/KaotoIO/kaoto-ui/issues/1381
// // wait until the API returns the updated visualization
// cy.wait('@getViewDefinitions')

// // Click Sync you code button to verify that generated code is equal to canvas
// cy.get('[data-testid="sourceCode--applyButton"]').click();
cy.get('.stepNode').eq(10).should('have.attr', 'data-testid', 'viz-step-slot');

// // wait until the API returns the updated visualization
// cy.wait('@getViewDefinitions')
cy.syncUpCodeChanges()

// // CHECK after Sync your code button click
// cy.get('[data-testid="viz-step-choice"]').should('have.length', 2);
// cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
// cy.get('.stepNode').eq(12).should('have.attr', 'data-testid', 'viz-step-slot');
// CHECK after Sync your code button click
cy.get('[data-testid="viz-step-choice"]').should('have.length', 2);
cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
cy.get('.stepNode').eq(10).should('have.attr', 'data-testid', 'viz-step-slot');
});

it('User deletes a branch from the canvas', () => {
// Delete the first branch with digitalocean step
cy.get('[data-testid="stepNode__deleteBranch-btn"]').eq(0).click();
// Confirm the deletion
cy.get('[data-testid="confirmDeleteBranchDialog__btn"]').click();

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();
cy.deleteBranch(1);

// CHECK that the branch was deleted and the node with index 11 contains the viz-step-kamelet:sink
cy.get('[data-testid="viz-step-digitalocean"]').should('not.exist');
cy.get('[data-testid="viz-step-marshal"]').should('not.exist');
cy.get('.stepNode').eq(11).should('have.attr', 'data-testid', 'viz-step-kamelet:sink');
cy.get('.code-editor').should('not.contain.text', '{{?bar}}')

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')

// Click Sync you code button to verify that generated code is equal to canvas
cy.get('[data-testid="sourceCode--applyButton"]').click();

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
cy.syncUpCodeChanges()

// CHECK after Sync your code button click
cy.get('[data-testid="viz-step-digitalocean"]').should('not.exist');
cy.get('[data-testid="viz-step-marshal"]').should('not.exist');
cy.get('.stepNode').eq(11).should('have.attr', 'data-testid', 'viz-step-kamelet:sink');
cy.get('.code-editor').should('not.contain.text', '{{?bar}}')
});

it('User inserts a branch from the canvas', () => {
// Insert additional choice step to show insert Button
cy.get('[data-testid="stepNode__insertStep-btn"]').first().click();
// Open the miniCatalog
cy.get('[data-testid="miniCatalog"]').should('be.visible');
// Search activemq step
cy.get('.pf-c-text-input-group__text-input').type('choice');
// Select activemq step
cy.get('[data-testid="miniCatalog__stepItem--choice"]').first().click();
cy.insertStepMiniCatalog('choice', 0);

// CHECK new choice step added
cy.get('.stepNode').eq(1).should('have.attr', 'data-testid', 'viz-step-choice');
// Blocked due to:
// https://github.com/KaotoIO/kaoto-ui/issues/1381
// https://github.com/KaotoIO/kaoto-ui/issues/1473
// cy.insertBranch(1);

// Insert branch after additional choice step
cy.get('[data-testid="stepNode__insertStep-btn"]').eq(1).click();
// Open the miniCatalog
cy.get('[data-testid="miniCatalog"]').should('be.visible');
// Click on the add branch menu item
cy.get('[data-testid="miniCatalog__branches"]').click();
// Click on the add branch button to add first branch
cy.get('[data-testid="addBranch__button"]').click();

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();

// CHECK that new node with empty slot was created
cy.get('[data-testid="viz-step-choice"]').should('have.length', 3);
cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
cy.get('.stepNode').eq(2).should('have.attr', 'data-testid', 'viz-step-slot');

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
// // CHECK that new node with empty slot was created
// cy.get('[data-testid="viz-step-choice"]').should('have.length', 3);
// cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
// cy.get('.stepNode').eq(2).should('have.attr', 'data-testid', 'viz-step-slot');

// Click Sync you code button to verify that generated code is equal to canvas
cy.get('[data-testid="sourceCode--applyButton"]').click();
// cy.syncUpCodeChanges()

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
// // CHECK after Sync your code button click
// cy.get('[data-testid="viz-step-choice"]').should('have.length', 3);
// cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
// cy.get('.stepNode').eq(2).should('have.attr', 'data-testid', 'viz-step-slot');

// CHECK after Sync your code button click
cy.get('[data-testid="viz-step-choice"]').should('have.length', 3);
cy.get('[data-testid="viz-step-slot"]').should('have.length', 1);
cy.get('.stepNode').eq(2).should('have.attr', 'data-testid', 'viz-step-slot');
// Temporary Blocker check
cy.get('[data-testid="stepNode__insertStep-btn"]').eq(1).click();
cy.get('[data-testid="miniCatalog__branches"]').should('have.attr', 'aria-disabled', 'true')
});

it('User appends a step in a branch from the canvas (last in the branch)', () => {
// Click append button after set-header step
cy.get('[data-testid="stepNode__appendStep-btn"]').eq(2).click();
// Open the miniCatalog
cy.get('[data-testid="miniCatalog"]').should('be.visible');
// Search activemq step
cy.get('.pf-c-text-input-group__text-input').type('activemq');
// Select activemq step
cy.get('[data-testid="miniCatalog__stepItem--activemq"]').first().click();

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();
cy.appendStepMiniCatalog('set-header', 'activemq');

// CHECK that the activemq step was inserted between digitalocean and set-header steps
cy.get('.stepNode').eq(4).should('have.attr', 'data-testid', 'viz-step-digitalocean');
cy.get('.stepNode').eq(5).should('have.attr', 'data-testid', 'viz-step-set-header');
cy.get('.stepNode').eq(6).should('have.attr', 'data-testid', 'viz-step-activemq');
cy.get('[data-testid="viz-step-activemq"]').should('be.visible');

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')

// Click Sync you code button to verify that generated code is equal to canvas
cy.get('[data-testid="sourceCode--applyButton"]').click();

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
cy.syncUpCodeChanges()

// CHECK after Sync your code button click
cy.get('.stepNode').eq(4).should('have.attr', 'data-testid', 'viz-step-digitalocean');
Expand All @@ -156,32 +99,15 @@ describe('Test for Branching actions from the canvas', () => {
});

it('User prepends a step in a branch from the canvas (first in the branch)', () => {
// Click prepend button before set-header step
cy.get('[data-testid="stepNode__prependStep-btn"]').eq(2).click();
// Open the miniCatalog
cy.get('[data-testid="miniCatalog"]').should('be.visible');
// Search activemq step
cy.get('.pf-c-text-input-group__text-input').type('activemq');
// Select activemq step
cy.get('[data-testid="miniCatalog__stepItem--activemq"]').first().click();

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();
cy.prependStepMiniCatalog('digitalocean', 'activemq');

// CHECK that the activemq step was inserted between digitalocean and set-header steps
cy.get('.stepNode').eq(4).should('have.attr', 'data-testid', 'viz-step-activemq');
cy.get('.stepNode').eq(5).should('have.attr', 'data-testid', 'viz-step-digitalocean');
cy.get('.stepNode').eq(6).should('have.attr', 'data-testid', 'viz-step-set-header');
cy.get('[data-testid="viz-step-activemq"]').should('be.visible');

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')

// Click Sync you code button to verify that generated code is equal to canvas
cy.get('[data-testid="sourceCode--applyButton"]').click();

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
cy.syncUpCodeChanges()

// CHECK after Sync your code button click
cy.get('.stepNode').eq(4).should('have.attr', 'data-testid', 'viz-step-activemq');
Expand All @@ -191,17 +117,7 @@ describe('Test for Branching actions from the canvas', () => {
});

it('User prepends a step to a step whose previous step contains branches', () => {
// Click prepend button before filter step
cy.get('[data-testid="stepNode__prependStep-btn"]').last().click();
// Open the miniCatalog
cy.get('[data-testid="miniCatalog"]').should('be.visible');
// Search activemq step
cy.get('.pf-c-text-input-group__text-input').type('activemq');
// Select activemq step
cy.get('[data-testid="miniCatalog__stepItem--activemq"]').first().click();

// Zoom out to see the whole scheme, 3x
cy.get('.react-flow__controls-button.react-flow__controls-zoomout').click().click().click();
cy.prependStepMiniCatalog('filter', 'activemq');

// CHECK that the activemq step was prepended before filter and after all the branches ends
cy.get('.stepNode').eq(5).should('have.attr', 'data-testid', 'viz-step-set-header');
Expand All @@ -212,14 +128,7 @@ describe('Test for Branching actions from the canvas', () => {
cy.get('.stepNode').eq(13).should('have.attr', 'data-testid', 'viz-step-filter');
cy.get('[data-testid="viz-step-activemq"]').should('be.visible');

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')

// Click Sync you code button to verify that generated code is equal to canvas
cy.get('[data-testid="sourceCode--applyButton"]').click();

// wait until the API returns the updated visualization
cy.wait('@getViewDefinitions')
cy.syncUpCodeChanges()

// CHECK after Sync your code button click
cy.get('.stepNode').eq(5).should('have.attr', 'data-testid', 'viz-step-set-header');
Expand Down
2 changes: 2 additions & 0 deletions cypress/e2e/10-branching_actions_from_canvas/branches_step_actions_from_canvas.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ describe('User completes normal actions on steps in a branch', () => {

cy.openHomePage();
cy.uploadInitialState('EipAction.yaml');

cy.zoomOutXTimes(3)
});

it('User configures a step in a branch', () => {
Expand Down
Loading