@newtonschool/react_proctoring_library 0.0.16 → 0.0.19

package/dist/components/ProctorApp.js

@@ -11,14 +11,14 @@ require("core-js/modules/es.promise.js");
 
 var _react = _interopRequireWildcard(require("react"));
 
+require("./index.scss");
+
 var _ = require(".");
 
 var _utils = require("../utils");
 
 var _hooks = require("../hooks");
 
-var _defaults = require("../constants/defaults");
-
 var _permissions = require("./permissions");
 
 var _useWebcamData = _interopRequireDefault(require("../hooks/useWebcamData"));
@@ -27,6 +27,8 @@ var _breachUtils = require("../utils/breachUtils");
 
 var _webcamMicrophoneUtils = require("../utils/webcamMicrophoneUtils");
 
+var _defaults = require("../constants/defaults");
+
 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); }
@@ -46,47 +48,61 @@ const ProctorApp = _ref => {
     proctoringIdentifier,
     children,
     config,
+    screensharePermission,
+    requestScreenshare = () => {},
     getProctorParamValues = () => {},
     getWebcamSnapshot = () => {},
     getScreengrab = () => {}
   } = _ref;
   const webcamReference = (0, _react.useRef)(null);
   const canvasReference = (0, _react.useRef)(null);
-  const screenshareReference = (0, _react.useRef)(null);
-  const statistics = (0, _react.useRef)(_defaults.INITIAL_STATISTICS);
-
-  const proctorParams = _objectSpread(_objectSpread({}, {
-    people: true,
-    tabSwitch: true,
-    fullscreenExit: true,
-    lookedAway: true
-  }), config.proctorParams);
-
+  const proctorParams = (0, _react.useMemo)(() => _objectSpread(_objectSpread({}, _defaults.defaultConfig), config.proctorParams), [config.proctorParams]);
+  const statistics = (0, _react.useRef)((0, _breachUtils.getInitialStats)(proctorParams));
   const {
     recurring = false,
     recurringFetchInterval = 0
   } = config;
   const [audioPermission, setAudioPermission] = (0, _react.useState)();
   const [videoPermission, setVideoPermission] = (0, _react.useState)();
-  const [screensharePermission, setScreensharePermission] = (0, _react.useState)();
   const firstFullScreenDone = (0, _react.useRef)(false);
   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 breachData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    const screenshot = await (0, _webcamMicrophoneUtils.captureScreenshot)();
