Merge liveness/alpha into dca v2 (#5850)

* chore(liveness): allow selecting all cameras, allow camera selection … (#5833) * chore(liveness): allow selecting all cameras, allow camera selection on mobile * only show on mobile with facemovement challenge only * relax e2e tests on alpha * make more reaadable * fix * update names * refactor, add tests * Update packages/react-liveness/src/components/FaceLivenessDetector/LivenessCheck/LivenessCameraModule.tsx Co-authored-by: Caleb Pollman <[email protected]> * refactor --------- Co-authored-by: Caleb Pollman <[email protected]> * fix(liveness): fix camera select showing up with one camera, fix camera changing weirdness with hair check screen (#5845) --------- Co-authored-by: thaddmt <[email protected]> Co-authored-by: Caleb Pollman <[email protected]>
aws-amplify · Sep 30, 2024 · edc0d5b · edc0d5b
1 parent bdc7061
commit edc0d5b
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 2 deletions.
diff --git a/...react-liveness/src/components/FaceLivenessDetector/LivenessCheck/LivenessCameraModule.tsx b/...react-liveness/src/components/FaceLivenessDetector/LivenessCheck/LivenessCameraModule.tsx
@@ -154,7 +154,8 @@ export const LivenessCameraModule = (
   );
 
   // Only mobile device camera selection for no light challenge
-  const hasMultipleDevices = !!selectableDevices?.length;
+  const hasMultipleDevices =
+    !!selectableDevices?.length && selectableDevices.length > 1;
   const allowDeviceSelection =
     isStartView &&
     hasMultipleDevices &&

diff --git a/...src/components/FaceLivenessDetector/LivenessCheck/__tests__/LivenessCameraModule.test.tsx b/...src/components/FaceLivenessDetector/LivenessCheck/__tests__/LivenessCameraModule.test.tsx
@@ -507,6 +507,31 @@ describe('LivenessCameraModule', () => {
     ).toBeInTheDocument();
   });
 
+  it('should render hair check screen when isStart = true, should not render camera selector if only one camera', () => {
+    isStart = true;
+    mockStateMatchesAndSelectors();
+    mockUseLivenessSelector.mockReturnValue(25).mockReturnValue(['device-id']);
+
+    renderWithLivenessProvider(
+      <LivenessCameraModule
+        isMobileScreen={false}
+        isRecordingStopped={false}
+        hintDisplayText={hintDisplayText}
+        streamDisplayText={streamDisplayText}
+        errorDisplayText={errorDisplayText}
+        cameraDisplayText={cameraDisplayText}
+        instructionDisplayText={instructionDisplayText}
+      />
+    );
+    const videoEl = screen.getByTestId('video');
+    videoEl.dispatchEvent(new Event('canplay'));
+
+    expect(screen.getByTestId('popover-icon')).toBeInTheDocument();
+    expect(
+      screen.queryByTestId('amplify-liveness-camera-select')
+    ).not.toBeInTheDocument();
+  });
+
   it('selectors should work', () => {
     mockUseLivenessSelector.mockReturnValueOnce({}).mockReturnValueOnce({});
     const state: any = {

diff --git a/packages/react-liveness/src/components/FaceLivenessDetector/service/machine/machine.ts b/packages/react-liveness/src/components/FaceLivenessDetector/service/machine/machine.ts
@@ -197,7 +197,10 @@ export const livenessMachine = createMachine<LivenessContext, LivenessEvent>(
       SET_SESSION_INFO: { internal: true, actions: 'updateSessionInfo' },
       DISCONNECT_EVENT: { internal: true, actions: 'updateShouldDisconnect' },
       SET_DOM_AND_CAMERA_DETAILS: { actions: 'setDOMAndCameraDetails' },
-      UPDATE_DEVICE_AND_STREAM: { actions: 'updateDeviceAndStream' },
+      UPDATE_DEVICE_AND_STREAM: {
+        actions: 'updateDeviceAndStream',
+        target: 'start',
+      },
       SERVER_ERROR: {
         target: 'error',
         actions: 'updateErrorStateForServer',
@@ -545,10 +548,13 @@ export const livenessMachine = createMachine<LivenessContext, LivenessEvent>(
       }),
       updateDeviceAndStream: assign({
         videoAssociatedParams: (context, event) => {
+          const { canvasEl, videoEl, videoMediaStream } =
+            context.videoAssociatedParams!;
           setLastSelectedCameraId(event.data?.newDeviceId as string);
           context.livenessStreamProvider?.setNewVideoStream(
             event.data?.newStream as MediaStream
           );
+          drawStaticOval(canvasEl!, videoEl!, videoMediaStream!);
 
           return {
             ...context.videoAssociatedParams,