Files
mxpic_EDA/tests/canvas-helpers.test.js
T

545 lines
19 KiB
JavaScript

const assert = require('assert');
const helpers = require('../frontend/canvas-helpers.js');
const handles = helpers.buildPortHandles({
a0: { x: 0, y: 0, a: 180 },
b0: { x: 0, y: 0, a: 0 },
a1: { x: -91.7, y: 4.475, a: 180 },
a2: { x: -91.7, y: -4.475, a: 180 },
b1: { x: 91.7, y: 4.475, a: 0 },
b2: { x: 91.7, y: -4.475, a: 0 },
ep2a: { x: -37.8, y: -20, a: 270 },
ep2b: { x: -37.8, y: 20, a: 90 },
});
assert.deepStrictEqual(handles.map(handle => handle.name), ['a1', 'a2', 'b1', 'b2', 'ep2b', 'ep2a']);
assert.deepStrictEqual(handles.filter(handle => handle.position === 'left').map(handle => handle.name), ['a1', 'a2']);
assert.deepStrictEqual(handles.filter(handle => handle.position === 'right').map(handle => handle.name), ['b1', 'b2']);
assert.deepStrictEqual(handles.find(handle => handle.name === 'ep2b').position, 'top');
assert.deepStrictEqual(handles.find(handle => handle.name === 'ep2a').position, 'bottom');
assert.strictEqual(handles.find(handle => handle.name === 'a1').style.top, '15%');
assert.strictEqual(handles.find(handle => handle.name === 'a2').style.top, '85%');
assert.strictEqual(handles.find(handle => handle.name === 'ep2b').style.left, '50%');
const uniformLeftHandles = helpers.buildPortHandles({
p_top: { x: -10, y: 300, a: 180 },
p_mid: { x: -10, y: 20, a: 180 },
p_bottom: { x: -10, y: -5, a: 180 },
});
assert.deepStrictEqual(
uniformLeftHandles.map(handle => handle.style.top),
['15%', '50%', '85%'],
'ports on the same side should be uniformly spaced after sorting'
);
assert.deepStrictEqual(
helpers.normalizeBoxSize({ box_size: [946, 75] }),
{ width: 946, height: 75 },
'component box size should load from YAML box_size arrays'
);
assert.deepStrictEqual(
helpers.normalizeBoxSize({ box_size: ['946.0', '75.0'] }),
{ width: 946, height: 75 },
'component box size should accept numeric strings from YAML/JSON metadata'
);
assert.deepStrictEqual(
helpers.normalizeBoxSize({ box_sz: { width: 1200, height: 85 } }),
{ width: 1200, height: 85 },
'component box size should also accept box_sz objects'
);
assert.strictEqual(
helpers.PORT_NODE_SIZE,
30,
'Port and Anchor virtual elements should use the same 30 um canvas footprint'
);
assert.deepStrictEqual(
helpers.calculateLayoutBounds({
nodes: [{
position: { x: 100, y: 200 },
data: { componentName: 'rotated_component', boxSize: { width: 50, height: 20 }, rotation: 90 }
}]
}),
{
minX: 80,
minY: 200,
maxX: 100,
maxY: 250,
width: 20,
height: 50,
bottomLeft: { x: 80, y: 200 },
topRight: { x: 100, y: 250 }
},
'layout preview bounds should use component box_size and rotation to find device corners'
);
assert.strictEqual(
helpers.chooseCategoryComponent('generate with mxpic_forge', [
'generate with mxpic_forge',
'EC_SiN400_1310_0p5dB_L935_A0_QY_202604'
], 'edge_couplers'),
'EC_SiN400_1310_0p5dB_L935_A0_QY_202604',
'dropping an EC category should prefer the real PDK component so its YAML box_size is loaded'
);
assert.deepStrictEqual(
helpers.clampPositionToCanvas({ x: 4990, y: 5010 }, { width: 5000, height: 5000 }, { width: 946, height: 75 }),
{ x: 4054, y: 4925 },
'component drag position should keep the full component box inside the canvas boundary'
);
const rulerMeasurement = helpers.createRulerMeasurement({ x: 10, y: 20 }, { x: 40, y: 60 });
assert.deepStrictEqual(
rulerMeasurement,
{
start: { x: 10, y: 20 },
end: { x: 40, y: 60 },
dx: 30,
dy: 40,
distance: 50,
midpoint: { x: 25, y: 40 },
label: '50.000 um dx 30.000 dy 40.000'
},
'ruler measurement should calculate point-to-point distance in canvas um coordinates'
);
assert.strictEqual(
helpers.createRulerMeasurement({ x: 1 }, null),
null,
'ruler measurement should wait until both points are available'
);
assert.deepStrictEqual(
helpers.createComponentSymbolMetrics({ width: 946, height: 75 }),
{ width: 898.7, height: 51 },
'large edge-coupler symbols should scale close to the YAML box width instead of being capped near 300 um'
);
assert.deepStrictEqual(
helpers.createComponentSymbolMetrics({ width: 132, height: 82 }),
{ width: 118.8, height: 55.76 },
'default symbols should still scale proportionally inside normal component boxes'
);
const rotatedHandles = helpers.buildPortHandles({
left_port: { x: -50, y: 0, a: 180 },
top_port: { x: 0, y: 20, a: 90 },
}, { rotation: 180 });
assert.strictEqual(
rotatedHandles.find(handle => handle.name === 'left_port').position,
'right',
'rotating a component should rotate the React Flow handle side'
);
assert.strictEqual(
rotatedHandles.find(handle => handle.name === 'top_port').position,
'bottom',
'rotating a component should rotate vertical port handle sides'
);
const args = helpers.createForgeArguments();
assert(Object.keys(args).length >= 10);
assert.strictEqual(helpers.isForgeComponent('generate with mxpic_forge'), true);
assert.strictEqual(helpers.isBasicComponent('waveguide'), true);
assert.strictEqual(helpers.isBasicComponent('circle'), true);
assert.strictEqual(helpers.isBasicComponent('cricle'), true);
assert.strictEqual(
helpers.buildElementPorts('port').port.a,
0,
'Port objects should default to 0 degree angle'
);
assert.deepStrictEqual(
{
a1: helpers.buildElementPorts('anchor').a1.a,
b1: helpers.buildElementPorts('anchor').b1.a,
},
{ a1: 180, b1: 0 },
'Anchor objects should default to a1 for the left port and b1 for the right port'
);
assert.deepStrictEqual(
{
a1: helpers.buildElementPorts('anchor').a1,
b1: helpers.buildElementPorts('anchor').b1,
},
{
a1: { x: 0, y: -15, a: 180, width: 0.5 },
b1: { x: 0, y: -15, a: 0, width: 0.5 }
},
'Anchor a/b port pairs should share coordinates and keep opposite directions'
);
assert.deepStrictEqual(
helpers.buildBasicComponentPorts('waveguide', { length: 120, width: 0.6 }).b1,
{ x: 120, y: 0, a: 0, width: 0.6, xsection: 'strip', description: 'Optical power output' },
'basic waveguide ports should be generated from editable settings'
);
assert.deepStrictEqual(
helpers.getBasicComponentMetadata('waveguide', { length: 120, width: 0.5 }).box_size,
[120, 4],
'basic waveguide symbol should use a narrow default height'
);
assert.deepStrictEqual(
helpers.getBasicComponentMetadata('90 bend', { radius: 15 }).box_size,
[15, 15],
'90 bend symbol should be square with side length equal to radius'
);
assert.deepStrictEqual(
helpers.getBasicComponentMetadata('180 bend', { radius: 15 }).box_size,
[15, 30],
'180 bend symbol should be one radius wide and two radii tall'
);
assert.deepStrictEqual(
helpers.getBasicComponentMetadata('taper', { length: 80, width1: 0.4, width2: 1.2 }).ports.a1.description,
'Optical power input',
'basic component metadata should include human-readable port descriptions'
);
const yaml = helpers.buildInstanceYaml({
instanceName: 'component_1',
componentName: 'generate with mxpic_forge',
componentPath: 'ignored/path',
position: { x: 12.34, y: -5 },
rotation: 90,
flip: true,
flop: true,
forgeArguments: { function_name: 'mmi1x2', length: 25.5, include_heater: true }
});
assert(yaml.includes('component: generate_with_forge'));
assert(yaml.includes('flip: 1'));
assert(yaml.includes('flop: 1'));
assert(yaml.includes('function_name: "mmi1x2"'));
assert(yaml.includes('length: 25.5'));
assert(yaml.includes('include_heater: true'));
const basicYaml = helpers.buildInstanceYaml({
instanceName: 'wg_1',
componentName: 'waveguide',
componentPath: 'ignored',
position: { x: 0, y: 0 },
rotation: 0,
flip: false,
flop: false,
basicArguments: { length: 88, width: 0.7, xsection: 'strip' }
});
assert(basicYaml.includes('component: waveguide'));
assert(basicYaml.includes('length: 88'));
assert(basicYaml.includes('width: 0.7'));
const projectInstancesYaml = helpers.buildInstancesYaml({
nodes: [
{
id: 'node-1',
type: 'rotatableNode',
position: { x: 10, y: 20 },
data: {
componentDisplayName: 'component_1',
componentName: 'PDK_A',
rotation: 0
}
},
{
id: 'node-2',
type: 'rotatableNode',
position: { x: 30, y: 40 },
data: {
componentDisplayName: 'cell_1',
componentName: 'canvas_1',
type: 'composite',
rotation: 90
}
}
],
resolveComponentPath: name => name === 'PDK_A' ? 'foundry/path/PDK_A' : name
});
assert(projectInstancesYaml.includes('component_1:'));
assert(projectInstancesYaml.includes('component: foundry/path/PDK_A'));
assert(projectInstancesYaml.includes('cell_1:'));
assert(projectInstancesYaml.includes('component: canvas_1'));
const pagePortsYaml = helpers.buildPortsYaml({ x: 50, y: 150, a: 90 });
assert(pagePortsYaml.includes('- name: port'));
assert(pagePortsYaml.includes('x: 50.0'));
assert(pagePortsYaml.includes('y: -150.0'));
assert(pagePortsYaml.includes('angle: 90.0'));
const componentPorts = helpers.buildPageComponentPorts({ x: 12, y: -6, a: 180 });
assert.deepStrictEqual(componentPorts, {
port: { x: 12, y: -6, a: 180, width: 0.5 }
});
const elementNodes = [
{
id: 'port-1',
type: 'portNode',
position: { x: 10, y: 20 },
data: {
componentDisplayName: 'in0',
elementType: 'port',
angle: 180,
width: 0.7,
layer: 'WG_CORE',
description: 'input port'
}
},
{
id: 'anchor-1',
type: 'rotatableNode',
position: { x: 30, y: 40 },
data: {
componentDisplayName: 'anchor_1',
componentName: 'Anchor',
elementType: 'anchor',
rotation: 0
}
},
{
id: 'mmi-1',
type: 'rotatableNode',
position: { x: 50, y: 60 },
data: {
componentDisplayName: 'component_1',
componentName: 'MMI',
rotation: 0
}
}
];
assert.deepStrictEqual(helpers.buildElementPorts('port', { angle: 90, width: 0.8 }), {
port: { x: 0, y: 0, a: 90, width: 0.8 }
});
assert.deepStrictEqual(Object.keys(helpers.buildElementPorts('anchor')), ['a1', 'b1']);
assert.deepStrictEqual(Object.keys(helpers.buildElementPorts('port', { portNumber: 3, pitch: 10 })), ['port_1', 'port_2', 'port_3']);
assert.deepStrictEqual(helpers.buildElementPorts('port', { portNumber: 3, pitch: 10 }).port_1, { x: 0, y: 10, a: 0, width: 0.5 });
assert.deepStrictEqual(helpers.buildElementPorts('port', { portNumber: 3 }).port_1, { x: 0, y: 10, a: 0, width: 0.5 });
assert.deepStrictEqual(Object.keys(helpers.buildElementPorts('anchor', { portNumber: 2, pitch: 12 })), ['a1', 'b1', 'a2', 'b2']);
assert.deepStrictEqual(helpers.buildElementPorts('anchor', { portNumber: 2, pitch: 12 }).b2, { x: 0, y: -21, a: 0, width: 0.5 });
assert.deepStrictEqual(helpers.buildElementPorts('anchor', { portNumber: 2, pitch: 12 }).a2, { x: 0, y: -21, a: 180, width: 0.5 });
assert.deepStrictEqual(
helpers.getNodePortCanvasPoint({
id: 'anchor-rotated',
type: 'anchorNode',
position: { x: 100, y: 200 },
data: {
elementType: 'anchor',
rotation: 90,
portNumber: 1,
pitch: 10,
ports: helpers.buildElementPorts('anchor', { portNumber: 1, pitch: 10 })
}
}, 'a1'),
{ x: 115, y: 200 },
'Anchor port endpoint coordinates should rotate with the anchor body'
);
assert.deepStrictEqual(helpers.buildElementBoxSize({ portNumber: 1 }), { width: 30, height: 30 });
assert.deepStrictEqual(helpers.buildElementBoxSize({ elementType: 'anchor', portNumber: 1 }), { width: 8, height: 30 });
assert.deepStrictEqual(helpers.buildElementBoxSize({ elementType: 'anchor', portNumber: 4, pitch: 10 }), { width: 8, height: 72 });
assert.deepStrictEqual(helpers.buildElementBoxSize({ portNumber: 4, pitch: 10 }), { width: 30, height: 72 });
assert.deepStrictEqual(
helpers.buildPageComponentPorts(null, [{
id: 'port-array',
type: 'portNode',
position: { x: 100, y: 200 },
data: { componentDisplayName: 'array', elementType: 'port', portNumber: 3, pitch: 10, width: 0.6 }
}]),
{
array_1: { x: 100, y: 190, a: 0, width: 0.6 },
array_2: { x: 100, y: 200, a: 0, width: 0.6 },
array_3: { x: 100, y: 210, a: 0, width: 0.6 }
}
);
const canvasPortsYaml = helpers.buildCanvasPortsYaml(elementNodes);
assert(canvasPortsYaml.includes('name: in0'));
assert(canvasPortsYaml.includes('description: "input port"'));
assert(canvasPortsYaml.includes('width: 0.7'));
assert(canvasPortsYaml.includes('y: -20.0'));
const elementsYaml = helpers.buildElementsYaml(elementNodes);
assert(elementsYaml.includes('in0:'));
assert(elementsYaml.includes('type: port'));
assert(elementsYaml.includes('anchor_1:'));
assert(elementsYaml.includes('type: anchor'));
assert(elementsYaml.includes('y: -20.0'));
assert(elementsYaml.includes('port_number: 1'));
assert(elementsYaml.includes('pitch: 10'));
const instancesWithoutElements = helpers.buildInstancesYaml({
nodes: elementNodes,
resolveComponentPath: name => name
});
assert(!instancesWithoutElements.includes('anchor_1:'));
assert(!instancesWithoutElements.includes('in0:'));
assert(instancesWithoutElements.includes('component_1:'));
assert(instancesWithoutElements.includes('y: -60.0'));
const multiPortComponentPorts = helpers.buildPageComponentPorts(null, elementNodes);
assert.deepStrictEqual(multiPortComponentPorts.in0, { x: 10, y: 20, a: 180, width: 0.7 });
const technologyManifest = {
defaults: { xsection: 'strip', width: 0.45, radius: 10, routing_type: 'euler_bend' },
xsections: {
strip: { family: 'optical', default_width: 0.45 },
rib_low: { family: 'optical', default_width: 0.5 },
metal_1: { family: 'electrical', default_width: 5 },
metal_2: { family: 'electrical', default_width: 6 }
},
routing_types: ['euler_bend', 'standard_bend']
};
const routeDefaults = helpers.createRouteSettings(technologyManifest);
assert.deepStrictEqual(routeDefaults, {
xsection: 'strip',
family: 'optical',
width: 0.45,
radius: 10,
routing_type: 'euler_bend',
widthEdited: false
});
const metalRoute = helpers.updateRouteXsection(routeDefaults, 'metal_1', technologyManifest);
assert.strictEqual(metalRoute.family, 'electrical');
assert.strictEqual(metalRoute.width, 5);
const manuallyEditedWidth = helpers.updateRouteField(routeDefaults, 'width', 0.62, technologyManifest);
const changedXsection = helpers.updateRouteXsection(manuallyEditedWidth, 'rib_low', technologyManifest);
assert.strictEqual(changedXsection.width, 0.62);
assert.strictEqual(changedXsection.family, 'optical');
const styledStrip = helpers.routeStyleForSettings({ xsection: 'strip', family: 'optical' }, false);
const styledMetal = helpers.routeStyleForSettings({ xsection: 'metal_1', family: 'electrical' }, true);
assert.notStrictEqual(styledStrip.style.stroke, styledMetal.style.stroke);
assert(styledMetal.style.strokeDasharray, 'electrical routes should use a visibly different line treatment');
assert(styledMetal.style.strokeWidth > styledStrip.style.strokeWidth);
const routeYaml = helpers.buildBundlesYaml({
nodes: [
{ id: 'a', data: { componentDisplayName: 'inst_a' } },
{ id: 'b', data: { componentDisplayName: 'inst_b' } }
],
edges: [{
id: 'edge-a-b',
source: 'a',
target: 'b',
sourceHandle: 'out',
targetHandle: 'in',
data: {
route: { xsection: 'metal_1', family: 'electrical', width: 5, radius: 20, routing_type: 'standard_bend' },
points: [{ x: 0, y: 0 }, { x: 40, y: 20 }]
}
}]
}, technologyManifest);
assert(routeYaml.includes('xsection: metal_1'));
assert(routeYaml.includes('family: electrical'));
assert(routeYaml.includes('radius: 20'));
assert(routeYaml.includes('routing_type: standard_bend'));
assert(routeYaml.includes('points:'));
assert(routeYaml.includes('x: 40.0'));
assert(routeYaml.includes('y: -20.0'));
const anchoredRouteYaml = helpers.buildBundlesYaml({
nodes: [
{
id: 'src-node',
type: 'rotatableNode',
position: { x: 10, y: 20 },
data: {
componentDisplayName: 'src_inst',
boxSize: [100, 40],
ports: { out: { x: -10, y: 0, a: 180 } }
}
},
{
id: 'dst-node',
type: 'rotatableNode',
position: { x: 120, y: 20 },
data: {
componentDisplayName: 'dst_inst',
boxSize: [100, 40],
ports: { in: { x: 10, y: 0, a: 0 } }
}
}
],
edges: [{
id: 'edge-src-dst',
source: 'src-node',
target: 'dst-node',
sourceHandle: 'out',
targetHandle: 'in',
data: {
route: { xsection: 'strip', family: 'optical', width: 0.45, radius: 10, routing_type: 'euler_bend' },
points: [{ x: 0, y: 0 }, { x: 80, y: 0 }, { x: 80, y: 60 }]
}
}]
}, technologyManifest);
assert(anchoredRouteYaml.includes('from: src_inst:out'));
assert(anchoredRouteYaml.includes('to: dst_inst:in'));
assert(anchoredRouteYaml.includes('x: 0.0'));
assert(anchoredRouteYaml.includes('y: -20.0'));
assert(anchoredRouteYaml.includes('x: 130.0'));
const freeRouteYaml = helpers.buildBundlesYaml({
nodes: [],
edges: [{
id: 'route-free-1',
source: '__free_route_route-free-1_start__',
target: '__free_route_route-free-1_end__',
data: {
freeRoute: true,
route: { xsection: 'strip', family: 'optical', width: 0.45, radius: 10, routing_type: 'euler_bend' },
points: [{ x: 10, y: 20 }, { x: 80, y: 20 }, { x: 80, y: 120 }]
}
}]
}, technologyManifest);
assert(freeRouteYaml.includes('id: "route-free-1"'));
assert(!freeRouteYaml.includes('from:'));
assert(!freeRouteYaml.includes('to:'));
assert(freeRouteYaml.includes('points:'));
assert(freeRouteYaml.includes('x: 80.0'));
assert(freeRouteYaml.includes('y: -120.0'));
const edgeA = {
id: 'edge-a-b',
source: 'a',
target: 'b',
data: { route: { family: 'optical' } }
};
const edgeB = {
id: 'edge-c-d',
source: 'c',
target: 'd',
data: { route: { family: 'optical' } }
};
const edgeC = {
id: 'edge-e-f',
source: 'e',
target: 'f',
data: { route: { family: 'electrical' } }
};
const crossingNodes = {
a: { position: { x: 0, y: 0 } },
b: { position: { x: 100, y: 100 } },
c: { position: { x: 0, y: 100 } },
d: { position: { x: 100, y: 0 } },
e: { position: { x: 0, y: 100 } },
f: { position: { x: 100, y: 0 } }
};
edgeA.data.route.xsection = 'strip';
edgeB.data.route.xsection = 'strip';
edgeC.data.route.xsection = 'metal_1';
const edgeD = {
id: 'edge-g-h',
source: 'e',
target: 'f',
data: { route: { xsection: 'rib_low', family: 'optical' } }
};
const edgeE = {
id: 'edge-metal-alias',
source: 'e',
target: 'f',
data: { route: { xsection: 'metal1', family: 'electrical' } }
};
const edgeF = {
id: 'edge-metal-underscore',
source: 'a',
target: 'b',
data: { route: { xsection: 'metal_1', family: 'electrical' } }
};
assert.strictEqual(helpers.findSameTypeRouteCrossing(edgeB, [edgeA], crossingNodes).conflictEdge.id, 'edge-a-b');
assert.strictEqual(helpers.findSameTypeRouteCrossing(edgeC, [edgeA], crossingNodes), null);
assert.strictEqual(helpers.findSameTypeRouteCrossing(edgeD, [edgeA], crossingNodes), null);
assert.strictEqual(helpers.findSameTypeRouteCrossing(edgeE, [edgeF], crossingNodes).conflictEdge.id, 'edge-metal-underscore');
assert.strictEqual(helpers.findSameFamilyRouteCrossing(edgeB, [edgeA], crossingNodes).conflictEdge.id, 'edge-a-b');