-    getScreengrab(proctoringIdentifier, screenshot, isBreach, breachData.breachedParam);
-  }, [getScreengrab, proctoringIdentifier]);
+    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+
+    if (proctorParams.screenshareSnapshots) {
+      const screenshot = await (0, _webcamMicrophoneUtils.captureScreenshot)();
+      getScreengrab(proctoringIdentifier, screenshot, isBreach, breachedParam);
+    }
+  }, [getScreengrab, proctoringIdentifier, proctorParams.screenshareSnapshots]);
+  const sendWebcamSnapshot = (0, _react.useCallback)(function () {
+    let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+
+    if (proctorParams.webcamSnapshots) {
+      const webcamSnapshot = (0, _utils.captureWebcamSnapshot)(webcamReference);
+
+      if (webcamReference) {
+        getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, isBreach, breachedParam);
+      }
+    }
+  }, [proctoringIdentifier, getWebcamSnapshot, proctorParams.webcamSnapshots]);
+  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] : "";
+    getProctorParamValues(proctoringIdentifier, statistics.current, isBreach, breachParam);
+  }, [proctoringIdentifier, getProctorParamValues]);
+  const {
+    isFullscreen,
+    setFullscreen
+  } = (0, _hooks.useFullscreenData)(firstFullScreenDone, proctorParams.fullscreenExit);
+  const [userCount, lookedAwayCount] = (0, _useWebcamData.default)(webcamReference, canvasReference, proctorParams);
+  const isTabSwitched = !(0, _hooks.usePageVisibility)(proctorParams.tabSwitch) && firstFullScreenDone.current;
   (0, _react.useEffect)(() => {
     if (recurring) {
       recurringFetchIntervalRef.current = setInterval(() => {
-        getProctorParamValues(proctoringIdentifier, statistics.current, false);
-        const webcamSnapshot = (0, _utils.captureWebcamSnapshot)(webcamReference);
-
-        if (webcamReference) {
-          getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, false);
-        }
-
+        sendProctoredParamValues();
+        sendWebcamSnapshot();
         sendScreengrab();
       }, recurringFetchInterval);
     }
@@ -94,62 +110,45 @@ const ProctorApp = _ref => {
     return () => {
       clearInterval(recurringFetchIntervalRef.current);
     };
-  }, [recurring, recurringFetchInterval, proctoringIdentifier, getWebcamSnapshot, getProctorParamValues, sendScreengrab]);
-  const {
-    isFullscreen,
-    setFullscreen,
-    fullScreenExitCount
-  } = (0, _hooks.useFullscreenData)(firstFullScreenDone);
-  const [userCount, lookedAwayCount] = (0, _useWebcamData.default)(webcamReference, canvasReference);
-  const tabSwitchCount = (0, _hooks.useTabSwitchCount)(firstFullScreenDone);
+  }, [recurring, recurringFetchInterval, sendProctoredParamValues, sendWebcamSnapshot, sendScreengrab]);
   (0, _react.useEffect)(() => {
     const currentStats = {
       userCount,
-      tabSwitchCount,
-      fullScreenExitCount,
+      isTabSwitched,
+      isFullscreen,
       lookedAwayCount,
       isWebcamDataReliable: isWebcamProcessingReliable
     };
-    const breachData = (0, _breachUtils.getDataOnBreach)(statistics, currentStats);
+    const breachData = (0, _breachUtils.getDataOnBreach)(statistics, currentStats, proctorParams);
+    (0, _utils.updateStatistics)(statistics, currentStats, proctorParams);
 
     if (breachData) {
-      getProctorParamValues(breachData.proctoringIdentifier, breachData.data, true, breachData.breachedParam);
-
-      if (breachData.breachedParam === "LOOKED_AWAY_COUNT" || breachData.breachedParam === "USER_COUNT_MAX") {
-        const webcamSnapshot = (0, _utils.captureWebcamSnapshot)(webcamReference);
-
-        if (webcamSnapshot) {
-          getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, true, breachData.breachedParam);
-        }
-      } else {
-        sendScreengrab(true, breachData);
-      }
+      sendProctoredParamValues(true, breachData.breachedParam);
+      sendWebcamSnapshot(true, breachData.breachedParam);
+      sendScreengrab(true, breachData.breachedParam);
     }
-
-    (0, _utils.updateStatistics)(statistics, currentStats);
-  }, [userCount, tabSwitchCount, fullScreenExitCount, lookedAwayCount, getProctorParamValues, getWebcamSnapshot, sendScreengrab, proctoringIdentifier]);
-  const updateScreensharePermission = (0, _react.useCallback)(() => {
-    (0, _webcamMicrophoneUtils.setupScreensharePermission)(setScreensharePermission, screenshareReference);
-  }, []);
-
-  if (proctoringIdentifier === undefined) {
-    // todo
-    return;
-  }
-
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isFullscreen && audioPermission && videoPermission && screensharePermission && children, /*#__PURE__*/_react.default.createElement(_permissions.Permission, {
+  }, [userCount, isTabSwitched, isFullscreen, lookedAwayCount, sendProctoredParamValues, sendWebcamSnapshot, sendScreengrab, proctorParams]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(proctorParams.copyPasteProctoring ? "disable-copy-paste fullwidth fullheight" : "fullwidth fullheight")
+  }, (0, _breachUtils.showProctoredComponent)(proctorParams, {
+    isFullscreen,
+    audioPermission,
+    videoPermission,
+    screensharePermission
+  }) && children, /*#__PURE__*/_react.default.createElement(_permissions.Permission, {
+    proctorParams: proctorParams,
     isFullscreen: isFullscreen,
     audioPermisison: audioPermission,
     videoPermission: videoPermission,
     setFullscreen: setFullscreen,
     screensharePermission: screensharePermission,
-    updateScreensharePermission: updateScreensharePermission
+    requestScreenshare: requestScreenshare
   }), /*#__PURE__*/_react.default.createElement(_.ActivityTracker, {
+    proctorParams: proctorParams,
     setAudioPermission: setAudioPermission,
     setVideoPermission: setVideoPermission,
     webcamReference: webcamReference,
-    canvasReference: canvasReference,
-    screenshareReference: screenshareReference
+    canvasReference: canvasReference
   }));
 };
 

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

@@ -7,16 +7,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-require("core-js/modules/es.regexp.exec.js");
-
-require("core-js/modules/es.string.match.js");
-
 var _react = _interopRequireWildcard(require("react"));
 
 var _reactWebcam = _interopRequireDefault(require("react-webcam"));
 
 var _utils = require("../../utils");
 
+var _breachUtils = require("../../utils/breachUtils");
+
+var _browserUtils = require("../../utils/browserUtils");
+
 var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
 
 require("./index.scss");
