@newtonschool/react_proctoring_library 0.0.51 → 0.0.53

package/dist/components/permissions/index.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.Permission = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactBootstrap = require("react-bootstrap");
-var _askPermission = _interopRequireDefault(require("../../assets/videos/ask-permission.mp4"));
 require("./index.scss");
 var text = _interopRequireWildcard(require("../../constants/text"));
 var _permissionBody = require("./permission-body");
@@ -32,33 +31,19 @@ const Permission = _ref => {
     centered: true
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Header, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Title, null, text.PERMISSION_TITLE)), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Body, {
     className: "font-medium"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      borderRadius: "20px"
-    }
-  }, /*#__PURE__*/_react.default.createElement("video", {
-    className: "videoStyles",
-    width: "100%",
-    height: "240",
-    autoPlay: true,
-    muted: true,
-    loop: true,
-    playsInline: true
-  }, /*#__PURE__*/_react.default.createElement("source", {
-    src: _askPermission.default
-  }), text.VIDEO_UNSUPPORTED_IN_BROWSER)), /*#__PURE__*/_react.default.createElement(_permissionBody.PermissionBody, {
+  }, /*#__PURE__*/_react.default.createElement(_permissionBody.PermissionBody, {
     showFullscreenText: !permissions.fullscreen,
-    showAudioPermissionText: !permissions.audio && (0, _breachUtils.isWebcamRequired)(proctorParams),
+    showAudioPermissionText: !permissions.audio && (0, _breachUtils.isAudioRequired)(proctorParams),
     showVideoPermissionText: !permissions.video && (0, _breachUtils.isWebcamRequired)(proctorParams),
     showScreensharePermission: !permissions.screenshare && proctorParams.screenshareSnapshots
   })), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Footer, null, !permissions.screenshare && proctorParams.screenshareSnapshots && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     onClick: () => {
-      askPermission(["screenshare"]);
+      askPermission(['screenshare']);
     }
   }, text.ALLOW_SCREENSHARE), !permissions.fullscreen && proctorParams.fullscreenExit && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     variant: "primary",
     onClick: () => {
-      askPermission(["fullscreen"]);
+      askPermission(['fullscreen']);
     }
   }, text.ALLOW_FULLSCREEN)));
 };

package/dist/components/proctor-app/Loadable.js

