Typescript: dom.lib.ts: MediaDevices.getDisplayMedia is in the wrong place

[Spongman]

TypeScript Version: 3.5.1

https://w3c.github.io/mediacapture-screen-share/#mediadevices-additions

in dom.lib.ts navigator.mediaDevices.getDisplayMedia is not found. it looks like it's defined on navigator whereas it should be in the MediaDevices type.

https://github.com/microsoft/TypeScript/blob/87058448797597e6e8bd13ff3d8823fff5607df6/lib/lib.dom.d.ts#L10579-L10583

[sandersn]

Broken since 2.9 (or maybe 2.8, hard to tell where the cutoff is). 79e5e79ef77

[sandersn]

I'm not sure where this is coming from actually. It's not anywhere in src/lib and a recursive grep of the typescript repo only turns up the one hit for getDisplayMedia (outside tests). I need to look at the code that generates the LKG I guess.

[sandersn]

This goes away entirely in https://github.com/microsoft/TypeScript/pull/32578. That explains why I can't find any mention of it in the source.

[sandersn]

Closing for now. We can investigate re-adding it under MediaDevices, based on the w3c spec.

[danouche93]

Hi @sandersn this is a huge issue for us, can you please tell us what is the status of it or a workaround we can use ?? We don't find the getDisplayMedia anywhere

[sandersn]

It's been a while since I looked at this, so this is a bit of a guess:

1. getDisplayMedia was in the wrong place.
2. In July (which was TS 3.7 I think?), getDisplayMedia got deleted entirely.
3. The next step for a fix is to add MediaDevices to microsoft/TSJS-lib-generator, based on the w3c spec ideally.

[Spongman]

How about not closing issues until they, you know, actually get fixed? Then, maybe, they won’t get dropped on the floor like this?

[sandersn]

@Spongman you are looking for #33232 I think. This issue tracked getDisplayMedia being in the wrong place.

[Spongman]

surely that's a duplicate of this issue?

[danouche93]

I finally fix the issue by using Javascript instead of typescript

[LuisFelipeMunoz]

in vue add interfaces in shims-tsx.d.ts
`import Vue, { VNode } from 'vue'

declare global {
namespace JSX {
// tslint:disable no-empty-interface
interface Element extends VNode { }
// tslint:disable no-empty-interface
interface ElementClass extends Vue { }
interface IntrinsicElements {
[elem: string]: any;
}
}
interface MediaDevices {
getDisplayMedia(constraints?: MediaStreamConstraints): Promise;
}

interface MediaTrackConstraintSet {
cursor?: string;
}
}`
this is a temporary solution