@@ -27,43 +27,43 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 isChrome = !!navigator.userAgent.match(/chrome|chromium/i);
-
 const ActivityTracker = _ref => {
   let {
+    proctorParams,
     webcamReference,
     canvasReference,
     setAudioPermission,
-    setVideoPermission,
-    screenshareReference
+    setVideoPermission
   } = _ref;
   (0, _react.useEffect)(() => {
-    if (isChrome) {
-      (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
-      (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
-      (0, _webcamMicrophoneUtils.getVideoPermissionQuery)().then(status => {
-        status.onchange = evt => {
-          (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
-        };
-      }).catch(err => {
-        console.log("Video Permission", err);
-      });
-      (0, _webcamMicrophoneUtils.getAudioPermissionQuery)().then(status => {
-        status.onchange = evt => {
-          (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
-        };
-      }).catch(err => {
-        (0, _webcamMicrophoneUtils.updateAudioPermissions)("Audio Permission", err);
-      });
+    if ((0, _browserUtils.isChrome)()) {
+      if ((0, _breachUtils.isWebcamRequired)(proctorParams)) {
+        (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
+        (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
+        (0, _webcamMicrophoneUtils.getVideoPermissionQuery)().then(status => {
+          status.onchange = evt => {
+            (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
+          };
+        }).catch(err => {
+          console.log("Video Permission", err);
+        });
+        (0, _webcamMicrophoneUtils.getAudioPermissionQuery)().then(status => {
+          status.onchange = evt => {
+            (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
+          };
+        }).catch(err => {
+          (0, _webcamMicrophoneUtils.updateAudioPermissions)("Audio Permission", err);
+        });
+      }
     }
-  }, [setVideoPermission, setAudioPermission]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactWebcam.default, {
+  }, [setVideoPermission, setAudioPermission, proctorParams]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _breachUtils.isWebcamRequired)(proctorParams) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactWebcam.default, {
     audio: true,
     muted: true,
     screenshotFormat: "image/jpeg",
     ref: webcamReference,
     onUserMedia: stream => {
-      if (!isChrome) {
+      if (!(0, _browserUtils.isChrome)()) {
         const {
           audio,
           video
@@ -130,7 +130,7 @@ const ActivityTracker = _ref => {
       }
     },
     onUserMediaError: error => {
-      if (!isChrome) {
+      if (!(0, _browserUtils.isChrome)()) {
         setVideoPermission(false);
         setAudioPermission(false);
       }
@@ -140,11 +140,7 @@ const ActivityTracker = _ref => {
     ref: canvasReference,
     className: "captured-video-canvas",
     id: "wc-ref"
-  }), /*#__PURE__*/_react.default.createElement("video", {
-    ref: screenshareReference,
-    className: "captured-video-canvas",
-    id: "ss-ref"
-  }));
+  })));
 };
 
 var _default = ActivityTracker;

package/dist/components/index.js

@@ -21,11 +21,19 @@ Object.defineProperty(exports, "ProctorApp", {
     return _ProctorApp.default;
   }
 });
+Object.defineProperty(exports, "ScreenshareTracker", {
+  enumerable: true,
+  get: function get() {
+    return _screenshare.ScreenshareTracker;
+  }
+});
 
 var _activityTracker = _interopRequireDefault(require("./activity-tracker"));
 
 var _permissions = require("./permissions");
 
+var _screenshare = require("./screenshare");
+
 var _ProctorApp = _interopRequireDefault(require("./ProctorApp"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/components/index.scss

@@ -0,0 +1,12 @@
+.disable-copy-paste {
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+.fullwidth {
+    width: 100%;
+}
+.fullheight {
+    height: 100%;
+    overflow-y: scroll;
+}

package/dist/components/permissions/index.js

@@ -19,6 +19,8 @@ var text = _interopRequireWildcard(require("../../constants/text"));
 
 var _permissionBody = require("./permission-body");
 
+var _breachUtils = require("../../utils/breachUtils");
+
 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; }
@@ -27,14 +29,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 const Permission = _ref => {
   let {
+    proctorParams,
     isFullscreen,
     audioPermisison,
     videoPermission,
     setFullscreen,
     screensharePermission,
-    updateScreensharePermission
+    requestScreenshare
   } = _ref;
-  const showPermissionModal = isFullscreen === false || audioPermisison === false || videoPermission === false || !screensharePermission;
+  const showPermissionModal = isFullscreen === false || (0, _breachUtils.isWebcamRequired)(proctorParams) && audioPermisison === false || (0, _breachUtils.isWebcamRequired)(proctorParams) && videoPermission === false || !screensharePermission;
   return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal, {
     show: showPermissionModal,
     size: "lg",
@@ -59,12 +62,12 @@ const Permission = _ref => {
     src: _askPermission.default
   }), text.VIDEO_UNSUPPORTED_IN_BROWSER)), /*#__PURE__*/_react.default.createElement(_permissionBody.PermissionBody, {
     showFullscreenText: !isFullscreen,
-    showAudioPermissionText: !audioPermisison,
-    showVideoPermissionText: !videoPermission,
-    showScreensharePermission: !screensharePermission
-  })), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Footer, null, !screensharePermission && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    showAudioPermissionText: !audioPermisison && (0, _breachUtils.isWebcamRequired)(proctorParams),
+    showVideoPermissionText: !videoPermission && (0, _breachUtils.isWebcamRequired)(proctorParams),
+    showScreensharePermission: !screensharePermission && proctorParams.screenshareSnapshots
+  })), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Modal.Footer, null, !screensharePermission && proctorParams.screenshareSnapshots && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     onClick: () => {
-      updateScreensharePermission();
+      requestScreenshare();
     }
   }, text.ALLOW_SCREENSHARE), screensharePermission && !isFullscreen && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
     variant: "primary",

package/dist/components/permissions/permission-body.js

@@ -15,6 +15,8 @@ require("./index.scss");
 
 var text = _interopRequireWildcard(require("../../constants/text"));
 
+var _browserUtils = require("../../utils/browserUtils");
+
 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; }
@@ -32,7 +34,7 @@ const PermissionBody = _ref => {
     className: "mb-2"
   }, text.PERMISSION_GENERIC), showScreensharePermission && /*#__PURE__*/_react.default.createElement("div", {
     className: "mb-2"
-  }, /*#__PURE__*/_react.default.createElement("span", {
+  }, !(0, _browserUtils.isChrome)() && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("strong", null, "Please switch to chrome"), /*#__PURE__*/_react.default.createElement("br", null)), /*#__PURE__*/_react.default.createElement("span", {
     className: "pr-2 font-weight-bold"
   }, "Screenshare:"), text.PERMISSION_SCREENSHARE), showAudioPermissionText && showVideoPermissionText ? /*#__PURE__*/_react.default.createElement("div", {
     className: "mb-2"

package/dist/components/screenshare/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ScreenshareTracker = void 0;
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
+
+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 ScreenshareTracker = _ref => {
+  let {
+    triggerRequestPermission,
+    permissionChangeCallback
+  } = _ref;
+  const [screensharePermission, setScreensharePermission] = (0, _react.useState)();
+  const screenshareReference = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    permissionChangeCallback(screensharePermission);
+  }, [screensharePermission, permissionChangeCallback]);
+  (0, _react.useEffect)(() => {
+    if (triggerRequestPermission) {
+      (0, _webcamMicrophoneUtils.setupScreensharePermission)(setScreensharePermission, screenshareReference);
+    }
+  }, [triggerRequestPermission]);
+  return /*#__PURE__*/_react.default.createElement("video", {
+    ref: screenshareReference,
+    className: "captured-video-canvas",
+    id: "ss-ref"
+  });
+};
+
+exports.ScreenshareTracker = ScreenshareTracker;

package/dist/components/screenshare/index.scss

@@ -0,0 +1,4 @@
+.captured-video-canvas {
+  visibility: hidden;
+  position: absolute;
+}

package/dist/constants/defaults.js

@@ -3,40 +3,45 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.initialValues = exports.gpuTypes = exports.glancePercentageToPass = exports.evaluateVideoIntervalInSeconds = exports.bodyPixConfigs = exports.INITIAL_STATISTICS = void 0;
+exports.initialValues = exports.gpuTypes = exports.evaluateVideoIntervalInSeconds = exports.defaultConfig = exports.STATS_PARAMS = exports.INITIAL_STATISTICS = void 0;
+const defaultConfig = {
+  people: true,
+  tabSwitch: true,
+  fullscreenExit: true,
+  lookedAway: true,
+  webcamSnapshots: true,
+  screenshareSnapshots: true,
+  copyPasteProctoring: true
+};
+exports.defaultConfig = defaultConfig;
 const initialValues = {
-  tabSwitchCount: 0,
+  isTabSwitched: false,
   userCount: 0,
   isWebcamDataReliable: true,
   isWatching: true,
   canOpenFullScreen: false,
-  fullScreenExitCount: 0,
+  isFullscreen: false,
   lookedAwayCount: 0,
   firstTimeFullScreen: true
 };
 exports.initialValues = initialValues;
+const STATS_PARAMS = {
+  isTabSwitched: "IS_TAB_SWITCHED",
+  isFullscreen: "IS_FULLSCREEN",
+  lookedAwayCount: "LOOKED_AWAY_COUNT",
+  userCountMax: "USER_COUNT_MAX",
+  isWebcamReliable: "IS_WEBCAM_DATA_RELIABLE"
+};
+exports.STATS_PARAMS = STATS_PARAMS;
 const INITIAL_STATISTICS = {
-  TAB_SWITCH_COUNT: initialValues.tabSwitchCount,
-  FULLSCREEN_EXIT_COUNT: initialValues.fullScreenExitCount,
-  LOOKED_AWAY_COUNT: initialValues.lookedAwayCount,
-  USER_COUNT_MAX: initialValues.userCount,
-  IS_WEBCAM_DATA_RELIABLE: initialValues.isWebcamDataReliable
+  [STATS_PARAMS.isTabSwitched]: initialValues.isTabSwitched,
+  [STATS_PARAMS.isFullscreen]: initialValues.isFullscreen,
+  [STATS_PARAMS.lookedAwayCount]: initialValues.lookedAwayCount,
+  [STATS_PARAMS.userCountMax]: initialValues.userCount,
+  [STATS_PARAMS.isWebcamReliable]: initialValues.isWebcamDataReliable
 };
 exports.INITIAL_STATISTICS = INITIAL_STATISTICS;
-const bodyPixConfigs = {
-  flipHorizontal: false,
-  internalResolution: "medium",
-  segmentationThreshold: 0.4,
-  maxDetections: 10,
-  scoreThreshold: 0.2,
-  nmsRadius: 20,
-  minKeypointScore: 0.3,
-  refineSteps: 10
-};
-exports.bodyPixConfigs = bodyPixConfigs;
-const glancePercentageToPass = 60;
-exports.glancePercentageToPass = glancePercentageToPass;
-const evaluateVideoIntervalInSeconds = 1;
+const evaluateVideoIntervalInSeconds = 5;
 exports.evaluateVideoIntervalInSeconds = evaluateVideoIntervalInSeconds;
 const gpuTypes = ["intel", "apple", "amd", "radeon", "nvidia", "geforce"];
 exports.gpuTypes = gpuTypes;

package/dist/hooks/index.js

@@ -15,17 +15,9 @@ Object.defineProperty(exports, "usePageVisibility", {
     return _usePageVisibility.default;
   }
 });
