wisemapping-frontend/packages/editor/cypress/e2e/topicShape.cy.ts

89 lines
2.4 KiB
TypeScript
Raw Normal View History

2023-01-08 07:27:01 +01:00
/// <reference types="cypress" />
2023-01-15 09:10:27 +01:00
describe('Topic Shape Suite', () => {
2022-01-26 20:25:11 +01:00
beforeEach(() => {
cy.visit('/editor.html');
2023-01-08 07:27:01 +01:00
// Wait all has been loaded ...
cy.waitEditorLoaded();
// Select one node ...
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Try it Now!');
2022-01-26 20:25:11 +01:00
});
2023-01-08 07:27:01 +01:00
it('open shape', () => {
2023-01-15 09:10:27 +01:00
cy.onMouseOverToolbarButton('Topic Style');
2023-01-08 07:27:01 +01:00
cy.matchImageSnapshot('topicShapePanel');
});
2022-01-26 20:25:11 +01:00
it('change to square shape', () => {
2023-01-15 09:10:27 +01:00
cy.onMouseOverToolbarButton('Topic Style');
2022-11-01 01:49:16 +01:00
cy.get(`[aria-label="Rectangle shape"]`).first().click();
2022-01-26 20:25:11 +01:00
2022-12-01 07:12:40 +01:00
cy.get('[test-id=11] > rect')
.eq(1)
.invoke('attr', 'rx')
.then(parseInt)
.should('be.a', 'number')
.should('eq', 0);
2022-01-26 20:25:11 +01:00
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Mind Mapping');
2022-01-26 20:25:11 +01:00
cy.matchImageSnapshot('changeToSquareShape');
});
2022-10-31 16:32:51 +01:00
it('change to rounded rectangle', () => {
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Mind Mapping');
2022-01-26 20:25:11 +01:00
2023-01-15 09:10:27 +01:00
cy.onMouseOverToolbarButton('Topic Style');
2022-11-01 01:49:16 +01:00
cy.get(`[aria-label="Rounded shape"]`).first().click();
2022-01-26 20:25:11 +01:00
2022-10-31 21:23:49 +01:00
// Todo: Check how to validate this. Difference when it run in docker vs test:integration
2022-12-01 07:12:40 +01:00
cy.get('[test-id=6] > rect')
.eq(1)
.invoke('attr', 'rx')
.then(parseInt)
.should('be.a', 'number')
.should('be.gte', 4);
cy.get('[test-id=6] > rect')
.eq(1)
.invoke('attr', 'rx')
.then(parseInt)
.should('be.a', 'number')
.should('be.lt', 5);
2022-10-31 16:32:51 +01:00
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Mind Mapping');
2022-10-31 16:32:51 +01:00
cy.matchImageSnapshot('changeToRoundedRectangle');
2022-01-26 20:25:11 +01:00
});
it('change to line', () => {
2023-01-15 09:10:27 +01:00
cy.onMouseOverToolbarButton('Topic Style');
2022-11-01 01:49:16 +01:00
cy.get(`[aria-label="Line shape"]`).first().click();
2022-01-26 20:25:11 +01:00
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Mind Mapping');
2022-01-26 20:25:11 +01:00
cy.matchImageSnapshot('changeToLine');
});
2022-10-31 16:32:51 +01:00
it('change to ellipse shape', () => {
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Productivity');
cy.onMouseOverToolbarButton('Topic Style');
2022-10-31 16:32:51 +01:00
2022-11-01 01:49:16 +01:00
cy.get(`[aria-label="Ellipse shape"]`).first().click();
2022-01-26 20:25:11 +01:00
2022-10-31 21:23:49 +01:00
// Todo: Check how to validate this. Difference when it run in docker vs test:integration
2022-12-01 07:12:40 +01:00
cy.get('[test-id=2] > rect')
.eq(1)
.invoke('attr', 'rx')
.then(parseInt)
.should('be.a', 'number')
.should('be.gte', 12);
cy.get('[test-id=2] > rect')
.eq(1)
.invoke('attr', 'rx')
.then(parseInt)
.should('be.a', 'number')
.should('be.lt', 15);
2022-01-26 20:25:11 +01:00
2023-01-15 09:10:27 +01:00
cy.focusTopicByText('Mind Mapping');
2022-10-31 16:32:51 +01:00
cy.matchImageSnapshot('changeToEllipseShape');
2022-01-26 20:25:11 +01:00
});
});