fix lerna bootstrap (editor v)

fix build (separate output dir for playground)
fix topicShape test
fix topicFontChange test
update/add snapshots
This commit is contained in:
Matias Arriola 2022-01-26 15:17:43 -03:00
parent d81b68bf33
commit 6f3fc75198
50 changed files with 24 additions and 35 deletions

4
.gitignore vendored
View File

@ -49,4 +49,6 @@ Thumbs.db
*.wmv *.wmv
**/build/**/* **/build/**/*
.vscode .vscode
*/test/playground/dist

View File

@ -17,7 +17,6 @@ pipelines:
- cypress - cypress
script: script:
- export CYPRESS_imageSnaphots="true" - export CYPRESS_imageSnaphots="true"
- yarn install
- yarn bootstrap - yarn bootstrap
- yarn build - yarn build
- yarn lint - yarn lint

View File

@ -3,7 +3,7 @@ services:
e2e: e2e:
image: cypress/included:8.4.1 image: cypress/included:8.4.1
container_name: wisemapping-integration-tests container_name: wisemapping-integration-tests
entrypoint: '/bin/sh -c "yarn bootstrap && yarn test:integration"' entrypoint: '/bin/sh -c "yarn bootstrap && yarn build && yarn test:integration"'
working_dir: /e2e working_dir: /e2e
environment: environment:
- CYPRESS_imageSnaphots=true - CYPRESS_imageSnaphots=true

View File

@ -3,7 +3,7 @@ services:
e2e: e2e:
image: cypress/included:8.4.1 image: cypress/included:8.4.1
container_name: wisemapping-integration-tests container_name: wisemapping-integration-tests
entrypoint: '/bin/sh -c "yarn bootstrap && yarn test:integration"' entrypoint: '/bin/sh -c "yarn bootstrap && yarn build && yarn test:integration"'
working_dir: /e2e working_dir: /e2e
environment: environment:
- CYPRESS_imageSnaphots=true - CYPRESS_imageSnaphots=true

View File

