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 não respeitar a configuração "Não perturbe" do sistema.
Abaixo, vamos analisar as diferenças que essa mudança traz para as 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](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/google-chrome-notificatio-0dd272728498d.png?authuser=4&hl=pt-br)
Diferenças
Tamanho e posicionamento do ícone
A aparência dos ícones vai mudar. Eles serão menores e o padding será aplicado. Considere mudar para um ícone de plano de fundo transparente em vez de uma cor sólida para melhorar a estética.
![Antes e depois dos ícones de notificação do Chrome no Mac exibidos pelo Chrome e pelo
macOS.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-chrome-ma-8f7a9faf4b135.png?authuser=4&hl=pt-br)
Ícones de ação
Antes dessa mudança, os botões de ação e os ícones eram mostrados na notificação. Com notificações nativas, os ícones de botão de ação não são usados, e o usuário precisa 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 e pelo macOS.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-notificati-acefa2d32d351.png?authuser=4&hl=pt-br)
Logotipo do Chrome
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 do Chrome no macOS antes e depois.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-notificati-35cb1f20a7481.png?authuser=4&hl=pt-br)
É 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 na extensão 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. Verifique se as imagens são complementares e não obrigatórias para serem úteis aos usuários.
![Antes e depois de modelos de imagem na API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-image-temp-ea8d68fe9acc.png?authuser=4&hl=pt-br)
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 lista na API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-list-templ-58a8124f4c8f9.png?authuser=4&hl=pt-br)
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.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-progress-t-aeb9eb61ae795.png?authuser=4&hl=pt-br)
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.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-appiconmar-74e3f48314cd4.png?authuser=4&hl=pt-br)