{props.intl.formatMessage(messages['id.verification.camera.access.failure.temporary'])}
+
{props.intl.formatMessage(messages[returnText])}
diff --git a/src/id-verification/tests/panels/RequestCameraAccessPanel.test.jsx b/src/id-verification/tests/panels/RequestCameraAccessPanel.test.jsx
index 17d36ee..18842bb 100644
--- a/src/id-verification/tests/panels/RequestCameraAccessPanel.test.jsx
+++ b/src/id-verification/tests/panels/RequestCameraAccessPanel.test.jsx
@@ -1,5 +1,6 @@
import React from 'react';
import { Router } from 'react-router-dom';
+import Bowser from 'bowser';
import { createMemoryHistory } from 'history';
import { render, screen, cleanup, act, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
@@ -11,6 +12,8 @@ jest.mock('@edx/frontend-platform/analytics', () => ({
sendTrackEvent: jest.fn(),
}));
+jest.mock('bowser');
+
const history = createMemoryHistory();
const IntlRequestCameraAccessPanel = injectIntl(RequestCameraAccessPanel);
@@ -30,6 +33,7 @@ describe('RequestCameraAccessPanel', () => {
it('renders correctly with media access pending', async () => {
contextValue.mediaAccess = 'pending';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
await act(async () => render((
@@ -45,6 +49,7 @@ describe('RequestCameraAccessPanel', () => {
it('renders correctly with media access granted and routes to PortraitPhotoContextPanel', async () => {
contextValue.mediaAccess = 'granted';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
await act(async () => render((
@@ -63,6 +68,7 @@ describe('RequestCameraAccessPanel', () => {
it('renders correctly with media access denied', async () => {
contextValue.mediaAccess = 'denied';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
await act(async () => render((
@@ -78,6 +84,7 @@ describe('RequestCameraAccessPanel', () => {
it('renders correctly with media access unsupported', async () => {
contextValue.mediaAccess = 'unsupported';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: '' } });
await act(async () => render((
@@ -90,4 +97,68 @@ describe('RequestCameraAccessPanel', () => {
const text = await screen.findByTestId('camera-access-failure');
expect(text).toHaveTextContent(/It looks like we're unable to access your camera./);
});
+
+ it('renders correct directions for Chrome with media access denied', async () => {
+ contextValue.mediaAccess = 'denied';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: 'Chrome' } });
+ await act(async () => render((
+
+
+
+
+
+
+
+ )));
+ const text = await screen.findByTestId('camera-failure-instructions');
+ expect(text).toHaveTextContent(/Open Chrome./);
+ });
+
+ it('renders correct directions for Firefox with media access denied', async () => {
+ contextValue.mediaAccess = 'denied';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: 'Firefox' } });
+ await act(async () => render((
+
+
+
+
+
+
+
+ )));
+ const text = await screen.findByTestId('camera-failure-instructions');
+ expect(text).toHaveTextContent(/Open Firefox./);
+ });
+
+ it('renders correct directions for Safari with media access denied', async () => {
+ contextValue.mediaAccess = 'denied';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: 'Safari' } });
+ await act(async () => render((
+
+
+
+
+
+
+
+ )));
+ const text = await screen.findByTestId('camera-failure-instructions');
+ expect(text).toHaveTextContent(/Open Safari./);
+ });
+
+ it('renders correct directions for IE11 with media access denied', async () => {
+ contextValue.mediaAccess = 'denied';
+ Bowser.parse = jest.fn().mockReturnValue({ browser: { name: 'Internet Explorer' } });
+ await act(async () => render((
+
+
+
+
+
+
+
+ )));
+ const text = await screen.findByTestId('camera-failure-instructions');
+ expect(text).toHaveTextContent(/Open the Flash Player/);
+ });
});