@ -1,4 +1,6 @@
context('Edit Topic', () => { context('Edit Topic', () => {
// TODO: review why click({force: true}) is needed in these tests
// also, why is the element outside the viewport in screenshots?
beforeEach(() => { beforeEach(() => {
cy.visit('/editor.html'); cy.visit('/editor.html');
cy.reload(); cy.reload();
@ -13,40 +15,32 @@ context('Edit Topic', () => {
it('Change Font Size', () => { it('Change Font Size', () => {
cy.get('#fontSizeTip').click(); cy.get('#fontSizeTip').click();
cy.get('#small').click(); cy.get('.popover #small').click();
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '8.0625'); cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '8.0625');
cy.matchImageSnapshot('changeFontSizeSmall'); cy.matchImageSnapshot('changeFontSizeSmall');
cy.get('#fontSizeTip').click(); cy.get('#fontSizeTip').click();
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible
cy.get('.popover #normal').click({ force: true }); cy.get('.popover #normal').click({ force: true });
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '10.75'); cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '10.75');
cy.matchImageSnapshot('changeFontSizeNormal'); cy.matchImageSnapshot('changeFontSizeNormal');
cy.get('#fontSizeTip').click(); cy.get('#fontSizeTip').click();
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible cy.get('.popover #large').click({ force: true });
cy.get('#large').click({ force: true });
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '13.4375'); cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '13.4375');
cy.matchImageSnapshot('changeFontSizeLarge');
cy.matchImageSnapshot('changeFontSizeNormal');
cy.get('#fontSizeTip').click(); cy.get('#fontSizeTip').click();
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible cy.get('.popover #huge').click({ force: true });
cy.get('#huge').click({ force: true });
cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '20.15625'); cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '20.15625');
cy.matchImageSnapshot('changeFontSizeHuge'); cy.matchImageSnapshot('changeFontSizeHuge');
}); });
it('Change Font type', () => { it('Change Font type', () => {
cy.get('#fontFamilyTip').click(); cy.get('#fontFamilyTip').click();
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible
cy.get('[model="Times"]').click({ force: true }); cy.get('[model="Times"]').click({ force: true });
cy.get('[test-id=1] > text').invoke('attr', 'font-family').should('eq', 'Times'); cy.get('[test-id=1] > text').invoke('attr', 'font-family').should('eq', 'Times');
@ -64,7 +58,6 @@ context('Edit Topic', () => {
it('Change Font color', () => { it('Change Font color', () => {
cy.get('#fontColorTip').click(); cy.get('#fontColorTip').click();
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible
cy.get('[title="RGB (153, 0, 255)"]').click({ force: true }); cy.get('[title="RGB (153, 0, 255)"]').click({ force: true });
cy.get('[test-id=1] > text').invoke('attr', 'fill').should('eq', 'rgb(153, 0, 255)'); cy.get('[test-id=1] > text').invoke('attr', 'fill').should('eq', 'rgb(153, 0, 255)');

View File

@ -4,8 +4,6 @@ context('Node manager', () => {
}); });
it('shortcut add sibling node', () => { it('shortcut add sibling node', () => {
// TODO: why is the editor appearing twice in the snapshot?
// cy.matchImageSnapshot('editor');
cy.contains('Mind Mapping').click(); cy.contains('Mind Mapping').click();
cy.get('body').type('{enter}').type('Mind Mapping rocks!!').type('{enter}'); cy.get('body').type('{enter}').type('Mind Mapping rocks!!').type('{enter}');

View File

@ -9,9 +9,7 @@ context('Change Topic shape', () => {
cy.get('#topicShapeTip').click(); cy.get('#topicShapeTip').click();
cy.get('#rectagle').click(); cy.get('#rectagle').click();
cy.get('[test-id=11] > rect').each((element, index, $list) => { cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '0');
cy.get($list[1]).invoke('attr', 'rx').should('eq', '0');
});
cy.matchImageSnapshot('changeToSquareShape'); cy.matchImageSnapshot('changeToSquareShape');
}); });
@ -21,9 +19,7 @@ context('Change Topic shape', () => {
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible // TODO: The parameter {force: true} was placed because it does not detect that the element is visible
cy.get('#rounded_rectagle').click({ force: true }); cy.get('#rounded_rectagle').click({ force: true });
cy.get('[test-id=11] > rect').each((element, index, $list) => { cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '4.05');
cy.get($list[1]).invoke('attr', 'rx').should('eq', '4.6499999999999995');
});
cy.matchImageSnapshot('changeToRoundedRectagle'); cy.matchImageSnapshot('changeToRoundedRectagle');
}); });
@ -41,9 +37,7 @@ context('Change Topic shape', () => {
// TODO: The parameter {force: true} was placed because it does not detect that the element is visible // TODO: The parameter {force: true} was placed because it does not detect that the element is visible
cy.get('#elipse').click({ force: true }); cy.get('#elipse').click({ force: true });
cy.get('[test-id=11] > rect').each((element, index, $list) => { cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '12.15');
cy.get($list[1]).invoke('attr', 'rx').should('eq', '13.950000000000001');
});
cy.matchImageSnapshot('changeToElipseShape'); cy.matchImageSnapshot('changeToElipseShape');
}); });

Binary file not shown.

Before

Width:  |  Height:  |  Size: 191 KiB

After

Width:  |  Height:  |  Size: 206 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 185 KiB

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 137 KiB

After

Width:  |  Height:  |  Size: 137 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 113 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

View File

@ -1,6 +1,6 @@
{ {
"name": "@wisemapping/editor", "name": "@wisemapping/editor",
"version": "0.1.0", "version": "0.4.0",
"main": "dist/editor.bundle.js", "main": "dist/editor.bundle.js",
"scripts": { "scripts": {
"build": "webpack --config webpack.prod.js", "build": "webpack --config webpack.prod.js",

View File

@ -8,13 +8,12 @@ const { merge } = require('webpack-merge');
const playgroundConfig = { const playgroundConfig = {
mode: 'development', mode: 'development',
entry: { entry: {
"editor.bundle": path.join(__dirname, 'src', 'index.tsx'),
viewmode: path.resolve(__dirname, './test/playground/map-render/js/viewmode'), viewmode: path.resolve(__dirname, './test/playground/map-render/js/viewmode'),
embedded: path.resolve(__dirname, './test/playground/map-render/js/embedded'), embedded: path.resolve(__dirname, './test/playground/map-render/js/embedded'),
editor: path.resolve(__dirname, './test/playground/map-render/js/editor'), editor: path.resolve(__dirname, './test/playground/map-render/js/editor'),
}, },
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'test/playground/dist'),
filename: '[name].js', filename: '[name].js',
library: { library: {
type: 'umd', type: 'umd',
@ -24,7 +23,6 @@ const playgroundConfig = {
historyApiFallback: true, historyApiFallback: true,
port: 8081, port: 8081,
open: false, open: false,
writeToDisk: true,
}, },
module: { module: {
rules: [ rules: [

View File

@ -8,14 +8,19 @@ const common = require('./webpack.common');
const playgroundConfig = { const playgroundConfig = {
mode: 'development', mode: 'development',
entry: { entry: {
mindplot: path.resolve(__dirname, './src/index.js'),
layout: path.resolve(__dirname, './test/playground/layout/context-loader'), layout: path.resolve(__dirname, './test/playground/layout/context-loader'),
}, },
output: {
path: path.resolve(__dirname, 'test/playground/dist'),
filename: '[name].js',
library: {
type: 'umd',
},
},
devServer: { devServer: {
historyApiFallback: true, historyApiFallback: true,
port: 8083, port: 8083,
open: false, open: false,
writeToDisk: true,
}, },
module: { module: {
rules: [ rules: [

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 151 KiB

After

Width:  |  Height:  |  Size: 148 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 116 KiB

After

Width:  |  Height:  |  Size: 86 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 321 KiB

After

Width:  |  Height:  |  Size: 325 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 296 KiB

After

Width:  |  Height:  |  Size: 301 KiB

View File

@ -20,7 +20,7 @@ module.exports = {
image: './test/playground/image.js', image: './test/playground/image.js',
}, },
output: { output: {
path: path.resolve(__dirname, 'dist', 'tests'), path: path.resolve(__dirname, 'test/playground/dist'),
filename: '[name].js', filename: '[name].js',
publicPath: '/', publicPath: '/',
}, },

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

After

Width:  |  Height:  |  Size: 54 KiB