Melhorias no compartilhamento de tela no Chrome 109

François Beaufort

GitHub

Alon Elad

GitHub

Os apps da Web já podem usar o getDisplayMedia() para capturar guias, janelas ou telas como um 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 de uma guia é tocado nos alto-falantes locais do usuário.

Foco condicional

Com o Foco condicional, os apps da Web podem controlar se a guia ou janela capturada será focada no início da captura 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");
}

Saiba mais em Compartilhamento de tela aprimorado com foco condicional.

Suprimir a reprodução de áudio local

É comum que os colegas se reúnam em uma sala para que um deles apresente uma solução de videoconferência na sala usando um laptop com um monitor dedicado e alto-falantes. O apresentador geralmente silencia o próprio laptop e usa os alto-falantes externos, que costumam ser mais altos. Isso também garante que o áudio esteja em sincronia com o vídeo. A restrição de áudio suppressLocalAudioPlayback economiza tempo aqui. Quando definido como true, ele indica que o navegador precisa parar de redirecionar o áudio para os alto-falantes locais quando a captura for iniciada. O valor padrão desta 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 em que este artigo foi escrito, suppressLocalAudioPlayback ainda não funcionava com applyConstraints(). Consulte bug 1381959.

Agradecimentos

Imagem principal de Brett Jordan.

Agradecemos a Rachel Andrew pela leitura deste artigo.