@happyvertical/smrt-users 0.53.1 → 0.53.2

package/dist/svelte/components/__tests__/InviteUserModal.test.js

@@ -1,65 +0,0 @@
-// @vitest-environment jsdom
-/**
- * Component coverage for InviteUserModal via the shared S11 harness (#1416).
- */
-import { fireEvent, render, screen, userEvent, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it, vi } from 'vitest';
-import InviteUserModal from '../InviteUserModal.svelte';
-const baseProps = (over = {}) => ({
-    open: true,
-    tenant: { name: 'Acme' },
-    roles: [{ id: 'r1', slug: 'member', name: 'Member' }],
-    onsubmit: vi.fn(),
-    onclose: vi.fn(),
-    ...over,
-});
-describe('InviteUserModal', () => {
-    it('renders the invite dialog scoped to the tenant when open', () => {
-        render(InviteUserModal, { props: baseProps() });
-        expect(screen.getByRole('heading', { name: 'Invite User to Acme' })).toBeInTheDocument();
-        expect(screen.getByLabelText('Email address')).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Send Invite' })).toBeInTheDocument();
-    });
-    it('renders nothing when closed', () => {
-        render(InviteUserModal, { props: baseProps({ open: false }) });
-        expect(screen.queryByRole('dialog')).toBeNull();
-    });
-    it('shows the JS validation error when submitted with no email', async () => {
-        const onsubmit = vi.fn();
-        const { container } = render(InviteUserModal, {
-            props: baseProps({ onsubmit }),
-        });
-        // Submit the form directly to exercise the component's own guard — a button
-        // click would be pre-empted by the input's native `required` constraint.
-        const form = container.querySelector('form');
-        if (!form)
-            throw new Error('form not found');
-        await fireEvent.submit(form);
-        expect(screen.getByText('Email is required')).toBeInTheDocument();
-        expect(onsubmit).not.toHaveBeenCalled();
-    });
-    it('submits the email and default role', async () => {
-        const onsubmit = vi.fn();
-        render(InviteUserModal, { props: baseProps({ onsubmit }) });
-        await userEvent.type(screen.getByLabelText('Email address'), 'ada@example.com');
-        await userEvent.click(screen.getByRole('button', { name: 'Send Invite' }));
-        expect(onsubmit).toHaveBeenCalledWith(expect.objectContaining({ email: 'ada@example.com', roleId: 'r1' }));
-    });
-    it('closes via the Cancel button', async () => {
-        const onclose = vi.fn();
-        render(InviteUserModal, { props: baseProps({ onclose }) });
-        await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
-        expect(onclose).toHaveBeenCalledTimes(1);
-    });
-    // Regression for #1399 blocker #2: the hand-rolled dialog had no focus
-    // trap/restore. Adopting the smrt-ui Modal renders a native <dialog> (top
-    // layer + trap + inert), which supplies the trap and Escape handling the
-    // previous markup lacked.
-    it('renders inside a native <dialog> for the focus trap', () => {
-        const { container } = render(InviteUserModal, { props: baseProps() });
-        const dialog = container.querySelector('dialog');
-        expect(dialog).not.toBeNull();
-        // The form lives inside the dialog, so focus is trapped within it.
-        expect(dialog?.querySelector('form')).not.toBeNull();
-    });
-});

package/dist/svelte/components/__tests__/UserAvatar.test.js

@@ -1,31 +0,0 @@
-// @vitest-environment jsdom
-/**
- * First component test in smrt-users via the shared S11 harness (#1416): the
- * Testing-Library + axe surface comes from `@happyvertical/smrt-vitest` and the
- * jsdom + jest-dom setup from the shared `svelte-setup` wired in vitest.config.
- */
-import { expectNoA11yViolations, render, screen, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it } from 'vitest';
-import UserAvatar from '../UserAvatar.svelte';
-// UserAvatar only reads `profile.name`, so a minimal stub is enough to drive it.
-const profile = { name: 'Ada Lovelace' };
-describe('UserAvatar', () => {
-    it('renders the initials derived from the profile name', () => {
-        render(UserAvatar, { props: { profile } });
-        expect(screen.getByText('AL')).toBeInTheDocument();
-    });
-    it('renders the full name when showName is set', () => {
-        render(UserAvatar, { props: { profile, showName: true } });
-        expect(screen.getByText('Ada Lovelace')).toBeInTheDocument();
-    });
-    it('falls back to "U" initials for a profile with no name', () => {
-        render(UserAvatar, { props: { profile: {} } });
-        expect(screen.getByText('U')).toBeInTheDocument();
-    });
-    it('is axe-clean', async () => {
-        const { container } = render(UserAvatar, {
-            props: { profile, showName: true },
-        });
-        await expectNoA11yViolations(container);
-    });
-});

