- Added a new Archify skill, enabling users to create polished architecture, workflow, sequence, data-flow, and lifecycle diagrams. - Implemented comprehensive functionality including rendering, validation, and delivery of diagrams in various formats. - Integrated a user-friendly command-line interface for generating and previewing diagrams. - Developed supporting files including package.json, LICENSE, and SKILL.md for documentation and licensing. - Added unit tests to ensure reliability and functionality of the new skill. These changes enhance the application by providing a structured approach to visualizing system architecture and workflows, improving user experience and data representation.
59 lines
2.7 KiB
JavaScript
59 lines
2.7 KiB
JavaScript
import { test } from 'node:test';
|
|
import assert from 'node:assert/strict';
|
|
import { execFileSync } from 'node:child_process';
|
|
import fs from 'node:fs';
|
|
import os from 'node:os';
|
|
import path from 'node:path';
|
|
import { fileURLToPath } from 'node:url';
|
|
|
|
import { findChrome, runVisualCheck } from '../bin/visual-check.mjs';
|
|
import { DESKTOP_READABILITY_VIEWPORT, MIN_PROJECTED_NODE_TEXT_PX } from '../renderers/shared/desktop-readability.mjs';
|
|
|
|
const __dirname = path.dirname(fileURLToPath(import.meta.url));
|
|
const skillRoot = path.resolve(__dirname, '..');
|
|
const chromePath = process.env.ARCHIFY_CHROME ? findChrome() : null;
|
|
|
|
test('production showcase is readable in the real 1440 by 900 adaptive reader', {
|
|
skip: chromePath ? false : 'Set ARCHIFY_CHROME to run the real browser regression.',
|
|
}, async () => {
|
|
const tmp = fs.mkdtempSync(path.join(os.tmpdir(), 'archify-desktop-reader-'));
|
|
const artifact = path.join(tmp, 'production-deployment.html');
|
|
try {
|
|
execFileSync(process.execPath, [
|
|
path.join(skillRoot, 'bin', 'archify.mjs'),
|
|
'render',
|
|
'architecture',
|
|
path.join(skillRoot, 'examples', 'production-deployment.architecture.json'),
|
|
artifact,
|
|
'--quality',
|
|
'showcase',
|
|
], { cwd: skillRoot, encoding: 'utf8' });
|
|
|
|
for (let attempt = 1; attempt <= 3; attempt += 1) {
|
|
const result = await runVisualCheck({ artifactPath: artifact, chromePath });
|
|
assert.equal(result.exitCode, 0, `attempt ${attempt}: ${JSON.stringify(result.receipt, null, 2)}`);
|
|
assert.equal(result.receipt.readability.status, 'pass', `attempt ${attempt}: ${JSON.stringify(result.receipt, null, 2)}`);
|
|
const desktop = result.receipt.readability.viewports.find(({ width, height }) => (
|
|
width === DESKTOP_READABILITY_VIEWPORT.width && height === DESKTOP_READABILITY_VIEWPORT.height
|
|
));
|
|
const darkDesktop = result.receipt.captures.screenshots.find(({ width, height, theme }) => (
|
|
width === DESKTOP_READABILITY_VIEWPORT.width
|
|
&& height === DESKTOP_READABILITY_VIEWPORT.height
|
|
&& theme === 'dark'
|
|
));
|
|
for (const observation of [desktop, darkDesktop]) {
|
|
assert.ok(observation);
|
|
assert.equal(observation.readerWidth, 960);
|
|
assert.equal(observation.diagramWidth, 930);
|
|
assert.ok(observation.minimumProjectedNodeTextPx >= MIN_PROJECTED_NODE_TEXT_PX);
|
|
assert.equal(observation.minimumProjectedNodeTextDetail, 'boundary');
|
|
assert.equal(observation.minimumProjectedNodeText, 'AWS eu-west-1 / disaster recovery');
|
|
assert.equal(observation.readabilityOk, true);
|
|
assert.equal(observation.scrollHeight, DESKTOP_READABILITY_VIEWPORT.height);
|
|
}
|
|
}
|
|
} finally {
|
|
fs.rmSync(tmp, { recursive: true, force: true });
|
|
}
|
|
});
|