@@ -11,7 +11,9 @@ var _react = _interopRequireDefault(require("react"));
 var _loadable = _interopRequireDefault(require("../../utils/loadable"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      * Asynchronously loads the component for FeaturePage
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      */
 var _default = (0, _loadable.default)(() => Promise.resolve().then(() => _interopRequireWildcard(require("./index"))), {
   fallback: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)
 });

package/dist/components/proctor-app/index.js

@@ -42,7 +42,8 @@ const ProctorApp = _ref => {
     config,
     getProctorParamValues = () => {},
     getWebcamSnapshot = () => {},
-    getScreengrab = () => {}
+    getScreengrab = () => {},
+    logger = () => {}
   } = _ref;
   const context = (0, _react.useContext)(proctoredContext);
   const {
@@ -62,7 +63,7 @@ const ProctorApp = _ref => {
   const recurringFetchIntervalRef = (0, _react.useRef)(null);
   const sendScreengrab = (0, _react.useCallback)(async function () {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     if (proctorParams.screenshareSnapshots && permissions.screenshare) {
       const screenshot = await (0, _webcamMicrophoneUtils.captureScreenshot)("#".concat(_dom.SCREENSHARE_REFERENCE_ID));
       getScreengrab(proctoringIdentifier, screenshot, isBreach, breachedParam);
@@ -70,7 +71,7 @@ const ProctorApp = _ref => {
   }, [getScreengrab, proctoringIdentifier, proctorParams.screenshareSnapshots, permissions.screenshare]);
   const sendWebcamSnapshot = (0, _react.useCallback)(async function () {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     if (proctorParams.webcamSnapshots && permissions.video) {
       const webcamSnapshot = await (0, _webcamMicrophoneUtils.captureScreenshot)("#".concat(_dom.WEBCAM_REFERENCE_ID));
       getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, isBreach, breachedParam);
@@ -78,7 +79,7 @@ const ProctorApp = _ref => {
   }, [proctoringIdentifier, getWebcamSnapshot, proctorParams.webcamSnapshots, permissions.video]);
   const sendProctoredParamValues = (0, _react.useCallback)(function () {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-    let breachParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+    let breachParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     getProctorParamValues(proctoringIdentifier, statistics.current, isBreach, breachParam);
   }, [proctoringIdentifier, getProctorParamValues]);
   const [userCount, lookedAwayCount] = (0, _useWebcamData.default)(references.webcamReference, references.canvasReference, proctorParams);
@@ -113,7 +114,7 @@ const ProctorApp = _ref => {
   }, [userCount, isTabSwitched, permissions.fullscreen, lookedAwayCount, sendProctoredParamValues, sendWebcamSnapshot, sendScreengrab, proctorParams]);
   const shouldShowProctoredComponent = (0, _breachUtils.showProctoredComponent)(proctorParams, permissions);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "".concat(proctorParams.copyPasteProctoring ? "disable-copy-paste fullwidth fullheight" : "fullwidth fullheight")
+    className: "".concat(proctorParams.copyPasteProctoring ? 'disable-copy-paste fullwidth fullheight' : 'fullwidth fullheight')
   }, shouldShowProctoredComponent && children, !shouldShowProctoredComponent && customPermissionView && /*#__PURE__*/_react.default.createElement(CustomPermissionView, _extends({
     permissions: permissions,
     references: references,
@@ -128,7 +129,8 @@ const ProctorApp = _ref => {
     setAudioPermission: permissionSetter.audio,
     setVideoPermission: permissionSetter.video,
     webcamReference: references.webcamReference,
-    canvasReference: references.canvasReference
+    canvasReference: references.canvasReference,
+    logger: logger
   }), /*#__PURE__*/_react.default.createElement(_screenshareActivityTracker.ScreenshareActivityTracker, {
     screenshareStream: screenshareStream,
     ref: references.screenshareReference

package/dist/components/proctor-context-app/Loadable.js

@@ -11,7 +11,9 @@ var _react = _interopRequireDefault(require("react"));
 var _loadable = _interopRequireDefault(require("../../utils/loadable"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } /**
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      * Asynchronously loads the component for FeaturePage
+                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      */
 var _default = (0, _loadable.default)(() => Promise.resolve().then(() => _interopRequireWildcard(require("./index"))), {
   fallback: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)
 });

package/dist/components/proctor-context-app/index.js

@@ -74,7 +74,7 @@ const ProctoredContextApp = _ref => {
       },
       proctorParams,
       actions: {
-        askPermission: askPermission
+        askPermission
       },
       references: {
         webcamReference,

package/dist/components/webcam-activity-tracker/index.js

@@ -1,55 +1,63 @@
 "use strict";
 
 require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.regexp.to-string.js");
 var _react = _interopRequireWildcard(require("react"));
 var _reactWebcam = _interopRequireDefault(require("react-webcam"));
-var _dom = require("../../constants/dom");
 var _breachUtils = require("../../utils/breachUtils");
 var _browserUtils = require("../../utils/browserUtils");
 var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
+var _dom = require("../../constants/dom");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const WEBCAM_PERMISISON_RETRIES_COUNT = 2;
 const WebcamActivityTracker = _ref => {
   let {
     proctorParams,
     setAudioPermission,
     setVideoPermission,
-    webcamReference
+    webcamReference,
+    logger
   } = _ref;
+  const [retryCount, setRetryCount] = (0, _react.useState)(WEBCAM_PERMISISON_RETRIES_COUNT);
   (0, _react.useEffect)(() => {
     if ((0, _browserUtils.isChrome)()) {
-      if ((0, _breachUtils.isWebcamRequired)(proctorParams)) {
+      if ((0, _breachUtils.isAudioRequired)()) {
         (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
         (0, _webcamMicrophoneUtils.getAudioPermissionQuery)().then(status => {
           status.onchange = evt => {
             (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
           };
         }).catch(err => {
-          (0, _webcamMicrophoneUtils.updateAudioPermissions)("Audio Permission", err);
+          (0, _webcamMicrophoneUtils.updateAudioPermissions)('Audio Permission', err);
         });
       }
     }
   }, [setVideoPermission, setAudioPermission, proctorParams]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _breachUtils.isWebcamRequired)(proctorParams) && /*#__PURE__*/_react.default.createElement(_reactWebcam.default, {
-    audio: true,
-    muted: true,
+    audio: (0, _breachUtils.isAudioRequired)(),
     screenshotFormat: "image/jpeg",
     ref: webcamReference,
     onUserMedia: () => {
       setVideoPermission(true);
     },
     onUserMediaError: err => {
-      console.log("Webcam Error", err);
-      setVideoPermission(false);
+      logger("Retry Count = ".concat(retryCount, " | Webcam error, onUserMediaError | ").concat(err.toString()));
+      if (retryCount === 0) {
+        setVideoPermission(false);
+      } else {
+        setRetryCount(retryCount - 1);
+      }
     },
     className: "captured-video-canvas hide",
-    id: _dom.WEBCAM_REFERENCE_ID
+    id: _dom.WEBCAM_REFERENCE_ID,
+    key: retryCount
   }));
 };
 var _default = WebcamActivityTracker;

package/dist/utils/breachUtils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.showProctoredComponent = exports.isWebcamRequired = exports.getRequiredPermissionsFromProctorParams = exports.getInitialStats = exports.getDataOnBreach = void 0;
+exports.showProctoredComponent = exports.isWebcamRequired = exports.isAudioRequired = exports.getRequiredPermissionsFromProctorParams = exports.getInitialStats = exports.getDataOnBreach = void 0;
 require("core-js/modules/es.symbol.description.js");
 var _defaults = require("../constants/defaults");
 var _permission = require("./permission");
@@ -41,6 +41,8 @@ const getRequiredPermissionsFromProctorParams = proctorParams => {
 exports.getRequiredPermissionsFromProctorParams = getRequiredPermissionsFromProctorParams;
 const isWebcamRequired = proctorParams => proctorParams.people || proctorParams.lookedAway || proctorParams.webcamSnapshots;
 exports.isWebcamRequired = isWebcamRequired;
+const isAudioRequired = () => false;
+exports.isAudioRequired = isAudioRequired;
 const showProctoredComponent = (proctorParams, permissions) => {
   return (0, _permission.hasAllPermissions)(getRequiredPermissionsFromProctorParams(proctorParams), permissions);
 };

package/dist/utils/webcamMicrophoneUtils.js

@@ -13,7 +13,7 @@ require("core-js/modules/es.typed-array.to-locale-string.js");
 require("core-js/modules/es.promise.js");
 var _ = require(".");
 var _defaults = require("../constants/defaults");
-const isWebcamVideoValid = webcamReference => webcamReference !== null && webcamReference !== undefined && typeof webcamReference.current !== "undefined" && webcamReference.current !== null && webcamReference.current.video.readyState === 4;
+const isWebcamVideoValid = webcamReference => webcamReference !== null && webcamReference !== undefined && typeof webcamReference.current !== 'undefined' && webcamReference.current !== null && webcamReference.current.video.readyState === 4;
 exports.isWebcamVideoValid = isWebcamVideoValid;
 const updateStatistics = (statistics, currentStats, proctorParams) => {
   const {
@@ -71,12 +71,12 @@ const getGlancePercentage = partSegmentation => {
 };
 exports.getGlancePercentage = getGlancePercentage;
 const getVideoPermission = function getVideoPermission(stream) {
-  let exludeTrackId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+  let exludeTrackId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   return stream.getVideoTracks().filter(track => track.enabled && track.label && track.id !== exludeTrackId).length > 0;
 };
 exports.getVideoPermission = getVideoPermission;
 const getAudioPermission = function getAudioPermission(stream) {
-  let exludeTrackId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+  let exludeTrackId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   return stream.getAudioTracks().filter(track => track.enabled && track.label && !track.muted && track.id !== exludeTrackId).length > 0;
 };
 exports.getAudioPermission = getAudioPermission;
@@ -108,10 +108,14 @@ const updateVideoPermissions = setVideoPermission => {
 };
 exports.updateVideoPermissions = updateVideoPermissions;
 const setupScreensharePermission = (setScreensharePermission, screenshareReference, setScreenshareStream) => navigator.mediaDevices.getDisplayMedia({
+  video: {
+    displaySurface: 'monitor'
+  }
+}).catch(() => navigator.mediaDevices.getDisplayMedia({
   video: true
-}).then(stream => {
+})).then(stream => {
   const track = stream.getTracks()[0];
-  if (track.getSettings().displaySurface === "monitor") {
+  if (track.getSettings().displaySurface === 'monitor') {
     setScreensharePermission(true);
     setScreenshareStream(stream);
     collectScreenshare(screenshareReference, stream);
@@ -145,16 +149,16 @@ const resetWebcamReference = webcamReference => {
 };
 exports.resetWebcamReference = resetWebcamReference;
 const getVideoPermissionQuery = () => navigator.permissions.query({
-  name: "camera"
+  name: 'camera'
 });
 exports.getVideoPermissionQuery = getVideoPermissionQuery;
 const getAudioPermissionQuery = () => navigator.permissions.query({
-  name: "microphone"
+  name: 'microphone'
 });
 exports.getAudioPermissionQuery = getAudioPermissionQuery;
 const b64DataURItoBlob = dataURI => {
-  const byteString = window.atob(dataURI.split(",")[1]);
-  const mimeString = dataURI.split(",")[0].split(":")[1].split(";")[0];
+  const byteString = window.atob(dataURI.split(',')[1]);
+  const mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
   const u8arr = new Uint8Array(byteString.length);
   for (let i = 0; i < byteString.length; i += 1) {
     u8arr[i] = byteString.charCodeAt(i);
@@ -175,18 +179,18 @@ exports.captureWebcamSnapshot = captureWebcamSnapshot;
 const captureScreenshot = async elementIdSelector => {
   try {
     const video = document.querySelector(elementIdSelector);
-    const canvas = document.createElement("canvas");
+    const canvas = document.createElement('canvas');
     if (window.createImageBitmap) {
       const bitmap = await createImageBitmap(video);
       canvas.width = bitmap.width;
       canvas.height = bitmap.height;
-      canvas.getContext("bitmaprenderer").transferFromImageBitmap(bitmap);
+      canvas.getContext('bitmaprenderer').transferFromImageBitmap(bitmap);
       const blob = await new Promise(res => canvas.toBlob(res));
       return blob;
     } else {
       canvas.width = video.videoWidth;
       canvas.height = video.videoHeight;
-      canvas.getContext("2d").drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
+      canvas.getContext('2d').drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
       const blob = await new Promise(resolve => canvas.toBlob(resolve));
       return blob;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newtonschool/react_proctoring_library",
-  "version": "0.0.51",
+  "version": "0.0.53",
   "description": "Used to proctor online tests",
   "author": "ayushkagrawal,shreyachandra,weastel",
   "main": "dist/index.js",