package/dist/svelte/components/__tests__/UserCard.test.js

@@ -1,39 +0,0 @@
-// @vitest-environment jsdom
-/**
- * Component coverage for UserCard via the shared S11 harness (#1416).
- */
-import { expectNoA11yViolations, render, screen, userEvent, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it, vi } from 'vitest';
-import UserCard from '../UserCard.svelte';
-const baseProps = (over = {}) => ({
-    user: { id: 'u1', email: 'ada@example.com', status: 'active' },
-    profile: { name: 'Ada Lovelace' },
-    role: 'admin',
-    status: 'active',
-    ...over,
-});
-describe('UserCard', () => {
-    it('renders the name, email, role, and status', () => {
-        render(UserCard, { props: baseProps() });
-        expect(screen.getByText('Ada Lovelace')).toBeInTheDocument();
-        expect(screen.getByText('ada@example.com')).toBeInTheDocument();
-        expect(screen.getByText('admin')).toBeInTheDocument();
-        expect(screen.getByText('active')).toBeInTheDocument();
-    });
-    it('invokes onclick when the card is activated', async () => {
-        const onclick = vi.fn();
-        render(UserCard, { props: baseProps({ onclick }) });
-        await userEvent.click(screen.getByRole('button'));
-        expect(onclick).toHaveBeenCalledTimes(1);
-    });
-    it('is a disabled, non-interactive card without an onclick', () => {
-        render(UserCard, { props: baseProps() });
-        expect(screen.getByRole('button')).toBeDisabled();
-    });
-    it('is axe-clean', async () => {
-        const { container } = render(UserCard, {
-            props: baseProps({ onclick: vi.fn() }),
-        });
-        await expectNoA11yViolations(container);
-    });
-});

package/dist/svelte/components/__tests__/UserForm.test.js

@@ -1,50 +0,0 @@
-// @vitest-environment jsdom
-/**
- * Component coverage for UserForm via the shared S11 harness (#1416).
- */
-import { expectNoA11yViolations, render, screen, userEvent, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it, vi } from 'vitest';
-import UserForm from '../UserForm.svelte';
-describe('UserForm', () => {
-    it('renders create-mode fields and a Create button', () => {
-        render(UserForm, { props: { onsubmit: vi.fn() } });
-        expect(screen.getByLabelText('Name')).toBeInTheDocument();
-        expect(screen.getByLabelText('Email')).toBeInTheDocument();
-        expect(screen.getByLabelText('Status')).toBeInTheDocument();
-        expect(screen.getByRole('button', { name: 'Create User' })).toBeInTheDocument();
-    });
-    it('submits the entered name and email', async () => {
-        const onsubmit = vi.fn();
-        render(UserForm, { props: { onsubmit } });
-        await userEvent.type(screen.getByLabelText('Name'), 'Ada Lovelace');
-        await userEvent.type(screen.getByLabelText('Email'), 'ada@example.com');
-        await userEvent.click(screen.getByRole('button', { name: 'Create User' }));
-        expect(onsubmit).toHaveBeenCalledWith(expect.objectContaining({
-            name: 'Ada Lovelace',
-            email: 'ada@example.com',
-        }));
-    });
-    it('locks the email and switches to update mode for an existing user', () => {
-        render(UserForm, {
-            props: {
-                onsubmit: vi.fn(),
-                user: { email: 'ada@example.com', status: 'active' },
-                profile: { name: 'Ada Lovelace' },
-            },
-        });
-        expect(screen.getByLabelText('Email')).toBeDisabled();
-        expect(screen.getByRole('button', { name: 'Update User' })).toBeInTheDocument();
-    });
-    it('invokes oncancel from the Cancel button', async () => {
-        const oncancel = vi.fn();
-        render(UserForm, { props: { onsubmit: vi.fn(), oncancel } });
-        await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
-        expect(oncancel).toHaveBeenCalledTimes(1);
-    });
-    it('is axe-clean', async () => {
-        const { container } = render(UserForm, {
-            props: { onsubmit: vi.fn(), oncancel: vi.fn() },
-        });
-        await expectNoA11yViolations(container);
-    });
-});

