diff --git a/src/composables/LayoutMain.ts b/src/composables/LayoutMain.ts index 2070008444a5343086614e9f3ffd42ab3282c9b2..8e579ab2babd06ee35a67632fa8bff1fd51c7158 100644 --- a/src/composables/LayoutMain.ts +++ b/src/composables/LayoutMain.ts @@ -9,7 +9,7 @@ import { GraphStyleProperties } from "@metabohub/viz-core/src/types/GraphStylePr // Composable imports import { putDuplicatedSideCompoundAside, reinsertionSideCompounds } from "./LayoutManageSideCompounds"; -import { vizLayout } from "./LayoutSugiyamaForce"; +import { vizLayout } from "./LayoutSugiyama"; import { chooseReversibleReaction, duplicateReversibleReactions } from "./LayoutReversibleReactions"; import { addDirectedCycleToSubgraphNetwork } from "./LayoutFindCycle"; import { BFSWithSources } from "./AlgorithmBFS"; diff --git a/src/composables/LayoutSugiyamaForce.ts b/src/composables/LayoutSugiyama.ts similarity index 100% rename from src/composables/LayoutSugiyamaForce.ts rename to src/composables/LayoutSugiyama.ts diff --git a/src/composables/__tests__/LayoutSugiyama.test.ts b/src/composables/__tests__/LayoutSugiyama.test.ts new file mode 100644 index 0000000000000000000000000000000000000000..0b00a2255d5315148e368ea1bbfaeea8c3386fae --- /dev/null +++ b/src/composables/__tests__/LayoutSugiyama.test.ts @@ -0,0 +1,173 @@ +// Type imports +import { Network } from '@metabohub/viz-core/src/types/Network'; +import { Node } from '@metabohub/viz-core/src/types/Node'; +import { Link } from '@metabohub/viz-core/src/types/Link'; +import { GraphStyleProperties } from '@metabohub/viz-core/src/types/GraphStyleProperties'; +import { SubgraphNetwork } from '../../types/SubgraphNetwork'; + + +// Composable imports +import * as LayoutSugiyama from '../LayoutSugiyama'; +import * as ConvertFromNetwork from '../ConvertFromNetwork'; +import * as ConvertToNetwork from '../ConvertToNetwork'; +import * as CalculateSize from "../CalculateSize"; + + +// General imports +import { instance } from "@viz-js/viz"; +import { JsonViz } from '../../types/FormatJsonViz'; + + + +// MOCK VIZ and DATA for mock + +const jsonViz:JsonViz ={ + directed: true, + objects: [ + { + name: 'node1', + pos: '12.6,12.6', + }, + { + name: 'node2', + pos: '12.6,325.8', + }, + { + name: 'node3', + pos: '12.6,639', + }, + { + name: 'node4', + pos: '12.6,952.2', + }, + { + name: 'node5', + pos: '12.6,1265.4', + } + ], + edges: [] + }; + +const DOT:string=`strict digraph G { + graph [rankdir="BT", newrank="true", compound="true", splines="false", ranksep="4", nodesep="4", dpi="72"] + node1 [height="0.35", width="0.35", fixedsize="true"]; + node2 [height="0.35", width="0.35", fixedsize="true"]; + node3 [height="0.35", width="0.35", fixedsize="true"]; + node4 [height="0.35", width="0.35", fixedsize="true"]; + node5 [height="0.35", width="0.35", fixedsize="true"]; + node1 -> node2; + node2 -> node3; + node3 -> node4; + node4 -> node5; +}`; + +jest.mock('@viz-js/viz', () => ({ + instance: jest.fn( + async() => ({ + renderJSON: jest.fn( + (dot) => { + if (dot === DOT) { + return jsonViz + }else{ + throw new Error('No right input renderJSON'); + } + } + ) + })) +})); + + + +describe('LayoutSugiyama', () => { + + // DATA + + const networkStyle: GraphStyleProperties = {}; + + const nodes:{[key:string]:Node}= { + node1: { id: 'node1', x:1, y:2 }, + node2: { id: 'node2', x:3, y:4 }, + node3: { id: 'node3', x:5, y:6 }, + node4: { id: 'node4', x:7, y:8 }, + node5: { id: 'node5', x:9, y:10 }, + }; + const links:Link[]= [ + { id: 'link', source: nodes.node1 , target:nodes.node2 }, + { id: 'link', source: nodes.node2 , target:nodes.node3 }, + { id: 'link', source: nodes.node3 , target:nodes.node4 }, + { id: 'link', source: nodes.node4 , target:nodes.node5 }, + ] + const network :Network= { + id: 'network', + nodes: nodes, + links: links, + }; + const subgraphNetwork:SubgraphNetwork = { + network: network, + networkStyle: networkStyle, + }; + + const nodesViz:{[key:string]:Node}= { + node1: { id: 'node1', x: 12.6, y: 12.6 }, + node2: { id: 'node2', x: 12.6, y: 325.8 }, + node3: { id: 'node3', x: 12.6, y: 639 }, + node4: { id: 'node4', x: 12.6, y: 952.2 }, + node5: { id: 'node5', x: 12.6, y: 1265.4 } + }; + const linksViz:Link[] = [ + { id: 'link', source: nodesViz.node1 , target:nodesViz.node2 }, + { id: 'link', source: nodesViz.node2 , target:nodesViz.node3 }, + { id: 'link', source: nodesViz.node3 , target:nodesViz.node4 }, + { id: 'link', source: nodesViz.node4 , target:nodesViz.node5 }, + ]; + const networkViz:Network = { + id: 'network', + nodes: nodesViz, + links: linksViz + }; + + + // MOCK + + const getSepAttributesInchesMock = jest.spyOn(CalculateSize, 'getSepAttributesInches'); + getSepAttributesInchesMock.mockReturnValue(Promise.resolve({rankSep: 4, nodeSep: 4})); + + const networkToDOTMock = jest.spyOn(ConvertFromNetwork, 'networkToDOT'); + networkToDOTMock.mockReturnValue(DOT); + + const changeNetworkFromVizMock = jest.spyOn(ConvertToNetwork, 'changeNetworkFromViz'); + changeNetworkFromVizMock.mockImplementation(async(json,subgraphNetwork,assignRank)=>{ + if (JSON.stringify(json) === JSON.stringify(jsonViz)) { + const network = subgraphNetwork.network; + network.nodes.node1.x = 12.6; + network.nodes.node1.y = 12.6; + network.nodes.node2.x = 12.6; + network.nodes.node2.y = 325.8; + network.nodes.node3.x = 12.6; + network.nodes.node3.y = 639; + network.nodes.node4.x = 12.6; + network.nodes.node4.y = 952.2; + network.nodes.node5.x = 12.6; + network.nodes.node5.y = 1265.4; + }else{ + throw new Error('No right input'); + } + return subgraphNetwork; + }); + + + test('vizLayout with default parameters', async () => { + + // TEST + await LayoutSugiyama.vizLayout(subgraphNetwork); + + // EXPECT + expect(getSepAttributesInchesMock).toHaveBeenCalledTimes(1); + expect(networkToDOTMock).toHaveBeenCalledTimes(1); + expect(changeNetworkFromVizMock).toHaveBeenCalledTimes(1); + expect(subgraphNetwork.network).toEqual(networkViz); + + }); + + +}); \ No newline at end of file