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

82 lines
2.8 KiB
TypeScript
Raw Normal View History

2023-01-08 07:27:01 +01:00
/// <reference types="cypress" />
2023-01-08 06:10:13 +01:00
describe('Edit Topic', () => {
2022-12-01 07:12:40 +01:00
beforeEach(() => {
// Remove storage for autosave ...
cy.visit('/editor.html');
2023-01-08 07:27:01 +01:00
cy.waitEditorLoaded();
2022-12-01 07:12:40 +01:00
cy.get('[test-id=1]').click();
});
2023-01-08 07:27:01 +01:00
it('Open Font Shape Panel', () => {
cy.get(`[aria-label="Topic Style"]`).first().trigger('mouseover');
cy.matchImageSnapshot('fontShapePanel');
});
2022-12-01 07:12:40 +01:00
it('Change Main Topic Text', () => {
cy.get('body').type('New Title Main Topic{enter}');
cy.get('[test-id=1] > text > tspan').should('have.text', 'New Title Main Topic');
2023-01-07 22:22:33 +01:00
2023-01-08 07:27:01 +01:00
cy.contains('Mind Mapping').click({ force: true });
2022-12-01 07:12:40 +01:00
cy.matchImageSnapshot('changeMainTopicText');
});
it('Change Font Size', () => {
// Go to the minimal size.
2022-12-07 06:04:17 +01:00
cy.get('[aria-label="Font Style"]').first().trigger('mouseover');
cy.get('[aria-label="Smaller"]').as('smaller');
cy.get('@smaller').eq(1).click();
cy.get('@smaller').eq(1).click();
2022-12-01 07:12:40 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '8.1');
cy.matchImageSnapshot('changeFontSizeSmall');
2022-12-07 06:04:17 +01:00
cy.get('[aria-label="Bigger"]').as('bigger');
cy.get('@bigger').eq(1).click();
2022-12-01 07:12:40 +01:00
cy.matchImageSnapshot('changeFontSizeNormal');
2022-12-07 06:04:17 +01:00
cy.get('@bigger').eq(1).click();
2022-12-01 07:12:40 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '13.4');
cy.matchImageSnapshot('changeFontSizeLarge');
2022-12-07 06:04:17 +01:00
cy.get('@bigger').eq(1).click();
2022-12-01 07:12:40 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '20.2');
cy.matchImageSnapshot('changeFontSizeHuge');
2022-12-07 06:04:17 +01:00
cy.get('@bigger').eq(1).click();
2022-12-01 07:12:40 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '20.2');
2023-01-07 22:22:33 +01:00
2022-12-01 07:12:40 +01:00
cy.matchImageSnapshot('changeFontSizeHuge');
});
2022-12-07 06:04:17 +01:00
it('Change Font To Italic', () => {
cy.get('[aria-label="Font Style"]').first().trigger('mouseover');
cy.get('[aria-label^="Italic ').first().click();
2022-12-01 07:12:40 +01:00
2022-12-07 06:04:17 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-style').should('eq', 'italic');
2023-01-08 07:27:01 +01:00
cy.contains('Mind Mapping').click({ force: true });
2022-12-07 06:04:17 +01:00
cy.matchImageSnapshot('changeFontItalic');
2022-12-01 07:12:40 +01:00
});
2022-12-07 06:04:17 +01:00
it('Change Font to Bold', () => {
2022-12-01 07:12:40 +01:00
cy.get(`[aria-label="Font Style"]`).first().trigger('mouseover');
2022-12-07 06:04:17 +01:00
cy.get('[aria-label^="Bold ').first().click();
2022-12-01 07:12:40 +01:00
2022-12-07 06:04:17 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'font-weight').should('eq', 'normal');
2022-12-01 07:12:40 +01:00
2023-01-08 07:27:01 +01:00
cy.contains('Mind Mapping').click({ force: true });
2022-12-07 06:04:17 +01:00
cy.matchImageSnapshot('changeFontBold');
2022-12-01 07:12:40 +01:00
});
2022-12-07 06:04:17 +01:00
it('Change Font Color', () => {
cy.get('[aria-label="Font Style"]').eq(1).trigger('mouseover');
cy.get('[aria-label="Color"]').eq(1).click();
cy.get('[title="#cc0000"]').click({ force: true });
2022-12-01 07:12:40 +01:00
2022-12-07 06:04:17 +01:00
cy.get('[test-id=1] > text').invoke('attr', 'fill').should('eq', '#cc0000');
2022-12-01 07:12:40 +01:00
2023-01-08 07:27:01 +01:00
cy.contains('Mind Mapping').click({ force: true });
2022-12-01 07:12:40 +01:00
cy.matchImageSnapshot('changeFontColor');
});
});