-Object.defineProperty(exports, "useTabSwitchCount", {
-  enumerable: true,
-  get: function get() {
-    return _useTabSwitchCount.default;
-  }
-});
 
 var _useFullScreenData = _interopRequireDefault(require("./useFullScreenData"));
 
 var _usePageVisibility = _interopRequireDefault(require("./usePageVisibility"));
 
-var _useTabSwitchCount = _interopRequireDefault(require("./useTabSwitchCount"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/dist/hooks/useFullScreenData.js

@@ -9,25 +9,18 @@ require("core-js/modules/web.dom-collections.iterator.js");
 
 var _react = require("react");
 
-var _defaults = require("../constants/defaults");
-
 var _utils = require("../utils");
 
 const browserFullscreenElementProp = (0, _utils.getBrowserFullscreenElementProp)();
 
-function useFullscreenData(firstFullScreenDone) {
+function useFullscreenData(firstFullScreenDone, isProctorParam) {
   const fullScreenElement = (0, _react.useRef)(document.documentElement);
   const [isFullscreen, setIsFullscreen] = (0, _react.useState)(document[browserFullscreenElementProp] != null);
-  const [fullScreenExitCount, setFullScreenExitCount] = (0, _react.useState)(_defaults.initialValues.fullScreenExitCount);
   (0, _react.useEffect)(() => {
-    if (!isFullscreen && firstFullScreenDone.current) {
-      setFullScreenExitCount(fullScreenExitCount => fullScreenExitCount + 1);
-    }
-
-    if (isFullscreen && !firstFullScreenDone.current) {
+    if (isFullscreen && !firstFullScreenDone.current || !isProctorParam) {
       firstFullScreenDone.current = true;
     }
-  }, [isFullscreen, firstFullScreenDone]);
+  }, [isFullscreen, firstFullScreenDone, isProctorParam]);
 
   const setFullscreen = () => {
     if (!fullScreenElement || !fullScreenElement.current) {
@@ -42,13 +35,14 @@ function useFullscreenData(firstFullScreenDone) {
   };
 
   (0, _react.useEffect)(() => {
-    document.onfullscreenchange = () => setIsFullscreen(document[browserFullscreenElementProp] != null);
+    if (isProctorParam) {
+      document.onfullscreenchange = () => setIsFullscreen(document[browserFullscreenElementProp] != null);
+    }
 
     return () => document.onfullscreenchange = undefined;
-  }, []);
+  }, [isProctorParam]);
   return {
     isFullscreen,
-    setFullscreen,
-    fullScreenExitCount
+    setFullscreen
   };
 }

package/dist/hooks/usePageVisibility.js

@@ -13,7 +13,7 @@ var _utils = require("../utils");
 
 const visibilityChangeEvent = (0, _utils.getVisibilityChangeEventName)();
 
-function usePageVisibility() {
+function usePageVisibility(isProctorParam) {
   const [isVisible, setIsVisible] = (0, _react.useState)((0, _utils.getIsDocumentVisible)());
 
   const updateVisibility = () => {
@@ -27,5 +27,5 @@ function usePageVisibility() {
       document.removeEventListener(visibilityChangeEvent, updateVisibility);
     };
   }, []);
-  return isVisible;
+  return !isVisible && isProctorParam;
 }

package/dist/hooks/useWebcamData.js

@@ -11,7 +11,7 @@ require("core-js/modules/web.dom-collections.iterator.js");
 
 var _react = require("react");
 
-var bodyPix = _interopRequireWildcard(require("@tensorflow-models/body-pix"));
+var cocoSsd = _interopRequireWildcard(require("@tensorflow-models/coco-ssd"));
 
 var tf = _interopRequireWildcard(require("@tensorflow/tfjs"));
 
@@ -23,56 +23,48 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-/* https://stackoverflow.com/questions/63441878/bodypix-error-no-backend-found-in-registry */
-const getUsers = async (network, video) => {
+const getUserCount = async (model, image) => {
   try {
-    return await network.segmentMultiPerson(video, _defaults.bodyPixConfigs);
+    let predictions = await model.detect(image);
+    let numOfUsers = 0;
+    predictions.forEach(prediction => {
+      if (prediction.class === "person") {
+        numOfUsers += 1;
+      }
+    });
+    return numOfUsers;
   } catch (err) {
     console.log("Error Trace:", err);
   }
 };
 
-const getIsWatching = async (network, video) => {
-  try {
-    const partSegmentation = await network.segmentPersonParts(video, _defaults.bodyPixConfigs);
-    const currentPercentage = (0, _utils.getGlancePercentage)(partSegmentation);
-    return currentPercentage >= _defaults.glancePercentageToPass;
-  } catch (err) {
-    console.log("Error Trace:", err);
-  }
-};
-
-function useWebcamData(webcamReference, canvasReference) {
+function useWebcamData(webcamReference, canvasReference, proctorParams) {
   const [userCount, setUserCount] = (0, _react.useState)(_defaults.initialValues.userCount);
-  const [isWatching, setIsWatching] = (0, _react.useState)(_defaults.initialValues.isWatching);
+  const isWatching = (0, _react.useState)(_defaults.initialValues.isWatching);
   const [lookedAwayCount, setLookedAwayCount] = (0, _react.useState)(_defaults.initialValues.lookedAwayCount);
   (0, _react.useEffect)(() => {
-    if ((0, _utils.isGPUAvailable)()) {
-      const loadBodyPixModel = async () => {
+    if ((0, _utils.isGPUAvailable)() && proctorParams.people && proctorParams.lookedAwayCount) {
+      const loadCocoSSDModel = async () => {
         try {
-          const network = await bodyPix.load();
+          const model = await cocoSsd.load();
           setInterval(async () => {
             if ((0, _utils.isWebcamVideoValid)(webcamReference)) {
-              var _users$length;
-
               const video = webcamReference.current.video;
               const {
                 videoWidth,
                 videoHeight
               } = video;
-              video.width = videoWidth;
-              video.height = videoHeight;
+              const b64Snapshot = webcamReference.current.getScreenshot();
+              const webcamSnapShot = new Image(videoWidth, videoHeight);
+              webcamSnapShot.src = b64Snapshot;
+
+              webcamSnapShot.onload = async () => {
+                const count = await getUserCount(model, webcamSnapShot);
+                setUserCount(count);
+              };
+
               canvasReference.current.width = videoWidth;
               canvasReference.current.height = videoHeight;
-              const users = await getUsers(network, video);
-              const count = (_users$length = users === null || users === void 0 ? void 0 : users.length) !== null && _users$length !== void 0 ? _users$length : 0;
-              setUserCount(count);
-
-              if (count) {
-                setIsWatching(getIsWatching(network, video));
-              } else {
-                setIsWatching(false);
-              }
             }
           }, _defaults.evaluateVideoIntervalInSeconds * 1000);
         } catch (err) {
@@ -81,9 +73,9 @@ function useWebcamData(webcamReference, canvasReference) {
         }
       };
 
-      loadBodyPixModel();
+      loadCocoSSDModel();
     }
-  }, [webcamReference, canvasReference]);
+  }, [webcamReference, canvasReference, proctorParams.people, proctorParams.lookedAwayCount]);
   (0, _react.useEffect)(() => {
     if (!isWatching) {
       setLookedAwayCount(lookedAwayCount => lookedAwayCount + 1);

package/dist/index.js

@@ -9,5 +9,11 @@ Object.defineProperty(exports, "ProctorApp", {
     return _components.ProctorApp;
   }
 });
+Object.defineProperty(exports, "ScreenshareTracker", {
+  enumerable: true,
+  get: function get() {
+    return _components.ScreenshareTracker;
+  }
+});
 
 var _components = require("./components");

package/dist/utils/breachUtils.js

@@ -3,7 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getDataOnBreach = void 0;
+exports.showProctoredComponent = exports.isWebcamRequired = exports.getInitialStats = exports.getDataOnBreach = void 0;
+
+var _defaults = require("../constants/defaults");
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -11,63 +13,106 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-const getDataOnBreach = (statistics, currentData) => {
+const getInitialStats = proctorParams => {
+  const initialStats = {};
+
+  if (proctorParams.people) {
+    initialStats[_defaults.STATS_PARAMS.userCountMax] = _defaults.initialValues.userCount;
+  }
+
+  if (proctorParams.tabSwitch) {
+    initialStats[_defaults.STATS_PARAMS.isTabSwitched] = _defaults.initialValues.isTabSwitched;
+  }
+
+  if (proctorParams.fullscreenExit) {
+    initialStats[_defaults.STATS_PARAMS.isFullscreen] = _defaults.initialValues.isFullscreen;
+  }
+
+  if (proctorParams.lookedAway) {
+    initialStats[_defaults.STATS_PARAMS.lookedAwayCount] = _defaults.initialValues.lookedAwayCount;
+  }
+
+  return initialStats;
+};
+
+exports.getInitialStats = getInitialStats;
+
+const isWebcamRequired = proctorParams => proctorParams.people || proctorParams.lookedAway || proctorParams.webcamSnapshots;
+
+exports.isWebcamRequired = isWebcamRequired;
+
+const showProctoredComponent = (proctorParams, permissions) => {
+  return (!proctorParams.fullscreenExit || permissions.isFullscreen) && (!isWebcamRequired(proctorParams) || permissions.audioPermission && permissions.videoPermission) && (!proctorParams.screenshareSnapshots || permissions.screensharePermission);
+};
+
+exports.showProctoredComponent = showProctoredComponent;
+
+const getDataOnBreach = (statistics, currentData, proctorParams) => {
   const {
     userCount,
-    tabSwitchCount,
-    fullScreenExitCount,
+    isTabSwitched,
+    isFullscreen,
     lookedAwayCount,
     isWebcamDataReliable
   } = currentData;
   const timestamp = Date.now();
   const data = statistics.current;
+  const isWebCamReliableParam = _defaults.STATS_PARAMS.isWebcamReliable;
 
-  if (data.IS_WEBCAM_DATA_RELIABLE !== isWebcamDataReliable) {
+  if (isWebcamRequired(proctorParams) && data[isWebCamReliableParam] !== isWebcamDataReliable) {
     return {
-      breachedParam: "IS_WEBCAM_DATA_RELIABLE",
+      breachedParam: isWebCamReliableParam,
       timestamp,
       data: _objectSpread(_objectSpread({}, data), {}, {
-        IS_WEBCAM_DATA_RELIABLE: isWebcamDataReliable
+        [isWebCamReliableParam]: isWebcamDataReliable
       })
     };
   }
 
-  if (data.USER_COUNT_MAX < userCount) {
+  const userCountMaxParam = _defaults.STATS_PARAMS.userCountMax;
+
+  if (proctorParams.people && data[userCountMaxParam] < userCount) {
     return {
-      breachedParam: "USER_COUNT_MAX",
+      breachedParam: userCountMaxParam,
       timestamp,
       data: _objectSpread(_objectSpread({}, data), {}, {
-        USER_COUNT_MAX: userCount
+        [userCountMaxParam]: userCount
       })
     };
   }
 
-  if (data.TAB_SWITCH_COUNT !== tabSwitchCount) {
+  const isTabSwitchedParam = _defaults.STATS_PARAMS.isTabSwitched;
+
+  if (proctorParams.tabSwitch && isTabSwitched && !data[isTabSwitchedParam]) {
     return {
-      breachedParam: "TAB_SWITCH_COUNT",
+      breachedParam: isTabSwitchedParam,
       timestamp,
       data: _objectSpread(_objectSpread({}, data), {}, {
-        TAB_SWITCH_COUNT: tabSwitchCount
+        [isTabSwitchedParam]: isTabSwitched
       })
     };
   }
 
-  if (data.FULLSCREEN_EXIT_COUNT !== fullScreenExitCount) {
+  const fullscreenExitParam = _defaults.STATS_PARAMS.isFullscreen;
+
+  if (proctorParams.fullscreenExit && !isFullscreen && data[fullscreenExitParam]) {
     return {
-      breachedParam: "FULLSCREEN_EXIT_COUNT",
+      breachedParam: fullscreenExitParam,
       timestamp,
       data: _objectSpread(_objectSpread({}, data), {}, {
-        FULLSCREEN_EXIT_COUNT: fullScreenExitCount
+        [fullscreenExitParam]: isFullscreen
       })
     };
   }
 
-  if (data.LOOKED_AWAY_COUNT !== lookedAwayCount) {
+  const lookedAwayParam = _defaults.STATS_PARAMS.lookedAwayCount;
+
+  if (proctorParams.lookedAway && data[lookedAwayParam] !== lookedAwayCount) {
     return {
-      breachedParam: "LOOKED_AWAY_COUNT",
+      breachedParam: lookedAwayParam,
       timestamp,
       data: _objectSpread(_objectSpread({}, data), {}, {
-        LOOKED_AWAY_COUNT: lookedAwayCount
+        [lookedAwayParam]: lookedAwayCount
       })
     };
   }

package/dist/utils/browserUtils.js

@@ -3,7 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getVisibilityChangeEventName = exports.getIsDocumentVisible = exports.getBrowserFullscreenElementProp = void 0;
+exports.isChrome = exports.getVisibilityChangeEventName = exports.getIsDocumentVisible = exports.getBrowserFullscreenElementProp = void 0;
+
+require("core-js/modules/es.regexp.exec.js");
+
+require("core-js/modules/es.string.match.js");
+
 const PROPERTY_TYPES = {
   HIDDEN: "hidden",
   VISIBILITY_CHANGE: "visibilitychange"
@@ -60,4 +65,8 @@ const getBrowserFullscreenElementProp = () => {
   }
 };
 
-exports.getBrowserFullscreenElementProp = getBrowserFullscreenElementProp;
+exports.getBrowserFullscreenElementProp = getBrowserFullscreenElementProp;
+
+const isChrome = () => !!navigator.userAgent.match(/chrome|chromium/i);
+
+exports.isChrome = isChrome;

package/dist/utils/index.js

@@ -3,12 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "addOrUpdateStatsToLocalStorage", {
-  enumerable: true,
-  get: function get() {
-    return _localStorageUtils.addOrUpdateStatsToLocalStorage;
-  }
-});
 Object.defineProperty(exports, "captureWebcamSnapshot", {
   enumerable: true,
   get: function get() {
@@ -33,24 +27,12 @@ Object.defineProperty(exports, "getBrowserFullscreenElementProp", {
     return _browserUtils.getBrowserFullscreenElementProp;
   }
 });
-Object.defineProperty(exports, "getGlancePercentage", {
-  enumerable: true,
-  get: function get() {
-    return _webcamMicrophoneUtils.getGlancePercentage;
-  }
-});
 Object.defineProperty(exports, "getIsDocumentVisible", {
   enumerable: true,
   get: function get() {
     return _browserUtils.getIsDocumentVisible;
   }
 });
-Object.defineProperty(exports, "getStatistics", {
-  enumerable: true,
-  get: function get() {
-    return _localStorageUtils.getStatistics;
-  }
-});
 Object.defineProperty(exports, "getVideoPermission", {
   enumerable: true,
   get: function get() {
@@ -81,24 +63,6 @@ Object.defineProperty(exports, "isWebcamVideoValid", {
     return _webcamMicrophoneUtils.isWebcamVideoValid;
   }
 });
-Object.defineProperty(exports, "removeStatsFromLocalStorage", {
-  enumerable: true,
-  get: function get() {
-    return _localStorageUtils.removeStatsFromLocalStorage;
-  }
-});
-Object.defineProperty(exports, "retrieveStatsFromLocalStorage", {
-  enumerable: true,
-  get: function get() {
-    return _localStorageUtils.retrieveStatsFromLocalStorage;
-  }
-});
-Object.defineProperty(exports, "sendDataOnBreach", {
-  enumerable: true,
-  get: function get() {
-    return _breachUtils.sendDataOnBreach;
-  }
-});
 Object.defineProperty(exports, "updateStatistics", {
   enumerable: true,
   get: function get() {
@@ -106,14 +70,10 @@ Object.defineProperty(exports, "updateStatistics", {
   }
 });
 
-var _localStorageUtils = require("./localStorageUtils");
-
 var _webcamMicrophoneUtils = require("./webcamMicrophoneUtils");
 
 var _browserUtils = require("./browserUtils");
 
-var _breachUtils = require("./breachUtils");
-
 var _arrayUtils = require("./arrayUtils");
 
 var _gpuUtils = require("./gpuUtils");

package/dist/utils/webcamMicrophoneUtils.js

@@ -25,24 +25,39 @@ var _ = require(".");
 
 var _html2canvas = _interopRequireDefault(require("html2canvas"));
 
+var _defaults = require("../constants/defaults");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 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) => {
+const updateStatistics = (statistics, currentStats, proctorParams) => {
   const {
-    tabSwitchCount,
-    fullScreenExitCount,
+    isTabSwitched,
+    isFullscreen,
     lookedAwayCount,
     userCount,
     isWebcamDataReliable
   } = currentStats;
-  statistics.current.TAB_SWITCH_COUNT = tabSwitchCount;
-  statistics.current.FULLSCREEN_EXIT_COUNT = fullScreenExitCount;
-  statistics.current.LOOKED_AWAY_COUNT = lookedAwayCount;
-  statistics.current.USER_COUNT_MAX = Math.max(userCount, statistics.current.USER_COUNT_MAX);
+
+  if (proctorParams.tabSwitch) {
+    statistics.current[_defaults.STATS_PARAMS.isTabSwitched] = isTabSwitched;
+  }
+
+  if (proctorParams.fullscreenExit) {
+    statistics.current[_defaults.STATS_PARAMS.isFullscreen] = isFullscreen;
+  }
+
+  if (proctorParams.lookedAway) {
+    statistics.current[_defaults.STATS_PARAMS.lookedAwayCount] = lookedAwayCount;
+  }
+
+  if (proctorParams.people) {
+    statistics.current[_defaults.STATS_PARAMS.userCountMax] = Math.max(userCount, statistics.current[_defaults.STATS_PARAMS.userCountMax]);
+  }
+
   statistics.current.IS_WEBCAM_DATA_RELIABLE = isWebcamDataReliable;
 };
 
@@ -136,6 +151,7 @@ const setupScreensharePermission = (setScreensharePermission, screenshareReferen
   const track = stream.getTracks()[0];
 
   if (track.getSettings().displaySurface === "monitor") {
+    setScreensharePermission(true);
     screenshareReference.current.srcObject = stream;
 
     screenshareReference.current.onloadedmetadata = e => {
@@ -144,9 +160,8 @@ const setupScreensharePermission = (setScreensharePermission, screenshareReferen
 
     track.onended = e => {
       setScreensharePermission(false);
+      screenshareReference.current.srcObject = null;
     };
-
-    setScreensharePermission(true);
   } else {
     screenshareReference.current = null;
     setScreensharePermission(false);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newtonschool/react_proctoring_library",
-  "version": "0.0.16",
+  "version": "0.0.19",
   "description": "Used to proctor online tests",
   "author": "ayushkagrawal,shreyachandra",
   "main": "dist/index.js",
@@ -13,7 +13,7 @@
     ""
   ],
   "dependencies": {
-    "@tensorflow-models/body-pix": "^2.2.0",
+    "@tensorflow-models/coco-ssd": "^2.2.2",
     "@tensorflow/tfjs": "^3.9.0",
     "bootstrap": "^5.1.3",
     "core-js": "^3.22.7",