feat: add desktopCapturer.getMediaSourceIdForWebContents() to get stream source id from web contents (#22701)

* feat: add desktopCapturer.getMediaSourceIdForWebContents() to get stream source id from web contents

* Cleanup from #22701 PR comments

docs/api/desktop-capturer.md

@@ -72,6 +72,50 @@ const constraints = {
 }
 ```
 
+This example shows how to capture a video from a [WebContents](web-contents.md)
+
+```javascript
+// In the renderer process.
+const { desktopCapturer, remote } = require('electron')
+
+desktopCapturer.getMediaSourceIdForWebContents(remote.getCurrentWebContents().id).then(async mediaSourceId => {
+  try {
+    const stream = await navigator.mediaDevices.getUserMedia({
+      audio: {
+        mandatory: {
+          chromeMediaSource: 'tab',
+          chromeMediaSourceId: mediaSourceId
+        }
+      },
+      video: {
+        mandatory: {
+          chromeMediaSource: 'tab',
+          chromeMediaSourceId: mediaSourceId,
+          minWidth: 1280,
+          maxWidth: 1280,
+          minHeight: 720,
+          maxHeight: 720
+        }
+      }
+    })
+    handleStream(stream)
+  } catch (e) {
+    handleError(e)
+  }
+})
+
+function handleStream (stream) {
+  const video = document.querySelector('video')
+  video.srcObject = stream
+  video.onloadedmetadata = (e) => video.play()
+}
+
+function handleError (e) {
+  console.log(e)
+}
+```
+
+
 ## Methods
 
 The `desktopCapturer` module has the following methods:
@@ -94,6 +138,15 @@ Returns `Promise<DesktopCapturerSource[]>` - Resolves with an array of [`Desktop
 **Note** Capturing the screen contents requires user consent on macOS 10.15 Catalina or higher,
 which can detected by [`systemPreferences.getMediaAccessStatus`].
 
+### `desktopCapturer.getMediaSourceIdForWebContents(webContentsId)`
+
+* `webContentsId` number - Id of the WebContents to get stream of
+
+Returns `Promise<string>` - Resolves with the identifier of a WebContents stream, this identifier can be
+used with [`navigator.mediaDevices.getUserMedia`].
+The identifier is **only valid for 10 seconds**.
+The identifier may be empty if not requested from a renderer process.
+
 [`navigator.mediaDevices.getUserMedia`]: https://developer.mozilla.org/en/docs/Web/API/MediaDevices/getUserMedia
 [`systemPreferences.getMediaAccessStatus`]: system-preferences.md#systempreferencesgetmediaaccessstatusmediatype-macos