Issue
In my Angular app, there is a requirement to record screen. I've used navigator.mediaDevices.getDisplayMedia to capture screen. It is working in local. But could see errors in the command line like Property 'getDisplayMedia' does not exist on type 'MediaDevices'.. Because of this error, I could not generate the build file.
Here is my code:
const videoOptions = {
video: {
cursor: 'always'
},
audio: true,
};
this.captureStream = await navigator.mediaDevices.getDisplayMedia(videoOptions);
I'm using
- Angular CLI: 11.0.2
- TS: 4.0.5
Thank you
Solution
Like you can see the getDisplayMedia is not define in the typescript definitions
/** Provides access to connected media input devices like cameras and microphones, as well as screen sharing. In essence, it lets you obtain access to any hardware source of media data. */
interface MediaDevices extends EventTarget {
ondevicechange: ((this: MediaDevices, ev: Event) => any) | null;
enumerateDevices(): Promise<MediaDeviceInfo[]>;
getSupportedConstraints(): MediaTrackSupportedConstraints;
getUserMedia(constraints?: MediaStreamConstraints): Promise<MediaStream>;
addEventListener<K extends keyof MediaDevicesEventMap>(type: K, listener: (this: MediaDevices, ev: MediaDevicesEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
removeEventListener<K extends keyof MediaDevicesEventMap>(type: K, listener: (this: MediaDevices, ev: MediaDevicesEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
}
so you can use:
// @ts-ignore
await navigator.mediaDevices.getDisplayMedia...
You can find the problem here https://github.com/microsoft/TypeScript/issues/33232
Answered By - nicearma
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.