Como migrar para o sistema de notificação nativo no macOS

Stephen McGruer
Stephen McGruer

A partir do Chrome 59, as notificações enviadas pela API Notifications ou pela API Extensions chrome.notifications serão mostradas diretamente pelo sistema de notificação nativa do macOS, em vez do próprio sistema do Chrome.

Essa mudança faz com que o Chrome no macOS pareça muito melhor integrado à plataforma e corrige vários bugs antigos, como o Chrome que não respeita a configuração "Não perturbe" do sistema.

Confira abaixo as diferenças que essa mudança introduz nas APIs existentes.

Central de notificações

Um dos benefícios dessa mudança é que as notificações vão aparecer na Central de notificações do macOS.

As notificações do Google Chrome vão aparecer na Central de notificações do macOS
As notificações do Google Chrome serão exibidas na central de notificações do macOS

Diferenças

Tamanho e posicionamento do ícone

A aparência dos ícones vai mudar. Eles serão menores em tamanho e o padding será aplicado. Mude para um ícone de plano de fundo transparente em vez de uma cor sólida para ter um visual agradável.

Antes e depois dos ícones de notificação do Chrome no Mac exibidos pelo Chrome e pelo
    macOS.
Antes e depois dos ícones de notificação do Chrome no Mac mostrados pelo Chrome e pelo macOS

Ícones de ação

Antes dessa mudança, os botões e ícones de ação apareciam na notificação. Com as notificações nativas, os ícones dos botões de ação não serão usados, e o usuário precisará passar o cursor sobre a notificação e selecionar o botão "Mais" para ver as ações disponíveis.

Antes e depois dos botões de ação de notificação com ícones exibidos pelo
    Chrome em comparação com os exibidos pelo macOS.
Antes e depois dos botões de ação de notificação com ícones exibidos pelo Chrome em comparação com o macOS

O logotipo do Chrome sempre será exibido e não pode ser substituído ou alterado. Esse é um requisito para aplicativos de terceiros no macOS.

Imagens

A opção image não será mais compatível com o macOS. Se você definir uma propriedade de imagem, a notificação ainda será mostrada, mas vai ignorar o parâmetro de imagem. Confira o exemplo abaixo.

Imagem de notificação antes e depois para o Chrome no macOS.
Imagem de notificação do Chrome no macOS antes e depois

É possível detectar o suporte a imagens com o seguinte código:

if ('image' in Notification.prototype) {  
  // Image is supported.
} else {  
  // Image is NOT supported.
}

Mudanças nas extensões do Chrome

As extensões do Chrome têm o conceito de modelos de notificação, que vão se comportar de maneira diferente com essa mudança.

O modelo de notificação de imagem não vai mais mostrar a imagem. Confira se as imagens são complementares e não obrigatórias para que sejam úteis aos usuários.

Antes e depois de modelos de imagem na API chrome.notification.
Antes e depois para modelos de imagem na API chrome.notification

O modelo de notificação de lista vai mostrar apenas o primeiro item da lista. Talvez seja melhor voltar ao estilo de notificação básico e usar o texto do corpo para resumir o conjunto de mudanças.

Antes e depois para modelos de listas na API chrome.notification.
Antes e depois dos modelos de lista na API chrome.notification

As notificações de progresso vão anexar um valor de porcentagem ao título da notificação para indicar o progresso em vez de uma barra de progresso.

Antes e depois para modelos de progresso na API chrome.notification.
Antes e depois para modelos de progresso na API chrome.notification

A última diferença na interface da notificação é que o appIconMarkUrl não será mais usado no macOS.

Antes e depois de appIconMarkUrl na API chrome.notification.
Antes e depois do appIconMarkUrl na API chrome.notification