Melhorias no compartilhamento de tela no Chrome 109

François Beaufort
François Beaufort

Os apps da Web já podem usar getDisplayMedia() para capturar guias, janelas ou telas como uma MediaStream. No Chrome 109, você pode aproveitar as seguintes melhorias:

  • Quando o compartilhamento de tela é iniciado, o foco condicional permite que o app da Web de captura controle se o navegador foca a guia ou janela capturada ou se a guia de captura permanece ativa.
  • A opção suppressLocalAudioPlayback controla se o áudio reproduzido em uma guia será tocado nos alto-falantes locais do usuário.

Foco condicional

Com o foco condicional, os apps da Web agora podem controlar se a guia ou janela capturada vai ser focada quando a captura começar ou se a página de captura vai permanecer em foco.

const controller = new CaptureController();
// Prompt the user to share a tab, a window or a screen.
const stream =
    await navigator.mediaDevices.getDisplayMedia({ controller });

const [track] = stream.getVideoTracks();
const displaySurface = track.getSettings().displaySurface;
if (displaySurface === "browser") {
  // Focus the captured tab.
  controller.setFocusBehavior("focus-captured-surface");
} else if (displaySurface === "window") {
  // Do not move focus to the captured window.
  // Keep the capturing page focused.
  controller.setFocusBehavior("no-focus-change");
}

Confira Melhor compartilhamento de tela com o foco condicional para mais informações.

Suprimir a reprodução de áudio local

É comum que colegas se reúnam em uma sala para que um deles apresente algo do laptop para uma solução de conferências na sala com um monitor e alto-falantes dedicados. O apresentador geralmente silencia o próprio laptop e usa alto-falantes externos, que geralmente são mais altos. Isso também garante que o áudio esteja sincronizado com o vídeo. A restrição de áudio suppressLocalAudioPlayback economiza tempo aqui. Quando definido como true, indica que o navegador precisa parar de transmitir áudio para os alto-falantes locais quando a captura começar. O valor padrão dessa restrição é false.

// Prompt the user to share a tab, a window or a screen with audio.
// If successful, stop the captured audio from being played out over
// the local device's speakers.
const stream = await navigator.mediaDevices.getDisplayMedia({
  audio: { suppressLocalAudioPlayback: true },
});
const [audioTrack] = stream.getAudioTracks();
const settings = audioTrack.getSettings();
console.log(settings.suppressLocalAudioPlayback); // true

No momento da escrita, o suppressLocalAudioPlayback não funciona com applyConstraints(). Consulte o bug 1381959.

Agradecimentos

Agradecemos a Rachel Andrew por revisar este documento.