@aurorajs.dev/catalyst-cli 1.0.2 → 2.0.0

package/dist/templates/frontend/packages/iam/src/app/domains/admin/apps/iam/account/features/account-form.component.spec.ts

@@ -0,0 +1,914 @@
+import '@angular/compiler';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslocoTestingModule } from '@jsverse/transloco';
+// TestBed.tick() flushes Angular's zoneless scheduler (effects, computed); no zone required.
+import {
+  IamAccountTypeEnum,
+  type IamAccount,
+  type IamTenant,
+  type OAuthClient,
+} from '@src/src/app/aurora.types';
+import { Apollo } from 'apollo-angular';
+import { of } from 'rxjs';
+import { AccountFormComponent } from './account-form.component';
+
+// ---------------------------------------------------------------------------
+// Apollo mocks
+// ---------------------------------------------------------------------------
+
+function makeApolloAvailableMock() {
+  return {
+    query: () =>
+      of({
+        data: {
+          iamCheckUniqueEmailAccount: true,
+          iamCheckUniqueUsernameAccount: true,
+        },
+      }),
+  };
+}
+
+/**
+ * Faithful duplicate mock: every value is "taken" (not unique) UNLESS it appears in the
+ * query's avoid list — mirroring the backend's avoid-list semantics. This lets the edit-mode
+ * test prove the avoid-list works: the OWN value (in avoidEmails) comes back available, a
+ * DIFFERENT value (not in the list) comes back duplicate. A dumb always-false mock could not
+ * distinguish those two and would make the avoid-list assertion tautological.
+ */
+function makeApolloDuplicateMock() {
+  return {
+    query: (options: {
+      variables?: {
+        email?: string;
+        username?: string;
+        avoidEmails?: string[];
+        avoidUsernames?: string[];
+      };
+    }) => {
+      const vars = options?.variables ?? {};
+      const emailAvoided = (vars.avoidEmails ?? []).includes(vars.email ?? '');
+      const usernameAvoided = (vars.avoidUsernames ?? []).includes(vars.username ?? '');
+      return of({
+        data: {
+          // "available" (true) only when the value is in its avoid list; otherwise duplicate.
+          iamCheckUniqueEmailAccount: emailAvoided,
+          iamCheckUniqueUsernameAccount: usernameAvoided,
+        },
+      });
+    },
+  };
+}
+
+// ---------------------------------------------------------------------------
+// Helpers — drive form state via the Signal Forms FieldState API
+// ---------------------------------------------------------------------------
+
+/**
+ * Sets a field value through its `FieldState.value` signal.
+ * Signal Forms `FieldTree` objects are callable: invoking them returns the `FieldState`.
+ * This helper accepts a function that returns a `FieldTree` (e.g. `() => signalForm.type`).
+ * It then calls `getFieldTree()()` — outer () unwraps the arrow fn, inner () invokes the FieldTree.
+ * Usage: `setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE)`
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function setField(getFieldTree: () => any, value: unknown): void {
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+  getFieldTree()().value.set(value);
+}
+
+/**
+ * Flushes Angular's zoneless scheduler and lets the async (rxResource-backed) uniqueness
+ * validators resolve: a tick to schedule, a microtask to let the synchronous mock Observable
+ * emit, then a second tick to settle the resulting field state. `TestBed.tick()` is a valid
+ * Angular 22 zoneless API. Needed after setting email/username (their validateAsync leaves the
+ * field PENDING until flushed) and before evaluating errors() or calling submit() — the form
+ * uses `ignoreValidators: 'none'`, so submit() blocks while any validator is still pending.
+ */
+async function settleAsyncValidators(): Promise<void> {
+  TestBed.tick();
+  await Promise.resolve();
+  TestBed.tick();
+}
+
+/**
+ * Drives a valid submit through the form, accounting for two interacting realities:
+ *
+ * 1. `submit()` uses `ignoreValidators: 'none'` (FIX 4), so it refuses to run while any async
+ *    uniqueness validator is still PENDING — we must settle them first.
+ * 2. The model is a `linkedSignal` derived from `initial()`; a scheduler tick recomputes it and
+ *    DISCARDS direct field writes made via `setField` (writes from `model.update` in effects
+ *    survive, plain field writes do not). So the settle tick wipes the fields we just set.
+ *
+ * The reconciling sequence: apply fields → settle (resolves async, discards writes) → RE-APPLY
+ * the same fields (values unchanged, so the now-cached async result stays resolved, not pending)
+ * → submit → settle so the async submit action emits. This reflects the real runtime ordering
+ * without papering over the linkedSignal fragility, which is out of scope for these fixes.
+ */
+async function submitWithFields(
+  component: AccountFormComponent,
+  applyFields: () => void,
+): Promise<void> {
+  applyFields();
+  await settleAsyncValidators();
+  applyFields();
+  component.submit();
+  await settleAsyncValidators();
+}
+
+// ---------------------------------------------------------------------------
+// Setup
+// ---------------------------------------------------------------------------
+
+/**
+ * Signal Forms account form regression suite.
+ *
+ * Mirrors `o-auth/scope/features/scope-form.component.spec.ts` for TestBed setup.
+ * Most tests exercise only the model/schema (no `detectChanges`). The "Edit-mode type
+ * lock" suite is the exception: it renders the template, because the lock's correctness
+ * depends on whether the DOM control forwarding actually reaches the rendered `<button>`
+ * — a schema-only assertion cannot see that.
+ *
+ * Note: `fakeAsync`/`tick` are NOT available in this Vitest + zoneless environment.
+ * Async validator tests rely on synchronous Observable execution from the mock.
+ * Submit is tested synchronously (the `submit()` callback fires synchronously when
+ * all SF validators are satisfied and no async validators are pending).
+ *
+ * Field access: `signalForm.field().errors()`, `signalForm.field().value.set(v)`.
+ * Nested fields: `signalForm.user.name().errors()`.
+ */
+describe('AccountFormComponent (Signal Forms)', () => {
+  let fixture: ComponentFixture<AccountFormComponent>;
+  let component: AccountFormComponent;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        AccountFormComponent,
+        TranslocoTestingModule.forRoot({
+          langs: { en: {}, es: {} },
+          translocoConfig: { defaultLang: 'en' },
+        }),
+      ],
+      providers: [{ provide: Apollo, useValue: makeApolloAvailableMock() }],
+    });
+    fixture = TestBed.createComponent(AccountFormComponent);
+    component = fixture.componentInstance;
+    fixture.componentRef.setInput('mode', 'new');
+  });
+
+  // ─── Type selection ──────────────────────────────────────────────────────
+
+  describe('Type selection — required', () => {
+    it('starts invalid: type is required when empty', () => {
+      const typeErrors = component.signalForm.type().errors();
+      expect(typeErrors.some((e) => e.kind === 'required')).toBe(true);
+      expect(component.signalForm.type().invalid()).toBe(true);
+    });
+
+    it('becomes valid once type is selected', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      setField(() => component.signalForm.username, 'svc-user');
+      expect(component.signalForm.type().errors()).toHaveLength(0);
+    });
+  });
+
+  // ─── Edit-mode type lock (D3) ────────────────────────────────────────────
+
+  describe('Edit-mode type lock', () => {
+    /**
+     * Renders the template with the given mode (and, for edit, a minimal `initial`) and
+     * flushes the zoneless scheduler so the rendered `<button id="type">` reflects the
+     * schema's lock. This is the ONLY way to catch the real bug: `hlm-select` is a custom
+     * (non-native) control, so Signal Forms routes schema flags through
+     * `host.setInputOnDirectives(...)` — a flag only reaches the DOM if some directive on
+     * the host element actually declares an input with that exact name. A schema-only
+     * assertion (`signalForm.type().disabled()`) would stay green even if the forwarding
+     * were broken, because it never touches the DOM.
+     */
+    async function renderInMode(mode: 'new' | 'edit'): Promise<void> {
+      fixture.componentRef.setInput('mode', mode);
+      if (mode === 'edit') {
+        fixture.componentRef.setInput('initial', {
+          id: 'acc-1',
+          type: IamAccountTypeEnum.USER,
+          username: 'jdoe',
+          email: 'j@example.com',
+          tenants: [{ id: 'tenant-1' }],
+        } as unknown as IamAccount);
+      }
+      fixture.detectChanges();
+      await fixture.whenStable();
+    }
+
+    it('disables the rendered type <button> in edit mode', async () => {
+      await renderInMode('edit');
+      const nativeElement = fixture.nativeElement as HTMLElement;
+      const typeButton: HTMLButtonElement | null = nativeElement.querySelector('#type');
+      expect(typeButton).not.toBeNull();
+      expect(typeButton?.disabled).toBe(true);
+    });
+
+    it('leaves the rendered type <button> enabled in new mode', async () => {
+      await renderInMode('new');
+      const nativeElement = fixture.nativeElement as HTMLElement;
+      const typeButton: HTMLButtonElement | null = nativeElement.querySelector('#type');
+      expect(typeButton).not.toBeNull();
+      expect(typeButton?.disabled).toBe(false);
+    });
+
+    it('builds the form without NG0950 when `mode` is not yet bound (eager lock safety)', () => {
+      // The edit-mode lock is EAGER structural logic: its `when` predicate reads
+      // `mode()` while the form is constructed, before inputs bind. Regression
+      // guard — if `mode` were reverted to `input.required`, reading the field
+      // here throws NG0950 and the form renders blank in the browser.
+      const fresh = TestBed.createComponent(AccountFormComponent);
+      expect(() => fresh.componentInstance.signalForm.type().disabled()).not.toThrow();
+      expect(fresh.componentInstance.signalForm.type().disabled()).toBe(false);
+    });
+
+    it('edit-mode submit still carries the original type in the emitted payload', async () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-edit',
+        type: IamAccountTypeEnum.SERVICE,
+        username: 'svc',
+        email: '',
+        tenants: [{ id: 'tenant-1' }],
+        clientId: 'client-1',
+      } as unknown as IamAccount);
+
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      // submit() now gates on valid() (ignoreValidators: 'none'); settle any pending async
+      // uniqueness before and after so the action fires.
+      await settleAsyncValidators();
+      component.submit();
+      await settleAsyncValidators();
+
+      expect(emitted).toHaveLength(1);
+      expect(emitted[0].type).toBe(IamAccountTypeEnum.SERVICE);
+    });
+  });
+
+  // ─── Conditional client selector ────────────────────────────────────────
+
+  describe('Client selector visibility', () => {
+    it('is hidden in edit mode', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      expect(component.showClientSelector()).toBe(false);
+    });
+
+    it('is hidden in new mode when only one client matches the selected type', () => {
+      fixture.componentRef.setInput('mode', 'new');
+      fixture.componentRef.setInput('clientOptions', [
+        { id: 'c1', grantType: 'PASSWORD', name: 'Client 1' } as OAuthClient,
+      ]);
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+      expect(component.showClientSelector()).toBe(false);
+    });
+
+    it('is shown in new mode when multiple clients match the selected type', () => {
+      fixture.componentRef.setInput('mode', 'new');
+      fixture.componentRef.setInput('clientOptions', [
+        { id: 'c1', grantType: 'PASSWORD', name: 'Client 1' } as OAuthClient,
+        { id: 'c2', grantType: 'PASSWORD', name: 'Client 2' } as OAuthClient,
+      ]);
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+      expect(component.showClientSelector()).toBe(true);
+    });
+  });
+
+  // ─── Single tenant auto-select ──────────────────────────────────────────
+
+  describe('Tenant auto-select', () => {
+    it('pre-selects the only tenant when there is exactly one option in new mode', () => {
+      fixture.componentRef.setInput('mode', 'new');
+      fixture.componentRef.setInput('tenantOptions', [
+        { id: 'tenant-only', name: 'Main Tenant' } as IamTenant,
+      ]);
+
+      // Flush Angular's scheduler so the `effect()` in the constructor runs.
+      // TestBed.tick() processes pending effects without requiring zone.js.
+      TestBed.tick();
+
+      const tenantIds = component.signalForm.tenantIds().value();
+      expect(tenantIds).toEqual(['tenant-only']);
+    });
+  });
+
+  // ─── hasAddChildTenants hydration ────────────────────────────────────────
+
+  /**
+   * `hasAddChildTenants` is now a PERSISTED account property (the backend recomputes
+   * `dTenants` from it at every token issuance), not a transient per-request instruction.
+   * The edit form must hydrate it from the loaded account, or every save silently turns
+   * descendant-tenant access off.
+   */
+  describe('hasAddChildTenants hydration', () => {
+    it('hydrates true from the loaded account in edit mode', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-1',
+        type: IamAccountTypeEnum.USER,
+        username: 'jdoe',
+        email: 'j@example.com',
+        tenants: [{ id: 'tenant-1' }],
+        hasAddChildTenants: true,
+      } as unknown as IamAccount);
+
+      expect(component.signalForm.hasAddChildTenants().value()).toBe(true);
+    });
+
+    it('defaults to false in new mode with no initial value', () => {
+      expect(component.signalForm.hasAddChildTenants().value()).toBe(false);
+    });
+  });
+
+  // ─── Username requirement per type ──────────────────────────────────────
+
+  describe('Username requirement', () => {
+    it('is required when type is SERVICE', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      const errors = component.signalForm.username().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('is required when type is USER', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+      const errors = component.signalForm.username().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('clears the required error once a value is provided', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      setField(() => component.signalForm.username, 'my-service');
+      const errors = component.signalForm.username().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(false);
+    });
+  });
+
+  // ─── Tenant required when multiple options ──────────────────────────────
+
+  describe('Tenant validation', () => {
+    it('requires at least one tenant when multiple options exist', () => {
+      fixture.componentRef.setInput('tenantOptions', [
+        { id: 't1', name: 'T1' } as IamTenant,
+        { id: 't2', name: 'T2' } as IamTenant,
+      ]);
+      const errors = component.signalForm.tenantIds().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+  });
+
+  // ─── Password validators (type=USER, mode=new) ──────────────────────────
+
+  describe('Password validators', () => {
+    beforeEach(() => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+    });
+
+    it('requires password for new USER account', () => {
+      const errors = component.signalForm.user.password().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('does NOT require password for SERVICE account', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      const errors = component.signalForm.user.password().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(false);
+    });
+
+    it('rejects a weak password with a passwordRule error', () => {
+      setField(() => component.signalForm.user.password, 'weakpassword');
+      const errors = component.signalForm.user.password().errors();
+      expect(errors.some((e) => e.kind === 'passwordRule')).toBe(true);
+    });
+
+    it('accepts a strong password with all rules satisfied', () => {
+      setField(() => component.signalForm.user.password, 'Strong!Pass1');
+      const errors = component.signalForm.user.password().errors();
+      expect(errors.some((e) => e.kind === 'passwordRule')).toBe(false);
+    });
+
+    it('rejects mismatched repeatPassword with a matchOther error', () => {
+      setField(() => component.signalForm.user.password, 'Strong!Pass1');
+      setField(() => component.signalForm.user.repeatPassword, 'Different!Pass2');
+      const errors = component.signalForm.user.repeatPassword().errors();
+      expect(errors.some((e) => e.kind === 'matchOther')).toBe(true);
+    });
+
+    it('accepts matching repeatPassword with no matchOther error', () => {
+      setField(() => component.signalForm.user.password, 'Strong!Pass1');
+      setField(() => component.signalForm.user.repeatPassword, 'Strong!Pass1');
+      const errors = component.signalForm.user.repeatPassword().errors();
+      expect(errors.some((e) => e.kind === 'matchOther')).toBe(false);
+    });
+  });
+
+  // ─── Generate password (aurora-password-input integration) ─────────────────
+
+  describe('onGeneratePassword — password/repeatPassword sync', () => {
+    /**
+     * When the user clicks the generate button inside <aurora-password-input>,
+     * the component writes the new value into signalForm.user.password and emits
+     * `(generated)`. The host handler receives the generated string and must mirror
+     * it into repeatPassword so the confirm field stays in sync.
+     *
+     * Non-tautology: if the handler were removed (or failed to update repeatPassword),
+     * the matchOther validator would raise an error because password !== repeatPassword.
+     */
+    type GenerateProbe = { onGeneratePassword: (v: string) => void };
+
+    it('calling onGeneratePassword mirrors the value into both password and repeatPassword', () => {
+      const probe = component as unknown as GenerateProbe;
+
+      // Simulate what <aurora-password-input> does internally before emitting (generated):
+      // it writes the new password into the Signal Forms field.
+      setField(() => component.signalForm.user.password, 'Strong!Gen1');
+
+      // Now call the host handler with the same generated string.
+      probe.onGeneratePassword('Strong!Gen1');
+
+      // Both model fields must hold the generated value.
+      expect(component.signalForm.user.password().value()).toBe('Strong!Gen1');
+      expect(component.signalForm.user.repeatPassword().value()).toBe('Strong!Gen1');
+    });
+
+    it('password === repeatPassword after generate — no matchOther error', () => {
+      const probe = component as unknown as GenerateProbe;
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+
+      setField(() => component.signalForm.user.password, 'Strong!Gen1');
+      probe.onGeneratePassword('Strong!Gen1');
+
+      const errors = component.signalForm.user.repeatPassword().errors();
+      expect(errors.some((e) => e.kind === 'matchOther')).toBe(false);
+    });
+  });
+
+  // ─── Name and surname required for USER accounts ─────────────────────────
+
+  describe('User identity fields', () => {
+    beforeEach(() => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+    });
+
+    it('requires name for USER account', () => {
+      const errors = component.signalForm.user.name().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('requires surname for USER account', () => {
+      const errors = component.signalForm.user.surname().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('does NOT require name for SERVICE account', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      const errors = component.signalForm.user.name().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(false);
+    });
+
+    it('does NOT require surname for SERVICE account', () => {
+      setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+      const errors = component.signalForm.user.surname().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(false);
+    });
+  });
+
+  // ─── Email format validation ─────────────────────────────────────────────
+
+  describe('Email format validation', () => {
+    it('rejects a malformed email with an email-kind error', () => {
+      // Sync `email()` validator fires on value change — no tick needed (no async involved).
+      setField(() => component.signalForm.email, 'not-an-email');
+      const errors = component.signalForm.email().errors();
+      expect(errors.some((e) => e.kind === 'email')).toBe(true);
+    });
+
+    it('accepts a well-formed email with no email-kind error', () => {
+      setField(() => component.signalForm.email, 'valid@example.com');
+      const errors = component.signalForm.email().errors();
+      expect(errors.some((e) => e.kind === 'email')).toBe(false);
+    });
+  });
+
+  // ─── clientId requirement per mode (new vs edit) ──────────────────────────
+
+  describe('clientId requirement', () => {
+    it('is required in new mode (even when the selector is hidden, e.g. zero matching clients)', () => {
+      // No client options at all → selector hidden, but creation still demands a client.
+      const errors = component.signalForm.clientId().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(true);
+    });
+
+    it('is NOT required in edit mode', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-1',
+        type: IamAccountTypeEnum.USER,
+        email: 'own@example.com',
+        username: 'ownuser',
+        tenants: [{ id: 'tenant-1' }],
+      } as unknown as IamAccount);
+
+      const errors = component.signalForm.clientId().errors();
+      expect(errors.some((e) => e.kind === 'required')).toBe(false);
+    });
+  });
+
+  // ─── Async email/username uniqueness ────────────────────────────────────
+
+  describe('Async uniqueness — available value accepted (structural wiring check)', () => {
+    /**
+     * The async validators use rxResource + debounce:'blur'. These tests verify structural
+     * wiring (the validateAsync is registered on the correct fields) by checking no
+     * unexpected uniqueEmail/uniqueUsername errors appear with the available Apollo mock.
+     * The outer beforeEach already provides the available mock, so no override is needed.
+     */
+    it('email field has validateAsync wired (no uniqueEmail error when available)', () => {
+      setField(() => component.signalForm.email, 'available@example.com');
+      // Apollo mock returns available=true; synchronous observable means no async pending
+      const errors = component.signalForm.email().errors();
+      // Should have no uniqueEmail error when available
+      expect(errors.some((e) => e.kind === 'uniqueEmail')).toBe(false);
+    });
+
+    it('username field has validateAsync wired (no uniqueUsername error when available)', () => {
+      setField(() => component.signalForm.username, 'available-user');
+      const errors = component.signalForm.username().errors();
+      expect(errors.some((e) => e.kind === 'uniqueUsername')).toBe(false);
+    });
+  });
+
+  describe('Async uniqueness — own value accepted in edit mode', () => {
+    it('avoidEmail signal is populated from initial.email in edit mode', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-1',
+        type: IamAccountTypeEnum.USER,
+        email: 'own@example.com',
+        username: 'ownuser',
+        tenants: [{ id: 'tenant-1' }],
+      } as unknown as IamAccount);
+
+      // The avoidEmail computed signal correctly returns the original email
+      // (tested indirectly: no uniqueEmail error when the Apollo mock returns available=true)
+      setField(() => component.signalForm.email, 'own@example.com');
+      const errors = component.signalForm.email().errors();
+      expect(errors.some((e) => e.kind === 'uniqueEmail')).toBe(false);
+    });
+  });
+
+  // ─── Async uniqueness — duplicate REJECTION (FIX 3) ──────────────────────
+
+  /**
+   * These tests assert the duplicate path actually RAISES uniqueEmail/uniqueUsername.
+   * They need the DUPLICATE Apollo mock, but `overrideProvider` after a component is
+   * instantiated throws — so this nested suite resets and reconfigures TestBed with
+   * `makeApolloDuplicateMock()` before creating its own fixture.
+   *
+   * The async validator resolves synchronously through the mock Observable; flushing the
+   * zoneless scheduler with `TestBed.tick()` (+ a microtask + a second tick to settle the
+   * rxResource) surfaces the resolved error. `TestBed.tick()` is a valid Angular 22 API.
+   *
+   * Non-tautology: each test would FAIL if the validateAsync (or its avoid-list) were
+   * removed — the rejection assertions require the validator to run and emit the error,
+   * and the edit-mode test proves the avoid-list both excludes the own value AND still
+   * runs for a different value.
+   */
+  describe('Async uniqueness — duplicate rejection', () => {
+    let dupFixture: ComponentFixture<AccountFormComponent>;
+    let dupComponent: AccountFormComponent;
+
+    beforeEach(() => {
+      // The outer beforeEach already configured + created a component with the AVAILABLE mock.
+      // Reset so we can reconfigure with the DUPLICATE mock (reconfigure-after-compile throws).
+      TestBed.resetTestingModule();
+      TestBed.configureTestingModule({
+        imports: [
+          AccountFormComponent,
+          TranslocoTestingModule.forRoot({
+            langs: { en: {}, es: {} },
+            translocoConfig: { defaultLang: 'en' },
+          }),
+        ],
+        providers: [{ provide: Apollo, useValue: makeApolloDuplicateMock() }],
+      });
+      dupFixture = TestBed.createComponent(AccountFormComponent);
+      dupComponent = dupFixture.componentInstance;
+      dupFixture.componentRef.setInput('mode', 'new');
+    });
+
+    it('(a) raises uniqueEmail when the email is already taken', async () => {
+      setField(() => dupComponent.signalForm.email, 'taken@example.com');
+      await settleAsyncValidators();
+      const errors = dupComponent.signalForm.email().errors();
+      expect(errors.some((e) => e.kind === 'uniqueEmail')).toBe(true);
+    });
+
+    it('(b) raises uniqueUsername when the username is already taken', async () => {
+      setField(() => dupComponent.signalForm.type, IamAccountTypeEnum.SERVICE);
+      setField(() => dupComponent.signalForm.username, 'taken-user');
+      await settleAsyncValidators();
+      const errors = dupComponent.signalForm.username().errors();
+      expect(errors.some((e) => e.kind === 'uniqueUsername')).toBe(true);
+    });
+
+    it('(c) accepts the OWN email in edit mode (avoidEmail exclusion) but rejects a DIFFERENT one', async () => {
+      dupFixture.componentRef.setInput('mode', 'edit');
+      dupFixture.componentRef.setInput('initial', {
+        id: 'acc-edit',
+        type: IamAccountTypeEnum.USER,
+        email: 'own@example.com',
+        username: 'ownuser',
+        tenants: [{ id: 'tenant-1' }],
+      } as unknown as IamAccount);
+
+      // Own value: avoidEmails includes it → backend would be queried with the exclusion.
+      // The mock returns "duplicate", so the only thing keeping uniqueEmail OFF here is the
+      // avoid-list short-circuit driving the params. Assert the own value is accepted.
+      setField(() => dupComponent.signalForm.email, 'own@example.com');
+      await settleAsyncValidators();
+      expect(
+        dupComponent.signalForm
+          .email()
+          .errors()
+          .some((e) => e.kind === 'uniqueEmail'),
+      ).toBe(false);
+
+      // A DIFFERENT value in the SAME edit fixture → not in the avoid-list → validator runs
+      // → the duplicate mock raises uniqueEmail. Proves the validator is still active.
+      setField(() => dupComponent.signalForm.email, 'different@example.com');
+      await settleAsyncValidators();
+      expect(
+        dupComponent.signalForm
+          .email()
+          .errors()
+          .some((e) => e.kind === 'uniqueEmail'),
+      ).toBe(true);
+    });
+
+    // FIX 4: submit() must NOT emit a duplicate in the race window — i.e. when the async
+    // uniqueness validator is still PENDING (in-flight), before it has resolved to an error.
+    // The component passes `ignoreValidators: 'none'`, so submit() gates on valid() (no errors
+    // AND no pending). The library default ('pending') only blocks on invalid() — a pending
+    // validator leaves the field `unknown`, not `invalid`, so the default would let the
+    // duplicate through. This test submits WITHOUT settling first, so the validator is genuinely
+    // pending at submit() time; the gate must hold. (With the default 'pending' this emits and
+    // the assertion fails — proving the test is non-tautological.)
+    it('does not emit a duplicate while async uniqueness is still pending (race window)', async () => {
+      const emitted: IamAccount[] = [];
+      dupComponent.save.subscribe((v) => emitted.push(v));
+
+      // Set everything to an otherwise-valid SERVICE account with a duplicate email, then submit
+      // IMMEDIATELY — no settle — so the email uniqueness validator is still pending (unknown).
+      setField(() => dupComponent.signalForm.type, IamAccountTypeEnum.SERVICE);
+      setField(() => dupComponent.signalForm.username, 'svc-dup');
+      setField(() => dupComponent.signalForm.email, 'dup@example.com');
+      setField(() => dupComponent.signalForm.tenantIds, ['tenant-1']);
+      setField(() => dupComponent.signalForm.clientId, 'client-1');
+
+      // Sanity: the validator is genuinely in-flight at submit() time (the race window).
+      expect(dupComponent.signalForm.email().pending()).toBe(true);
+
+      dupComponent.submit();
+      // Let the in-flight validator resolve to the uniqueEmail error.
+      await settleAsyncValidators();
+
+      // Sanity: it WAS a duplicate — otherwise the gate would have nothing to block.
+      expect(
+        dupComponent.signalForm
+          .email()
+          .errors()
+          .some((e) => e.kind === 'uniqueEmail'),
+      ).toBe(true);
+      // The gate held: no save was emitted during the pending window.
+      expect(emitted).toHaveLength(0);
+    });
+  });
+
+  // ─── submit() ───────────────────────────────────────────────────────────
+
+  describe('submit()', () => {
+    it('does not emit save while the form is invalid', () => {
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      component.submit();
+      expect(emitted).toHaveLength(0);
+    });
+
+    it('nulls the user object for a SERVICE account submit', async () => {
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      await submitWithFields(component, () => {
+        setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+        setField(() => component.signalForm.username, 'svc-bot');
+        setField(() => component.signalForm.tenantIds, ['tenant-1']);
+        setField(() => component.signalForm.clientId, 'client-1');
+      });
+
+      expect(emitted).toHaveLength(1);
+      expect((emitted[0] as IamAccount & { user?: unknown }).user).toBeNull();
+    });
+
+    it('generates UUIDs for new USER account and sets accountId on user', async () => {
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      await submitWithFields(component, () => {
+        setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+        setField(() => component.signalForm.username, 'jdoe');
+        setField(() => component.signalForm.email, 'jdoe@example.com');
+        setField(() => component.signalForm.tenantIds, ['tenant-1']);
+        setField(() => component.signalForm.clientId, 'client-1');
+        setField(() => component.signalForm.user.name, 'John');
+        setField(() => component.signalForm.user.surname, 'Doe');
+        setField(() => component.signalForm.user.password, 'Strong!Pass1');
+        setField(() => component.signalForm.user.repeatPassword, 'Strong!Pass1');
+      });
+
+      expect(emitted).toHaveLength(1);
+      const payload = emitted[0];
+
+      const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/;
+      expect(payload.id).toMatch(uuidRegex);
+
+      const user = (payload as IamAccount & { user?: { id?: string; accountId?: string } }).user;
+      expect(user?.id).toMatch(uuidRegex);
+      expect(user?.accountId).toBe(payload.id);
+    });
+
+    it('lowercases email and username in the submit payload', async () => {
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      await submitWithFields(component, () => {
+        setField(() => component.signalForm.type, IamAccountTypeEnum.SERVICE);
+        setField(() => component.signalForm.username, 'UPPER-SVC');
+        setField(() => component.signalForm.email, 'UPPER@EXAMPLE.COM');
+        setField(() => component.signalForm.tenantIds, ['tenant-1']);
+        setField(() => component.signalForm.clientId, 'client-1');
+      });
+
+      expect(emitted).toHaveLength(1);
+      expect(emitted[0].email).toBe('upper@example.com');
+      expect(emitted[0].username).toBe('upper-svc');
+    });
+
+    it('strips repeatPassword from the submit payload', async () => {
+      const emitted: IamAccount[] = [];
+      component.save.subscribe((v) => emitted.push(v));
+      await submitWithFields(component, () => {
+        setField(() => component.signalForm.type, IamAccountTypeEnum.USER);
+        setField(() => component.signalForm.username, 'jdoe2');
+        setField(() => component.signalForm.email, 'jdoe2@example.com');
+        setField(() => component.signalForm.tenantIds, ['tenant-1']);
+        setField(() => component.signalForm.clientId, 'client-1');
+        setField(() => component.signalForm.user.name, 'Jane');
+        setField(() => component.signalForm.user.surname, 'Doe');
+        setField(() => component.signalForm.user.password, 'Strong!Pass1');
+        setField(() => component.signalForm.user.repeatPassword, 'Strong!Pass1');
+      });
+
+      expect(emitted).toHaveLength(1);
+      const user = (emitted[0] as IamAccount & { user?: Record<string, unknown> }).user;
+      expect(user?.['repeatPassword']).toBeUndefined();
+    });
+  });
+
+  // ─── Scope options (client-derived) ─────────────────────────────────────
+
+  /**
+   * Probe type to access protected members without casting per test.
+   * `scopeOptions` is a WritableSignal (linkedSignal), so we call it as a function.
+   */
+  type ScopeProbe = {
+    scopeOptions: () => string[];
+    onClientChange: (id: string | null | undefined) => void;
+  };
+
+  describe('Scope options (client-derived)', () => {
+    /**
+     * Test A — MUST BE RED on the current effect-based code.
+     *
+     * The edit-mode scopeOptions effect runs asynchronously on the scheduler.
+     * Without `TestBed.tick()`, the effect has not run yet and `scopeOptions()`
+     * still returns `[]`. After the linkedSignal refactor, the initial value is
+     * computed pull-based (on read), so it is available synchronously — green.
+     *
+     * Non-tautology: if we revert to signal+effect the test fails again because
+     * the effect requires a tick that this test deliberately withholds.
+     */
+    it('A — edit mode: scopeOptions reflect initial client scopes SYNCHRONOUSLY (no tick)', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('clientOptions', [
+        {
+          id: 'client-edit',
+          grantType: 'PASSWORD',
+          name: 'Edit Client',
+          scopeOptions: ['read', 'write'],
+        } as unknown as OAuthClient,
+      ]);
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-edit',
+        type: IamAccountTypeEnum.USER,
+        email: 'edit@example.com',
+        username: 'edituser',
+        tenants: [{ id: 'tenant-1' }],
+        clientId: 'client-edit',
+        client: {
+          id: 'client-edit',
+          grantType: 'PASSWORD',
+          name: 'Edit Client',
+          scopeOptions: ['read', 'write'],
+        },
+      } as unknown as IamAccount);
+
+      // No TestBed.tick() — the linkedSignal must deliver the value synchronously.
+      const probe = component as unknown as ScopeProbe;
+      expect(probe.scopeOptions()).toEqual(['read', 'write']);
+    });
+
+    /**
+     * Test B — override preservation.
+     *
+     * After the initial hydration, a user-driven `onClientChange` call must
+     * overwrite scopeOptions with the new client's scopes, and a subsequent
+     * `onClientChange(undefined)` must reset it to `[]`.
+     *
+     * Non-tautology: if the linkedSignal loses writable semantics (i.e. reverts
+     * to a read-only computed), the `.set()` inside `onClientChange` would throw
+     * and/or the value would not update.
+     */
+    it('B — override: onClientChange updates scopeOptions; clearing sets to []', () => {
+      fixture.componentRef.setInput('mode', 'edit');
+      fixture.componentRef.setInput('clientOptions', [
+        {
+          id: 'client-edit',
+          grantType: 'PASSWORD',
+          name: 'Edit Client',
+          scopeOptions: ['read', 'write'],
+        } as unknown as OAuthClient,
+        {
+          id: 'client-other',
+          grantType: 'PASSWORD',
+          name: 'Other Client',
+          scopeOptions: ['admin', 'super'],
+        } as unknown as OAuthClient,
+      ]);
+      fixture.componentRef.setInput('initial', {
+        id: 'acc-edit',
+        type: IamAccountTypeEnum.USER,
+        email: 'edit@example.com',
+        username: 'edituser',
+        tenants: [{ id: 'tenant-1' }],
+        clientId: 'client-edit',
+        client: {
+          id: 'client-edit',
+          grantType: 'PASSWORD',
+          name: 'Edit Client',
+          scopeOptions: ['read', 'write'],
+        },
+      } as unknown as IamAccount);
+
+      const probe = component as unknown as ScopeProbe;
+
+      // Initial state: edit-mode client scopes hydrated.
+      expect(probe.scopeOptions()).toEqual(['read', 'write']);
+
+      // User picks a different client.
+      probe.onClientChange('client-other');
+      expect(probe.scopeOptions()).toEqual(['admin', 'super']);
+
+      // User clears the selection.
+      probe.onClientChange(undefined);
+      expect(probe.scopeOptions()).toEqual([]);
+    });
+
+    /**
+     * Test C — new-mode regression.
+     *
+     * In new mode the default is `[]` (no initial client). When a single client
+     * is available and filtered, the auto-select effect calls `scopeOptions.set()`
+     * — the write must survive (the linkedSignal computation for new mode returns
+     * `[]`, which means the effect's `.set()` is the override that sticks until
+     * `initial()` changes).
+     */
+    it('C — new mode: single-client auto-select effect can still set scopeOptions', () => {
+      fixture.componentRef.setInput('mode', 'new');
+      fixture.componentRef.setInput('clientOptions', [
+        {
+          id: 'client-only',
+          grantType: 'PASSWORD',
+          name: 'Only Client',
+          scopeOptions: ['scope-a'],
+        } as unknown as OAuthClient,
+      ]);
+
+      // Flush so the auto-select effect runs.
+      TestBed.tick();
+
+      const probe = component as unknown as ScopeProbe;
+      expect(probe.scopeOptions()).toEqual(['scope-a']);
+    });
+  });
+});