undefined - js error getting displayMedia

Question

Issue: When pressing the Screen or Stop Share Buttons, I get errors, but only on Sololearn.

How to replicate: On bottom right there is a purple button. Press that button then press the icon with an arrow. You can find two buttons there. Those are the ones with problems.

I have this code made in codepen:
https://codepen.io/AlexTAG/pen/jOGJwEJ?editors=1010

It works just as expected, but then i copy pasted it in Sololearn and I get errors when trying to share the screen, on both PC and mobile.

I don't know what the issue is. Could it be that what i am doing is not supported in sololearn?
Code with issues:
https://code.sololearn.com/WLlmcZ71i6I7

Answer 1

Sololearn the app(iOS and android) doesn't support navigator.mediaDevices and more importantly none of the mobile browsers listed on MDN support navigator.mediaDevices.getDisplayMedia().

btw - sololearn android app uses webview to render content

https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

Sololearn website is whole other issue:

When I ran you code using chrome got this error message-- "Error: SecurityError: Failed to execute 'getDisplayMedia' on 'MediaDevices': Access to the feature "display-capture" is disallowed by permission policy."

Codepen allows it's iframe to display-capture while sololearn doesn't, this
can be seen via the developers console.

I also ran your code using firefox, here I got a pop up asking for permission to-- "Allow code.sololearn.com to see your screen". Code ran fine once allowed my screen to seen.

The issue appears to be due to Feature-Policy/Permissions-Policy which chrome supports but firefox doesn't.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Feature-Policy

Answer 2

Definitely a support issue. But just in case, contact Kode Krasher.