weg-shared-layout 0.0.22 → 0.0.23

package/dist/test-utils/axe.js

@@ -0,0 +1,12 @@
+import axe from "axe-core";
+const WCAG_TAGS = ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'];
+const defaultRunOptions = {
+    runOnly: { type: 'tag', values: WCAG_TAGS },
+};
+export async function runAxe(element, options) {
+    return axe.run(element, {
+        ...defaultRunOptions,
+        ...options,
+        runOnly: options?.runOnly ?? defaultRunOptions.runOnly,
+    });
+}

package/dist/test-utils/viewport.js

@@ -0,0 +1,10 @@
+import { page } from "vitest/browser";
+export const DESKTOP_VIEWPORT = { width: 1280, height: 720 };
+export const MOBILE_VIEWPORT = { width: 375, height: 667 };
+export async function setViewport(width, height) {
+    await page.viewport(width, height);
+}
+export async function waitForUpdate() {
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+}

package/dist/types/Users/tan/Documents/code/weg-shared-layout/.stencil/test-utils/axe.d.ts

@@ -0,0 +1,2 @@
+import axe from 'axe-core';
+export declare function runAxe(element: Element, options?: axe.RunOptions): Promise<axe.AxeResults>;

package/dist/types/Users/tan/Documents/code/weg-shared-layout/.stencil/test-utils/viewport.d.ts

@@ -0,0 +1,10 @@
+export declare const DESKTOP_VIEWPORT: {
+    readonly width: 1280;
+    readonly height: 720;
+};
+export declare const MOBILE_VIEWPORT: {
+    readonly width: 375;
+    readonly height: 667;
+};
+export declare function setViewport(width: number, height: number): Promise<void>;
+export declare function waitForUpdate(): Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "weg-shared-layout",
-  "version": "0.0.22",
+  "version": "0.0.23",
   "description": "Shared layout Web Components built with Stencil",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -62,7 +62,8 @@
     "@types/node": "^22.13.5",
     "@vitest/browser-playwright": "^4.0.0",
     "playwright": "^1.52.0",
-    "vitest": "^4.0.0"
+    "vitest": "^4.0.0",
+    "axe-core": "^4.11.4"
   },
   "license": "MIT"
 }

package/dist/collection/components/my-component/my-component.cmp.test.js

@@ -1,27 +0,0 @@
-import { render, h, describe, it, expect } from "@stencil/vitest";
-describe('my-component', () => {
-    it('renders', async () => {
-        const { root } = await render(h("my-component", null));
-        await expect(root).toEqualHtml(`
-      <my-component class="hydrated">
-        <mock:shadow-root>
-          <div>
-            Hello, World! I'm
-          </div>
-        </mock:shadow-root>
-      </my-component>
-    `);
-    });
-    it('renders with values', async () => {
-        const { root } = await render(h("my-component", { first: "Stencil", middle: "'Don't call me a framework'", last: "JS" }));
-        await expect(root).toEqualHtml(`
-      <my-component class="hydrated">
-        <mock:shadow-root>
-          <div>
-            Hello, World! I'm Stencil 'Don't call me a framework' JS
-          </div>
-        </mock:shadow-root>
-      </my-component>
-    `);
-    });
-});

package/dist/collection/components/weg-header/weg-header.cmp.test.js

