Screen Sharing

Share your screen with other participants during a call. The browser will prompt users to select which screen, window, or browser tab to share.

Start Screen Sharing

Begin sharing your screen:

CometChatCalls.startScreenSharing();

The browser will display a dialog allowing the user to choose:

• Entire screen
• Application window
• Browser tab

Stop Screen Sharing

Stop the current screen share:

CometChatCalls.stopScreenSharing();

Screen Sharing Events

Local Screen Share Events

Monitor your own screen sharing state:

CometChatCalls.addEventListener("onScreenShareStarted", () => {
  console.log("You started screen sharing");
});

CometChatCalls.addEventListener("onScreenShareStopped", () => {
  console.log("You stopped screen sharing");
});

Participant Screen Share Events

Monitor when other participants start or stop screen sharing:

CometChatCalls.addEventListener("onParticipantStartedScreenShare", (participant) => {
  console.log(`${participant.name} started screen sharing`);
});

CometChatCalls.addEventListener("onParticipantStoppedScreenShare", (participant) => {
  console.log(`${participant.name} stopped screen sharing`);
});

Screen Sharing Button

Hide Screen Sharing Button

To hide the screen sharing button from the control panel:

const callSettings = {
  hideScreenSharingButton: true,
  // ... other settings
};

Listen for Button Clicks

Intercept screen share button clicks for custom behavior:

CometChatCalls.addEventListener("onScreenShareButtonClicked", () => {
  console.log("Screen share button clicked");
});

Browser Support

Screen sharing requires browser support for the getDisplayMedia API:

Browser	Support
Chrome	✅ Full support
Firefox	✅ Full support
Safari	✅ Safari 13+
Edge	✅ Full support

Screen sharing requires HTTPS in production. Localhost is exempt during development.