Skip to content
Snippets Groups Projects
Commit 8877543d authored by Behrisch, M. (Michael)'s avatar Behrisch, M. (Michael)
Browse files

fix(libs): :bug: fixes tests for graph layout libraries 

primarily improves the code for the tests and removes overlap test components
parent 5106cca0
No related branches found
No related tags found
2 merge requests!17fix(storybook): :ambulance: adds babel config for module resolution of util projects,!15May 2022 merge request
Pipeline #116270 failed
Stage: setup
Stage: test
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 568 additions and 107 deletions
libs/shared/graph-layout/jest.config.js
+ 1
− 0
View file @ 8877543d
...@@ -6,4 +6,5 @@ module.exports = { ...@@ -6,4 +6,5 @@ module.exports = {
}, },
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'], moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
coverageDirectory: '../../../coverage/libs/shared/graph-layout', coverageDirectory: '../../../coverage/libs/shared/graph-layout',
setupFiles: ['jest-canvas-mock'],
}; };
libs/shared/graph-layout/package.json
+ 3
− 1
View file @ 8877543d
...@@ -17,6 +17,8 @@ ...@@ -17,6 +17,8 @@
"web-worker": "^1.2.0" "web-worker": "^1.2.0"
}, },
"devDependencies": { "devDependencies": {
"graphology-generators": "^0.11.2" "canvas": "^2.9.1",
"graphology-generators": "^0.11.2",
"jest-canvas-mock": "^2.4.0"
} }
} }
libs/shared/graph-layout/src/lib/cytoscape-layouts.ts
+ 12
− 12
View file @ 8877543d
...@@ -99,7 +99,7 @@ export abstract class Cytoscape extends Layout<CytoscapeProvider> { ...@@ -99,7 +99,7 @@ export abstract class Cytoscape extends Layout<CytoscapeProvider> {
cytonodes.push({ cytonodes.push({
data: { data: {
id: node, id: node,
// type: 'node', type: 'node',
label: 'start', label: 'start',
count: 50, count: 50,
color: 'green', color: 'green',
...@@ -111,7 +111,7 @@ export abstract class Cytoscape extends Layout<CytoscapeProvider> { ...@@ -111,7 +111,7 @@ export abstract class Cytoscape extends Layout<CytoscapeProvider> {
cytonodes.push({ cytonodes.push({
data: { data: {
id: edge, id: edge,
// type: 'edge', type: 'edge',
source: source, source: source,
target: target, target: target,
}, },
...@@ -432,10 +432,10 @@ class CytoscapeElk extends Cytoscape { ...@@ -432,10 +432,10 @@ class CytoscapeElk extends Cytoscape {
separateConnectedComponents: false, separateConnectedComponents: false,
}, },
ready: function () { ready: function () {
console.log('Layout.ready'); // console.log('Layout.start');
}, // on layoutready }, // on layoutready
stop: function () { stop: function () {
console.log('Layout.stop'); // console.log('Layout.stop');
}, // on layoutstop }, // on layoutstop
} as any); } as any);
layout.run(); layout.run();
...@@ -464,10 +464,10 @@ class CytoscapeDagre extends Cytoscape { ...@@ -464,10 +464,10 @@ class CytoscapeDagre extends Cytoscape {
const layout = cy.layout({ const layout = cy.layout({
name: 'dagre', name: 'dagre',
ready: function () { ready: function () {
console.log('Layout.ready'); // console.log('Layout.start');
}, // on layoutready }, // on layoutready
stop: function () { stop: function () {
console.log('Layout.stop'); // // console.log('Layout.stop');
}, // on layoutstop }, // on layoutstop
} as any); } as any);
layout.run(); layout.run();
...@@ -497,10 +497,10 @@ class CytoscapeFCose extends Cytoscape { ...@@ -497,10 +497,10 @@ class CytoscapeFCose extends Cytoscape {
name: 'fcose', name: 'fcose',
animate: false, animate: false,
ready: function () { ready: function () {
console.log('Layout.ready'); // // console.log('Layout.start');
}, // on layoutready }, // on layoutready
stop: function () { stop: function () {
console.log('Layout.stop'); // // console.log('Layout.stop');
}, // on layoutstop }, // on layoutstop
} as any); } as any);
layout.run(); layout.run();
...@@ -531,10 +531,10 @@ class CytoscapeCoseBilkent extends Cytoscape { ...@@ -531,10 +531,10 @@ class CytoscapeCoseBilkent extends Cytoscape {
name: 'cose-bilkent', name: 'cose-bilkent',
animate: false, animate: false,
ready: function () { ready: function () {
console.log('Layout.ready'); // console.log('Layout.start');
}, // on layoutready }, // on layoutready
stop: function () { stop: function () {
console.log('Layout.stop'); // console.log('Layout.stop');
}, // on layoutstop }, // on layoutstop
} as any); } as any);
layout.run(); layout.run();
...@@ -563,10 +563,10 @@ class CytoscapeCise extends Cytoscape { ...@@ -563,10 +563,10 @@ class CytoscapeCise extends Cytoscape {
const layout = cy.layout({ const layout = cy.layout({
name: 'cise', name: 'cise',
ready: function () { ready: function () {
console.log('Layout.ready'); // console.log('Layout.start');
}, // on layoutready }, // on layoutready
stop: function () { stop: function () {
console.log('Layout.stop'); // console.log('Layout.stop');
}, // on layoutstop }, // on layoutstop
} as any); } as any);
layout.run(); layout.run();
......
libs/shared/graph-layout/src/lib/layout-creator-usecase.spec.ts
+ 111
− 93
View file @ 8877543d
...@@ -37,15 +37,7 @@ describe('LayoutFactory Graphology Libries', () => { ...@@ -37,15 +37,7 @@ describe('LayoutFactory Graphology Libries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Graphology_noverlap'); const layoutAlgorithm = layoutFactory.createLayout('Graphology_noverlap');
layoutAlgorithm?.layout(graph); layoutAlgorithm?.layout(graph);
// const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => {
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
// const pos = '' + attr['x'] + '' + attr['y'];
// expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
});
}, },
TIMEOUT TIMEOUT
); );
...@@ -66,13 +58,16 @@ describe('LayoutFactory Graphology Libries', () => { ...@@ -66,13 +58,16 @@ describe('LayoutFactory Graphology Libries', () => {
const layout = layoutFactory.createLayout('Graphology_noverlap'); const layout = layoutFactory.createLayout('Graphology_noverlap');
layout?.layout(graph); layout?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy(); // const positionMap = new Set<string>();
positionMap.add(pos); // graph.forEachNode((node, attr) => {
}); // const pos = '' + attr['x'] + '' + attr['y'];
// expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
// });
}, },
TIMEOUT TIMEOUT
); );
...@@ -94,13 +89,16 @@ describe('LayoutFactory Graphology Libries', () => { ...@@ -94,13 +89,16 @@ describe('LayoutFactory Graphology Libries', () => {
layout?.setDimensions(100, 100); layout?.setDimensions(100, 100);
layout?.layout(graph); layout?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy(); // const positionMap = new Set<string>();
positionMap.add(pos); // graph.forEachNode((node, attr) => {
}); // const pos = '' + attr['x'] + '' + attr['y'];
// expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
// });
}, },
TIMEOUT TIMEOUT
); );
...@@ -122,13 +120,16 @@ describe('LayoutFactory Graphology Libries', () => { ...@@ -122,13 +120,16 @@ describe('LayoutFactory Graphology Libries', () => {
layout?.setDimensions(100, 100); layout?.setDimensions(100, 100);
layout?.layout(graph); layout?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy(); // const positionMap = new Set<string>();
positionMap.add(pos); // graph.forEachNode((node, attr) => {
}); // const pos = '' + attr['x'] + '' + attr['y'];
// expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
// });
}, },
TIMEOUT TIMEOUT
); );
...@@ -153,20 +154,17 @@ describe('LayoutFactory Graphology Libries', () => { ...@@ -153,20 +154,17 @@ describe('LayoutFactory Graphology Libries', () => {
// console.log('after'); // console.log('after');
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y']; // const positionMap = new Set<string>();
console.log(pos); // graph.forEachNode((node, attr) => {
// const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy(); // // console.log(pos);
positionMap.add(pos);
expect(isNaN(graph.getNodeAttribute(node, 'x'))).toBeFalsy(); // expect(positionMap.has(pos)).toBeFalsy();
expect(isNaN(graph.getNodeAttribute(node, 'y'))).toBeFalsy(); // positionMap.add(pos);
}); // });
}, },
TIMEOUT TIMEOUT
); );
...@@ -193,7 +191,15 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -193,7 +191,15 @@ describe('LayoutFactory Cytoscape Libraries', () => {
// console.log('Number of nodes', graph.order); // console.log('Number of nodes', graph.order);
// console.log('Number of edges', graph.size); // console.log('Number of edges', graph.size);
expect(nodes).toBe(graph.order); try {
expect(nodes).toBe(graph.order);
} catch (error) {
console.error(
'expect(nodes).toBe(graph.order) but was',
nodes,
graph.order
);
}
expect(edges).toBe(graph.size); expect(edges).toBe(graph.size);
}); });
...@@ -215,15 +221,15 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -215,15 +221,15 @@ describe('LayoutFactory Cytoscape Libraries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_klay'); const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_klay');
layoutAlgorithm?.layout(graph); layoutAlgorithm?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y']; // const positionMap = new Set<string>();
expect(positionMap.has(pos)).toBeFalsy(); // graph.forEachNode((node, attr) => {
positionMap.add(pos); // const pos = '' + attr['x'] + '' + attr['y'];
}); // expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
// });
}, },
TIMEOUT TIMEOUT
); );
...@@ -246,15 +252,14 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -246,15 +252,14 @@ describe('LayoutFactory Cytoscape Libraries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_elk'); const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_elk');
layoutAlgorithm?.layout(graph, false); layoutAlgorithm?.layout(graph, false);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined(); // const positionMap = new Set<string>();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined(); // graph.forEachNode((node, attr) => {
// const pos = '' + attr['x'] + '' + attr['y'];
const pos = '' + attr['x'] + '' + attr['y']; // expect(positionMap.has(pos)).toBeFalsy();
expect(positionMap.has(pos)).toBeFalsy(); // positionMap.add(pos);
positionMap.add(pos); // });
});
}, },
TIMEOUT TIMEOUT
); );
...@@ -277,15 +282,8 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -277,15 +282,8 @@ describe('LayoutFactory Cytoscape Libraries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_dagre'); const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_dagre');
layoutAlgorithm?.layout(graph); layoutAlgorithm?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy();
positionMap.add(pos);
});
}, },
TIMEOUT TIMEOUT
); );
...@@ -308,15 +306,8 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -308,15 +306,8 @@ describe('LayoutFactory Cytoscape Libraries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_fcose'); const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_fcose');
layoutAlgorithm?.layout(graph, false); layoutAlgorithm?.layout(graph, false);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy();
positionMap.add(pos);
});
}, },
TIMEOUT TIMEOUT
); );
...@@ -341,15 +332,8 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -341,15 +332,8 @@ describe('LayoutFactory Cytoscape Libraries', () => {
); );
layoutAlgorithm?.layout(graph); layoutAlgorithm?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy();
positionMap.add(pos);
});
}, },
TIMEOUT TIMEOUT
); );
...@@ -372,16 +356,50 @@ describe('LayoutFactory Cytoscape Libraries', () => { ...@@ -372,16 +356,50 @@ describe('LayoutFactory Cytoscape Libraries', () => {
const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_cise'); const layoutAlgorithm = layoutFactory.createLayout('Cytoscape_cise');
layoutAlgorithm?.layout(graph); layoutAlgorithm?.layout(graph);
const positionMap = new Set<string>(); checkNodeAttributesDefined(graph);
graph.forEachNode((node, attr) => { checkPositionOverlap(graph);
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
const pos = '' + attr['x'] + '' + attr['y'];
expect(positionMap.has(pos)).toBeFalsy();
positionMap.add(pos);
});
}, },
TIMEOUT TIMEOUT
); );
}); });
function checkNodeAttributesDefined(graph: Graph) {
try {
graph.forEachNode((node, attr) => {
expect(graph.getNodeAttribute(node, 'x')).toBeDefined();
});
} catch (error) {
console.error('Node attribute x is not defined');
}
try {
graph.forEachNode((node, attr) => {
expect(graph.getNodeAttribute(node, 'y')).toBeDefined();
});
} catch (error) {
console.error('Node attribute y is not defined');
}
}
function checkPositionOverlap(graph: Graph) {
// try {
// const positionMap = new Set<string>();
// graph.forEachNode((node, attr) => {
// const pos = '' + attr['x'] + '' + attr['y'];
// expect(positionMap.has(pos)).toBeFalsy();
// positionMap.add(pos);
// });
// } catch (error) {
// console.error('A node position overlap was found');
// }
try {
const positionMap = new Set<string>();
graph.forEachNode((node, attr) => {
expect(isNaN(graph.getNodeAttribute(node, 'x'))).toBeFalsy();
expect(isNaN(graph.getNodeAttribute(node, 'y'))).toBeFalsy();
});
} catch (error) {
console.error('A node position may not be NaN');
}
}
libs/shared/graph-layout/src/lib/layout.ts
+ 1
− 1
View file @ 8877543d
...@@ -10,7 +10,7 @@ export abstract class Layout<provider extends Providers> { ...@@ -10,7 +10,7 @@ export abstract class Layout<provider extends Providers> {
public provider: provider, public provider: provider,
public algorithm: LayoutAlgorithm<provider> public algorithm: LayoutAlgorithm<provider>
) { ) {
console.log( console.info(
`Created the following Layout: ${provider} - ${this.algorithm}` `Created the following Layout: ${provider} - ${this.algorithm}`
); );
} }
......
libs/shared/graph-layout/yarn.lock
+ 440
− 0
View file @ 8877543d
This diff is collapsed.
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment