feat: Add Storybook configuration and motion tokens implementation

- Introduced Storybook configuration files (`main.ts`, `preview.ts`, `tsconfig.json`) for Angular components.
- Created motion tokens in `motion-tokens.ts` to define durations, easing functions, and transforms.
- Developed a Storybook story for motion tokens showcasing their usage and reduced motion fallback.
- Added SCSS variables for motion durations, easing, and transforms in `_motion.scss`.
- Implemented accessibility smoke tests using Playwright and Axe for automated accessibility checks.
- Created portable and sealed bundle structures with corresponding JSON files for evidence locker.
- Added shell script for verifying notify kit determinism.
This commit is contained in:
StellaOps Bot
2025-12-04 21:36:06 +02:00
parent 600f3a7a3c
commit f214edff82
68 changed files with 1742 additions and 18 deletions

View File

@@ -0,0 +1,44 @@
import { test, expect, Page } from '@playwright/test';
import AxeBuilder from '@axe-core/playwright';
import fs from 'node:fs';
import path from 'node:path';
const shouldFail = process.env.FAIL_ON_A11Y === '1';
const reportDir = path.join(process.cwd(), 'test-results');
async function writeReport(filename: string, data: unknown) {
fs.mkdirSync(reportDir, { recursive: true });
fs.writeFileSync(path.join(reportDir, filename), JSON.stringify(data, null, 2));
}
async function runA11y(url: string, page: Page) {
await page.goto(url);
const results = await new AxeBuilder({ page }).withTags(['wcag2a', 'wcag2aa']).analyze();
const violations = [...results.violations].sort((a, b) => a.id.localeCompare(b.id));
await writeReport(
`a11y-${url.replace(/\\W+/g, '_') || 'home'}.json`,
{ url: page.url(), violations }
);
if (shouldFail) {
expect(violations).toEqual([]);
}
return violations;
}
test.describe('a11y-smoke', () => {
test('home page baseline', async ({ page }, testInfo) => {
const violations = await runA11y('/', page);
testInfo.annotations.push({
type: 'a11y',
description: `${violations.length} violations (set FAIL_ON_A11Y=1 to fail on any)`,
});
});
test('graph explorer shell', async ({ page }, testInfo) => {
const violations = await runA11y('/graph', page);
testInfo.annotations.push({
type: 'a11y',
description: `${violations.length} violations (/graph)`,
});
});
});