diff --git a/ui/src/useRoom.ts b/ui/src/useRoom.ts index d65421e..c54c6e3 100644 --- a/ui/src/useRoom.ts +++ b/ui/src/useRoom.ts @@ -317,17 +317,31 @@ export const useRoom = (config: UIConfig): UseRoom => { const share = async () => { if (!navigator.mediaDevices) { enqueueSnackbar( - 'Could not start presentation. (mediaDevices undefined) Are you using https?', - { - variant: 'error', - persist: true, - } + 'Could not start presentation. Are you using https? (mediaDevices undefined)', + {variant: 'error', persist: true} ); return; } - stream.current = await navigator.mediaDevices.getDisplayMedia({ - video: {frameRate: loadSettings().framerate}, - }); + if (typeof navigator.mediaDevices.getDisplayMedia !== 'function') { + enqueueSnackbar( + `Could not start presentation. Your browser likely doesn't support screensharing. (mediaDevices.getDeviceMedia ${typeof navigator.mediaDevices.getDisplayMedia})`, + {variant: 'error', persist: true} + ); + return; + } + try { + stream.current = await navigator.mediaDevices.getDisplayMedia({ + video: {frameRate: loadSettings().framerate}, + }); + } catch (e) { + console.log('Could not getDisplayMedia', e); + enqueueSnackbar(`Could not start presentation. (getDisplayMedia error). ${e}`, { + variant: 'error', + persist: true, + }); + return; + } + stream.current?.getVideoTracks()[0].addEventListener('ended', () => stopShare()); setState((current) => (current ? {...current, hostStream: stream.current} : current));