@@ -1,93 +0,0 @@
-import { render, h, describe, it, expect } from "@stencil/vitest";
-const SAMPLE_HEADER_LAYOUT = {
-    header: {
-        dropdowns: [
-            {
-                label: 'Find a job',
-                items: [{ label: 'Graduates', href: '/search?category=graduates' }],
-            },
-        ],
-        links: [{ label: 'Career advice', href: '/career-advice' }],
-        signIn: { label: 'Sign in', href: '/account/login' },
-        signOut: { label: 'Sign out' },
-    },
-};
-describe('weg-header', () => {
-    it('renders safely when layout is undefined', async () => {
-        const { root } = await render(h("weg-header", null));
-        expect(root).toBeTruthy();
-        const header = root.shadowRoot?.querySelector('.header');
-        expect(header).toBeTruthy();
-    });
-    it('parses JSON string layout prop', async () => {
-        const { root } = await render(h("weg-header", { layout: JSON.stringify(SAMPLE_HEADER_LAYOUT) }));
-        const text = root.shadowRoot?.textContent ?? '';
-        expect(text).toContain('Find a job');
-        expect(text).toContain('Career advice');
-        expect(text).toContain('Sign in');
-    });
-    it('renders dropdown labels and flat links from layout object', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT }));
-        const text = root.shadowRoot?.textContent ?? '';
-        expect(text).toContain('Find a job');
-        expect(text).toContain('Career advice');
-    });
-    it('shows signed-in navigation when signed-in is true', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT, "signed-in": true, "user-name": "Alex" }));
-        const text = root.shadowRoot?.textContent ?? '';
-        expect(text).toContain('Find a job');
-        expect(text).toContain('Dashboard');
-        expect(text).toContain('Alex');
-        expect(text).toContain('Sign out');
-        expect(text).not.toContain('Sign in');
-        expect(text).not.toContain('Career advice');
-    });
-    it('emits wegAuthClick when auth control is clicked', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT }));
-        let detail;
-        root.addEventListener('wegAuthClick', ((event) => {
-            detail = event.detail;
-            event.preventDefault();
-        }));
-        const authLink = root.shadowRoot?.querySelector('.desktop .sign-in-link');
-        expect(authLink).toBeTruthy();
-        authLink?.click();
-        expect(detail).toEqual({ action: 'sign-in' });
-    });
-    it('emits sign-out action when signed in', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT, "signed-in": true }));
-        let detail;
-        root.addEventListener('wegAuthClick', ((event) => {
-            detail = event.detail;
-            event.preventDefault();
-        }));
-        const signOutLink = root.shadowRoot?.querySelector('.desktop .sign-out-link');
-        expect(signOutLink).toBeTruthy();
-        signOutLink?.click();
-        expect(detail).toEqual({ action: 'sign-out' });
-    });
-    it('opens desktop dropdown on trigger focus with accessible wiring', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT }));
-        const trigger = root.shadowRoot?.querySelector('.dropdown-trigger');
-        expect(trigger).toBeTruthy();
-        expect(trigger?.getAttribute('aria-haspopup')).toBe('true');
-        expect(trigger?.getAttribute('aria-expanded')).toBe('false');
-        expect(trigger?.getAttribute('aria-controls')).toBeTruthy();
-        trigger?.focus();
-        await new Promise((r) => setTimeout(r, 0));
-        expect(trigger?.getAttribute('aria-expanded')).toBe('true');
-        expect(root.shadowRoot?.querySelector('.dropdown-panel')).toBeTruthy();
-    });
-    it('toggles mobile accordion aria-expanded', async () => {
-        const { root } = await render(h("weg-header", { layout: SAMPLE_HEADER_LAYOUT }));
-        const openButton = root.shadowRoot?.querySelector('.mobile .icon-button');
-        expect(openButton).toBeTruthy();
-        openButton?.click();
-        await new Promise((r) => setTimeout(r, 0));
-        const accordionButton = root.shadowRoot?.querySelector('.mobile-nav__row');
-        expect(accordionButton?.getAttribute('aria-expanded')).toBe('false');
-        accordionButton?.click();
-        await new Promise((r) => setTimeout(r, 0));
-        expect(accordionButton?.getAttribute('aria-expanded')).toBe('true');
-    });
-});

package/dist/collection/utils/layout.unit.test.js

@@ -1,36 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { parseJsonProp, isNonEmptyString, normalizeLinks } from "./layout";
-describe('parseJsonProp', () => {
-    it('returns non-string values unchanged', () => {
-        expect(parseJsonProp({ header: {} })).toEqual({ header: {} });
-    });
-    it('parses JSON strings', () => {
-        expect(parseJsonProp('{"footer":{}}')).toEqual({ footer: {} });
-    });
-    it('returns undefined for invalid or empty strings', () => {
-        expect(parseJsonProp('')).toBeUndefined();
-        expect(parseJsonProp('not json')).toBeUndefined();
-    });
-});
-describe('isNonEmptyString', () => {
-    it('accepts trimmed non-empty strings', () => {
-        expect(isNonEmptyString(' hello ')).toBe(true);
-    });
-    it('rejects empty or non-string values', () => {
-        expect(isNonEmptyString('   ')).toBe(false);
-        expect(isNonEmptyString(null)).toBe(false);
-    });
-});
-describe('normalizeLinks', () => {
-    it('filters invalid entries and trims valid links', () => {
-        expect(normalizeLinks([
-            { label: ' About ', href: ' /about ' },
-            { label: '', href: '/x' },
-            { label: 'Missing href' },
-            null,
-        ])).toEqual([{ label: 'About', href: '/about' }]);
-    });
-    it('returns an empty array for non-arrays', () => {
-        expect(normalizeLinks(undefined)).toEqual([]);
-    });
-});

package/dist/collection/utils/utils.unit.test.js

@@ -1,16 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { format } from "./utils";
-describe('format', () => {
-    it('returns empty string for no names defined', () => {
-        expect(format(undefined, undefined, undefined)).toEqual('');
-    });
-    it('formats just first names', () => {
-        expect(format('Joseph', undefined, undefined)).toEqual('Joseph');
-    });
-    it('formats first and last names', () => {
-        expect(format('Joseph', undefined, 'Publique')).toEqual('Joseph Publique');
-    });
-    it('formats first, middle and last names', () => {
-        expect(format('Joseph', 'Quincy', 'Publique')).toEqual('Joseph Quincy Publique');
-    });
-});

package/dist/types/components/my-component/my-component.cmp.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/components/weg-header/weg-header.cmp.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/utils/layout.unit.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/utils/utils.unit.test.d.ts

@@ -1 +0,0 @@
-export {};