package/dist/svelte/components/__tests__/UserList.test.js

@@ -1,48 +0,0 @@
-// @vitest-environment jsdom
-/**
- * Component coverage for UserList via the shared S11 harness (#1416).
- */
-import { expectNoA11yViolations, render, screen, userEvent, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it, vi } from 'vitest';
-import UserList from '../UserList.svelte';
-const users = [
-    {
-        user: { id: 'u1', email: 'ada@example.com', status: 'active' },
-        profile: { name: 'Ada Lovelace' },
-        role: 'admin',
-    },
-    {
-        user: { id: 'u2', email: 'alan@example.com', status: 'pending' },
-        profile: { name: 'Alan Turing' },
-        role: 'member',
-    },
-];
-describe('UserList', () => {
-    it('renders a card per user', () => {
-        render(UserList, { props: { users } });
-        expect(screen.getByText('Ada Lovelace')).toBeInTheDocument();
-        expect(screen.getByText('Alan Turing')).toBeInTheDocument();
-    });
-    it('forwards the selected user through onselect', async () => {
-        const onselect = vi.fn();
-        render(UserList, { props: { users, onselect } });
-        await userEvent.click(screen.getByText('Alan Turing'));
-        expect(onselect).toHaveBeenCalledWith(expect.objectContaining({ id: 'u2' }));
-    });
-    it('shows the empty message when there are no users', () => {
-        render(UserList, {
-            props: { users: [], emptyMessage: 'Nobody here' },
-        });
-        expect(screen.getByText('Nobody here')).toBeInTheDocument();
-    });
-    it('shows a loading state', () => {
-        render(UserList, { props: { users: [], loading: true } });
-        expect(screen.getByText('Loading users...')).toBeInTheDocument();
-    });
-    it('is axe-clean', async () => {
-        const { container } = render(UserList, {
-            props: { users, onselect: vi.fn() },
-        });
-        await expectNoA11yViolations(container);
-    });
-});

package/dist/svelte/components/__tests__/UserMenu.test.js

