@openmrs/esm-fast-data-entry-app 1.4.2-pre.702 → 1.4.2-pre.706

package/e2e/fixtures/api.ts

@@ -1,4 +1,4 @@
-import { APIRequestContext, PlaywrightWorkerArgs, WorkerFixture } from '@playwright/test';
+import type { APIRequestContext, PlaywrightWorkerArgs, WorkerFixture } from '@playwright/test';
 
 /**
  * A fixture which initializes an [`APIRequestContext`](https://playwright.dev/docs/api/class-apirequestcontext)

package/e2e/pages/sample-test.ts

@@ -1,4 +1,4 @@
-import { Page } from '@playwright/test';
+import { type Page } from '@playwright/test';
 
 export class FastDataEntryPage {
   constructor(readonly page: Page) {}

package/e2e/specs/form-workflow.spec.ts

@@ -0,0 +1,160 @@
+import { type APIRequestContext, expect } from '@playwright/test';
+import { test } from '../core';
+
+type OpenmrsSessionResponse = {
+  user: {
+    uuid: string;
+  };
+};
+
+type OpenmrsForm = {
+  uuid: string;
+  name?: string;
+  published?: boolean;
+};
+
+type OpenmrsFormResponse = {
+  results?: Array<OpenmrsForm>;
+};
+
+type FhirPatient = {
+  id: string;
+  name?: Array<{
+    given?: Array<string>;
+    family?: string;
+  }>;
+  identifier?: Array<{
+    value?: string;
+  }>;
+};
+
+type FhirBundle<T> = {
+  entry?: Array<{
+    resource: T;
+  }>;
+};
+
+const workflowStorageVersion = '1.1.0';
+const workflowStorageName = 'openmrs:fastDataEntryWorkflowState';
+const formRepresentation =
+  '(uuid,name,display,encounterType:(uuid,name,viewPrivilege,editPrivilege),version,published,retired,resources:(uuid,name,dataType,valueReference))';
+
+const getPatientName = (patient: FhirPatient) =>
+  `${patient.name?.[0]?.given?.join(' ') ?? ''} ${patient.name?.[0]?.family ?? ''}`.trim();
+
+const getPatientIdentifier = (patient: FhirPatient) => patient.identifier?.[0]?.value?.trim() ?? '';
+
+const escapeRegExp = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+
+async function getAdminUserUuid(api: APIRequestContext) {
+  const response = await api.get('session');
+  expect(response.ok()).toBeTruthy();
+
+  const session = (await response.json()) as OpenmrsSessionResponse;
+  return session.user.uuid;
+}
+
+async function getTestFormUuid(api: APIRequestContext) {
+  const response = await api.get(`form?v=custom:${formRepresentation}`);
+  expect(response.ok()).toBeTruthy();
+
+  const payload = (await response.json()) as OpenmrsFormResponse;
+  const form = payload.results?.find((candidate) => candidate.published && !/component/i.test(candidate.name ?? ''));
+
+  expect(form?.uuid, 'Expected at least one published non-component form').toBeTruthy();
+  return form.uuid;
+}
+
+async function getTwoPatients(api: APIRequestContext) {
+  const response = await api.get(`${process.env.E2E_BASE_URL}/ws/fhir2/R4/Patient?_count=20`);
+  expect(response.ok()).toBeTruthy();
+
+  const bundle = (await response.json()) as FhirBundle<FhirPatient>;
+  const patients =
+    bundle.entry
+      ?.map(({ resource }) => resource)
+      .filter((patient) => getPatientName(patient) && getPatientIdentifier(patient)) ?? [];
+
+  const uniquePatients = patients.filter(
+    (patient, index) =>
+      patients.findIndex((candidate) => candidate.id === patient.id) === index &&
+      patients.findIndex((candidate) => getPatientIdentifier(candidate) === getPatientIdentifier(patient)) === index,
+  );
+
+  expect(uniquePatients.length, 'Expected at least two patients with names and identifiers').toBeGreaterThanOrEqual(2);
+  return uniquePatients.slice(0, 2);
+}
+
+test('switches active patients from the workflow side panel and persists the selection', async ({ page, api }) => {
+  const [userUuid, formUuid, [firstPatient, secondPatient]] = await Promise.all([
+    getAdminUserUuid(api),
+    getTestFormUuid(api),
+    getTwoPatients(api),
+  ]);
+
+  const storageKey = `${workflowStorageName}:${userUuid}`;
+  const storageValue = JSON.stringify({
+    _storageVersion: workflowStorageVersion,
+    activeFormUuid: formUuid,
+    userUuid,
+    forms: {
+      [formUuid]: {
+        workflowState: 'EDIT_FORM',
+        activePatientUuid: firstPatient.id,
+        activeEncounterUuid: null,
+        patientUuids: [firstPatient.id, secondPatient.id],
+        encounters: {},
+      },
+    },
+  });
+
+  await page.addInitScript(
+    ({ key, value }) => {
+      window.localStorage.clear();
+      window.localStorage.setItem(key, value);
+    },
+    { key: storageKey, value: storageValue },
+  );
+
+  await page.goto(`forms/form/${formUuid}`);
+
+  await expect(page.getByText('Forms filled')).toBeVisible();
+
+  const firstPatientCard = page.getByRole('button', {
+    name: new RegExp(escapeRegExp(getPatientIdentifier(firstPatient))),
+  });
+  const secondPatientCard = page.getByRole('button', {
+    name: new RegExp(escapeRegExp(getPatientIdentifier(secondPatient))),
+  });
+
+  await expect(firstPatientCard).toBeVisible();
+  await expect(secondPatientCard).toBeVisible();
+
+  await secondPatientCard.click();
+
+  await expect
+    .poll(async () => {
+      return page.evaluate(
+        ({ key, currentFormUuid }) => {
+          const data = JSON.parse(window.localStorage.getItem(key) ?? '{}');
+          return data.forms?.[currentFormUuid]?.activePatientUuid ?? null;
+        },
+        { key: storageKey, currentFormUuid: formUuid },
+      );
+    })
+    .toBe(secondPatient.id);
+
+  await firstPatientCard.click();
+
+  await expect
+    .poll(async () => {
+      return page.evaluate(
+        ({ key, currentFormUuid }) => {
+          const data = JSON.parse(window.localStorage.getItem(key) ?? '{}');
+          return data.forms?.[currentFormUuid]?.activePatientUuid ?? null;
+        },
+        { key: storageKey, currentFormUuid: formUuid },
+      );
+    })
+    .toBe(firstPatient.id);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-fast-data-entry-app",
-  "version": "1.4.2-pre.702",
+  "version": "1.4.2-pre.706",
   "license": "MPL-2.0",
   "description": "O3 frontend module for fast data entry using the OpenMRS Angular Form Engine",
   "browser": "dist/openmrs-esm-fast-data-entry-app.js",

package/src/FormBootstrap.test.tsx

@@ -0,0 +1,112 @@
+import React from 'react';
+import { act, render, screen } from '@testing-library/react';
+import { detach, ExtensionSlot } from '@openmrs/esm-framework';
+import GroupFormWorkflowContext from './context/GroupFormWorkflowContext';
+import useGetPatient from './hooks/useGetPatient';
+import FormBootstrap from './FormBootstrap';
+
+jest.mock('./hooks/useGetPatient', () => jest.fn());
+
+const mockDetach = jest.mocked(detach);
+const mockExtensionSlot = jest.mocked(ExtensionSlot);
+const mockUseGetPatient = useGetPatient as jest.MockedFunction<typeof useGetPatient>;
+
+const renderFormBootstrap = (props = {}) =>
+  render(
+    <GroupFormWorkflowContext.Provider
+      value={
+        {
+          activeSessionMeta: {
+            sessionName: 'April Session',
+            practitionerName: 'Alice',
+            sessionDate: '2026-04-15',
+            sessionNotes: 'Follow-up notes',
+          },
+        } as never
+      }
+    >
+      <FormBootstrap
+        formUuid="triage-form"
+        patientUuid="patient-1"
+        visitUuid="visit-1"
+        visitTypeUuid="visit-type-1"
+        encounterUuid="encounter-1"
+        handlePostResponse={jest.fn()}
+        handleEncounterCreate={jest.fn()}
+        handleOnValidate={jest.fn()}
+        hidePatientBanner={true}
+        {...props}
+      />
+    </GroupFormWorkflowContext.Provider>,
+  );
+
+describe('FormBootstrap', () => {
+  beforeEach(() => {
+    mockExtensionSlot.mockImplementation(() => <div data-testid="form-widget-slot" />);
+    mockUseGetPatient.mockReturnValue({
+      id: 'patient-1',
+      name: [{ given: ['Ada'], family: 'Lovelace' }],
+    } as fhir.Patient);
+  });
+
+  afterEach(() => {
+    jest.useRealTimers();
+  });
+
+  it('passes the expected widget state once the patient is available', () => {
+    renderFormBootstrap();
+
+    expect(screen.getByTestId('form-widget-slot')).toBeInTheDocument();
+
+    const [{ name, state }] = mockExtensionSlot.mock.calls[0];
+    expect(name).toBe('form-widget-slot');
+    expect(state).toEqual(
+      expect.objectContaining({
+        view: 'form',
+        formUuid: 'triage-form',
+        visitUuid: 'visit-1',
+        visitTypeUuid: 'visit-type-1',
+        patientUuid: 'patient-1',
+        patient: expect.objectContaining({ id: 'patient-1' }),
+        encounterUuid: 'encounter-1',
+        showDiscardSubmitButtons: false,
+        hideControls: true,
+        hidePatientBanner: true,
+        preFilledQuestions: {
+          sessionName: 'April Session',
+          practitionerName: 'Alice',
+          sessionDate: '2026-04-15',
+          sessionNotes: 'Follow-up notes',
+          encDate: '2026-04-15',
+        },
+      }),
+    );
+  });
+
+  it('refreshes the widget after submit and detaches it on unmount', () => {
+    jest.useFakeTimers();
+    const handlePostResponse = jest.fn();
+    const { unmount } = renderFormBootstrap({ handlePostResponse });
+
+    const [{ state }] = mockExtensionSlot.mock.calls[0];
+    const handlePostResponseFromState = state.handlePostResponse as (encounter: { uuid: string }) => void;
+
+    act(() => {
+      handlePostResponseFromState({ uuid: 'encounter-2' });
+    });
+
+    expect(handlePostResponse).toHaveBeenCalledWith({ uuid: 'encounter-2' });
+    expect(screen.queryByTestId('form-widget-slot')).not.toBeInTheDocument();
+
+    act(() => {
+      jest.advanceTimersByTime(1);
+    });
+
+    expect(screen.getByTestId('form-widget-slot')).toBeInTheDocument();
+    expect(mockExtensionSlot).toHaveBeenCalledTimes(2);
+
+    unmount();
+
+    expect(mockDetach).toHaveBeenCalledWith('form-widget-slot', 'form-widget-slot');
+  });
+});

package/src/FormBootstrap.tsx

@@ -130,6 +130,7 @@ const FormBootstrap = ({
   hidePatientBanner,
 }: FormParams) => {
   const patient = useGetPatient(patientUuid);
+  const isPatientMatch = patient?.id === patientUuid;
   const { activeSessionMeta } = useContext(GroupFormWorkflowContext);
 
   useEffect(() => {
@@ -146,9 +147,11 @@ const FormBootstrap = ({
     }, 1);
   };
 
+  const isReady = showForm && formUuid && patientUuid && patient && isPatientMatch;
+
   return (
     <div>
-      {showForm && formUuid && patientUuid && patient && (
+      {isReady && (
         <ExtensionSlot
           name="form-widget-slot"
           state={{

package/src/context/FormWorkflowReducer.test.ts

@@ -0,0 +1,142 @@
+import { navigate } from '@openmrs/esm-framework';
+import { initialWorkflowState } from './FormWorkflowContext';
+import reducer, { fdeWorkflowStorageName, fdeWorkflowStorageVersion } from './FormWorkflowReducer';
+
+const mockNavigate = jest.mocked(navigate);
+
+const buildState = (formStateOverrides = {}) => ({
+  ...initialWorkflowState,
+  activeFormUuid: 'triage-form',
+  userUuid: 'user-1',
+  forms: {
+    'triage-form': {
+      workflowState: 'NEW_PATIENT',
+      activePatientUuid: null,
+      activeEncounterUuid: null,
+      patientUuids: [],
+      encounters: {},
+      ...formStateOverrides,
+    },
+  },
+});
+
+describe('FormWorkflowReducer', () => {
+  beforeEach(() => {
+    localStorage.clear();
+  });
+
+  it('initializes a fresh workflow state when there is no saved session', () => {
+    const state = reducer(initialWorkflowState, {
+      type: 'INITIALIZE_WORKFLOW_STATE',
+      activeFormUuid: 'triage-form',
+      userUuid: 'user-1',
+    });
+
+    expect(state.activeFormUuid).toBe('triage-form');
+    expect(state.forms['triage-form']).toMatchObject({
+      workflowState: 'NEW_PATIENT',
+      activePatientUuid: null,
+      activeEncounterUuid: null,
+      patientUuids: [],
+      encounters: {},
+    });
+
+    expect(JSON.parse(localStorage.getItem(`${fdeWorkflowStorageName}:user-1`))).toMatchObject({
+      _storageVersion: fdeWorkflowStorageVersion,
+      activeFormUuid: 'triage-form',
+    });
+  });
+
+  it('restores a saved workflow and applies a patient from the URL when provided', () => {
+    localStorage.setItem(
+      `${fdeWorkflowStorageName}:user-1`,
+      JSON.stringify({
+        _storageVersion: fdeWorkflowStorageVersion,
+        activeFormUuid: 'triage-form',
+        userUuid: 'user-1',
+        forms: {
+          'triage-form': {
+            workflowState: 'REVIEW',
+            activePatientUuid: null,
+            activeEncounterUuid: null,
+            patientUuids: ['patient-a'],
+            encounters: {},
+          },
+        },
+      }),
+    );
+
+    const state = reducer(initialWorkflowState, {
+      type: 'INITIALIZE_WORKFLOW_STATE',
+      activeFormUuid: 'triage-form',
+      newPatientUuid: 'patient-b',
+      userUuid: 'user-1',
+    });
+
+    expect(state.forms['triage-form']).toMatchObject({
+      workflowState: 'EDIT_FORM',
+      activePatientUuid: 'patient-b',
+    });
+    expect(state.forms['triage-form'].patientUuids).toEqual(['patient-a', 'patient-b']);
+  });
+
+  it('dispatches the submit event and moves the workflow into SUBMIT_FOR_NEXT', () => {
+    const dispatchEventSpy = jest.spyOn(window, 'dispatchEvent');
+    const state = buildState({
+      workflowState: 'EDIT_FORM',
+      activePatientUuid: 'patient-a',
+    });
+
+    const nextState = reducer(state, {
+      type: 'SUBMIT_FOR_NEXT',
+    });
+
+    expect(nextState.forms['triage-form'].workflowState).toBe('SUBMIT_FOR_NEXT');
+    expect(dispatchEventSpy).toHaveBeenCalledTimes(1);
+
+    const event = dispatchEventSpy.mock.calls[0][0] as CustomEvent;
+    expect(event.type).toBe('ampath-form-action');
+    expect(event.detail).toEqual({
+      formUuid: 'triage-form',
+      patientUuid: 'patient-a',
+      action: 'onSubmit',
+    });
+  });
+
+  it('stores the encounter and returns to NEW_PATIENT after saving for next', () => {
+    const state = buildState({
+      workflowState: 'SUBMIT_FOR_NEXT',
+      activePatientUuid: 'patient-a',
+    });
+
+    const nextState = reducer(state, {
+      type: 'SAVE_ENCOUNTER',
+      encounterUuid: 'encounter-1',
+    });
+
+    expect(nextState.forms['triage-form']).toMatchObject({
+      workflowState: 'NEW_PATIENT',
+      activePatientUuid: null,
+      activeEncounterUuid: null,
+      encounters: {
+        'patient-a': 'encounter-1',
+      },
+    });
+  });
+
+  it('destroys the active form session and navigates back to the forms page after complete', () => {
+    const state = buildState({
+      workflowState: 'SUBMIT_FOR_COMPLETE',
+      activePatientUuid: 'patient-a',
+    });
+
+    const nextState = reducer(state, {
+      type: 'SAVE_ENCOUNTER',
+      encounterUuid: 'encounter-1',
+    });
+
+    expect(nextState.activeFormUuid).toBeNull();
+    expect(nextState.forms).toEqual({});
+    expect(mockNavigate).toHaveBeenCalledWith({ to: '${openmrsSpaBase}/forms' });
+  });
+});