root-at-skic
97b3b5f685
3D view: a "3D" menu beside Export switches the diagram to a three.js scene built from the live Archify SVG. Nodes become blocks topped with the node as Archify draws it, relationships become lit pipes along Archify's routes, and the canvas, frames, lanes and legend form the floor. Clicks and hover go to the SVG nodes, so focus, the Semantic Passport and the intent trace work as in 2D; Archify's own animations (trace, node pulse, passport/path/lens flows) are mirrored live. The menu also offers flat or stacked levels, reset view and a top view; Export gains "3D view" (PNG). Trackpad scrolling pans, pinch and the mouse wheel zoom, and the zoom buttons work beyond the 2D limits. The scene draws only when something moves. New setting archify.defaultView. Source: src/ is split by job (commands, views, webview, archify, sources, language, util, viewer3d); behaviour unchanged.
64 lines
2.8 KiB
TypeScript
64 lines
2.8 KiB
TypeScript
import assert from 'node:assert/strict';
|
|
import { test } from 'node:test';
|
|
import { prepareDiagramHtml } from '../src/webview/page';
|
|
|
|
const page = `<!DOCTYPE html><html><head>
|
|
<meta http-equiv="Content-Security-Policy" content="default-src *">
|
|
<script>var a = 1;</script>
|
|
<script id="data" type="application/json">{"x":1}</script>
|
|
</head><body><script>var b = 2;</script></body></html>`;
|
|
|
|
test('adds one CSP and nonces every inline script', () => {
|
|
const html = prepareDiagramHtml(page, { cspSource: 'vscode-resource:', nonce: 'N0NCE', theme: 'light' });
|
|
const csps = html.match(/Content-Security-Policy/g) ?? [];
|
|
assert.equal(csps.length, 1);
|
|
assert.match(html, /script-src vscode-resource: ('|')nonce-N0NCE/);
|
|
const scripts = html.match(/<script\b[^>]*>/g) ?? [];
|
|
assert.equal(scripts.length, 4, 'bridge plus the three page scripts');
|
|
for (const tag of scripts) assert.match(tag, /nonce="N0NCE"/);
|
|
});
|
|
|
|
test('bridge runs before the page scripts and pins the theme', () => {
|
|
const html = prepareDiagramHtml(page, { cspSource: 'x', nonce: 'n', theme: 'dark', hash: '#focus=api' });
|
|
const bridge = html.indexOf('acquireVsCodeApi');
|
|
assert.ok(bridge > 0 && bridge < html.indexOf('var a = 1'));
|
|
assert.match(html, /"theme":"dark"/);
|
|
assert.match(html, /"hash":"#focus=api"/);
|
|
});
|
|
|
|
test('embedded config cannot close the script element', () => {
|
|
const html = prepareDiagramHtml(page, {
|
|
cspSource: 'x',
|
|
nonce: 'n',
|
|
theme: undefined,
|
|
notice: { kind: 'warning', text: '</script><script>alert(1)</script>' },
|
|
});
|
|
assert.ok(!html.includes('</script><script>alert(1)'));
|
|
});
|
|
|
|
test('adds the 3D viewer script after the page and before </head>, under the nonce', () => {
|
|
const html = prepareDiagramHtml(page, {
|
|
cspSource: 'x',
|
|
nonce: 'n',
|
|
theme: 'dark',
|
|
viewer3d: { scriptUri: 'https://file+.vscode-resource/ext/dist/viewer3d.js', defaultView: '3d' },
|
|
});
|
|
const tag = /<script nonce="n" defer src="([^"]+)"><\/script>/.exec(html);
|
|
assert.ok(tag, 'deferred script tag with the nonce');
|
|
assert.equal(tag[1], 'https://file+.vscode-resource/ext/dist/viewer3d.js');
|
|
assert.ok(tag.index < html.indexOf('</head>'));
|
|
assert.match(html, /"defaultView":"3d"/);
|
|
assert.match(html, /window\.__archifyHost = /);
|
|
});
|
|
|
|
test('pages without the 3D option get no viewer script', () => {
|
|
const html = prepareDiagramHtml(page, { cspSource: 'x', nonce: 'n', theme: 'dark' });
|
|
assert.ok(!html.includes('viewer3d.js'));
|
|
assert.ok(!html.includes('"defaultView":"'));
|
|
});
|
|
|
|
test('saved view state is merged, not replaced, when the hash changes', () => {
|
|
const html = prepareDiagramHtml(page, { cspSource: 'x', nonce: 'n', theme: 'dark', state: { uri: 'file:///a.archify' } });
|
|
assert.match(html, /vscode\.setState\(Object\.assign\(\{\}, vscode\.getState\(\) \|\| \{\}, config\.state, \{ hash: location\.hash \}\)\)/);
|
|
});
|