@@ -1,83 +0,0 @@
-// @vitest-environment jsdom
-/**
- * Component coverage for UserMenu via the shared S11 harness (#1416), plus the
- * S12 a11y remediation (#1417): the open dropdown now has its own id (no longer
- * duplicating the wrapper) and `aria-labelledby` resolves to the trigger, so axe
- * is asserted on both the collapsed and open states.
- */
-import { expectNoA11yViolations, render, screen, userEvent, } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it } from 'vitest';
-import UserMenu from '../UserMenu.svelte';
-describe('UserMenu', () => {
-    it('renders a collapsed trigger labelled with the display name', () => {
-        render(UserMenu, { props: { user: { name: 'Ada Lovelace' } } });
-        const trigger = screen.getByRole('button', { name: 'User menu' });
-        expect(trigger).toHaveAttribute('aria-expanded', 'false');
-        expect(screen.getByText('Ada Lovelace')).toBeInTheDocument();
-        expect(screen.queryByRole('menu')).toBeNull();
-    });
-    it('opens the menu with profile/settings/sign-out items on click', async () => {
-        render(UserMenu, {
-            props: { user: { name: 'Ada Lovelace', email: 'ada@example.com' } },
-        });
-        await userEvent.click(screen.getByRole('button', { name: 'User menu' }));
-        expect(screen.getByRole('menu')).toBeInTheDocument();
-        expect(screen.getByRole('menuitem', { name: 'Profile' })).toBeInTheDocument();
-        expect(screen.getByRole('menuitem', { name: 'Settings' })).toBeInTheDocument();
-        expect(screen.getByRole('menuitem', { name: 'Sign out' })).toBeInTheDocument();
-    });
-    it('is axe-clean while collapsed and when open', async () => {
-        const { container } = render(UserMenu, {
-            props: { user: { name: 'Ada Lovelace', email: 'ada@example.com' } },
-        });
-        await expectNoA11yViolations(container);
-        await userEvent.click(screen.getByRole('button', { name: 'User menu' }));
-        expect(screen.getByRole('menu')).toBeInTheDocument();
-        await expectNoA11yViolations(container);
-    });
-    // Regression for #1399 blocker #1: the menu items were keyboard-unreachable
-    // (role="menu" with no roving tabindex / arrow navigation). These assert the
-    // WAI-ARIA menu-button keyboard contract end to end.
-    const kbProps = {
-        user: { name: 'Ada Lovelace', email: 'ada@example.com' },
-    };
-    it('opens from the trigger and focuses the first item on ArrowDown', async () => {
-        render(UserMenu, { props: kbProps });
-        screen.getByRole('button', { name: 'User menu' }).focus();
-        await userEvent.keyboard('{ArrowDown}');
-        const items = screen.getAllByRole('menuitem');
-        expect(items).toHaveLength(3);
-        expect(document.activeElement).toBe(items[0]);
-    });
-    it('moves roving focus with ArrowDown/ArrowUp and wraps at the ends', async () => {
-        render(UserMenu, { props: kbProps });
-        screen.getByRole('button', { name: 'User menu' }).focus();
-        await userEvent.keyboard('{ArrowDown}');
-        const items = screen.getAllByRole('menuitem');
-        await userEvent.keyboard('{ArrowDown}');
-        expect(document.activeElement).toBe(items[1]);
-        // From the first item, ArrowUp wraps to the last.
-        await userEvent.keyboard('{ArrowUp}{ArrowUp}');
-        expect(document.activeElement).toBe(items[items.length - 1]);
-    });
-    it('jumps to the last item with End and the first with Home', async () => {
-        render(UserMenu, { props: kbProps });
-        screen.getByRole('button', { name: 'User menu' }).focus();
-        await userEvent.keyboard('{ArrowDown}');
-        const items = screen.getAllByRole('menuitem');
-        await userEvent.keyboard('{End}');
-        expect(document.activeElement).toBe(items[items.length - 1]);
-        await userEvent.keyboard('{Home}');
-        expect(document.activeElement).toBe(items[0]);
-    });
-    it('closes on Escape and restores focus to the trigger', async () => {
-        render(UserMenu, { props: kbProps });
-        const trigger = screen.getByRole('button', { name: 'User menu' });
-        trigger.focus();
-        await userEvent.keyboard('{ArrowDown}');
-        expect(screen.queryByRole('menu')).not.toBeNull();
-        await userEvent.keyboard('{Escape}');
-        expect(screen.queryByRole('menu')).toBeNull();
-        expect(document.activeElement).toBe(trigger);
-    });
-});

package/dist/svelte/components/__tests__/UserStatus.test.js

@@ -1,36 +0,0 @@
-import { UserStatus } from '@happyvertical/smrt-types';
-import { render, screen } from '@happyvertical/smrt-vitest/svelte';
-import { describe, expect, it, vi } from 'vitest';
-import UserCard from '../UserCard.svelte';
-import UserForm from '../UserForm.svelte';
-const profile = { name: 'Ada Lovelace', email: 'ada@example.com' };
-const user = { email: 'ada@example.com', status: UserStatus.INACTIVE };
-describe('UserForm status options', () => {
-    it('offers exactly the UserStatus values — including inactive, never deactivated', () => {
-        render(UserForm, { props: { onsubmit: vi.fn() } });
-        const select = screen.getByLabelText('Status', {
-            hidden: true,
-        });
-        const optionValues = Array.from(select.options).map((o) => o.value);
-        expect(optionValues).toEqual(Object.values(UserStatus));
-        expect(optionValues).toContain('inactive');
-        expect(optionValues).not.toContain('deactivated');
-    });
-});
-describe('UserCard status styling', () => {
-    it('styles an inactive user instead of leaving it unstyled', () => {
-        render(UserCard, {
-            props: { user, profile, status: 'inactive' },
-        });
-        const badge = screen.getByText('inactive', { hidden: true });
-        expect(badge.className).toContain('status-disabled');
-    });
-    it('does not recognise the bogus deactivated value', () => {
-        render(UserCard, {
-            props: { user, profile, status: 'deactivated' },
-        });
-        const badge = screen.getByText('deactivated', { hidden: true });
-        // No status-* style class is applied for a non-enum value.
-        expect(badge.className).not.toContain('status-disabled');
-    });
-});