Uau, não importa o que eu faça, este arquivo que converti para PNG aparece como JPEG. No início, achei que o Preview tivesse feito uma conversão ruim, mas depois usei o Affinity Photo, que deveria ser confiável.
Não acredito que tenha alterado essa configuração, já que ela não possui a opção ‘reset’ ao lado.
Quando faço upload de uma imagem diferente que é PNG, vejo que o tipo permanece. Há algo neste arquivo que o Discourse realmente quer converter. Ideias?
Você encontrou um bug conhecido (embora obscuro!), que foi corrigido pelo commit acima. No entanto, esse commit ainda não está em uma versão estável do Discourse.
Definir temporariamente recompress original jpg quality para 100 deve impedir que a conversão ocorra.
(…e/ou você pode tentar reduzir a qualidade do PNG que está exportando para um valor inferior ao da configuração recompress original jpg quality.)
Apenas certifique-se de retornar essa configuração ao valor anterior após o upload do seu logotipo!
Acho que deveria ganhar um emblema por encontrar dois bugs do Discourse em uma semana. 
No entanto, mesmo tendo dado ambos esses passos, o arquivo ainda está sendo convertido para JPEG. Configurei a opção para 100%, salvei minha imagem como JPG com 92% e depois exportei como PNG (não consegui alterar a qualidade diretamente no PNG?). Alguma outra ideia de solução alternativa ou algo que eu possa ter feito de errado?
Após mudar para a branch stable, consegui reproduzir o problema (conhecido):
Mas não consegui reproduzir o problema com a solução alternativa sugerida:
Estou um pouco confuso, receio!
Também não aparece no Mozilla Firefox.
Há algum motivo para que o banner de instalação não apareça em dispositivos iOS (especialmente agora que eles suportam PWAs)?
Sim, funciona incrivelmente bem no meu Pixelbook Go. PWAs são essenciais no Chrome OS.
Porque o navegador do iOS não possui esse recurso e não há planos de adicioná-lo.
O que sugeri anteriormente é: por que não haveria um botão ou link em algum lugar do site para instalar o PWA, conforme explicado neste artigo.
Já temos isso há anos:
Desculpe, estou falando de um botão/link persistente menos visível, talvez em um menu, para usuários sem o PWA.
A razão pela qual vejo isso como útil é para quando temos um usuário que deseja instalar o aplicativo: não sabemos em qual estado ele está e faz muito esforço fazer um Q&A. Seria ótimo se houvesse um processo infalível de duas etapas que pudéssemos oferecer a eles: ou seja, ir ao menu hambúrguer → Instalar Aplicativo. Assim, não precisamos nos preocupar com o idioma do usuário, quantas visitas ele fez, se ele rejeitou um banner ou desinstalou no passado, ou qual navegador está usando e como ele apresenta a opção de instalação.
Provavelmente, grande parte da confusão aqui (incluindo a minha) é que há uma opção de instalação de PWA diferente dependendo do navegador:
Chrome no Android (ou seja, navegador padrão): Acredito que foi aí que você obteve as capturas de tela que postou. Então, parece que aqui você tem um “Instalar Aplicativo” no menu hambúrguer. Seria ótimo se isso estivesse disponível em todos os navegadores, mas parece que não é possível no momento.
Safari no iPhone (navegador padrão): Não há nenhum botão para instalar no menu hambúrguer. Para instalar, é preciso ir ao ícone de compartilhar (quadrado com uma seta para cima) e rolar até “Adicionar à Tela de Início”. Acredito, pela discussão aqui, que não é possível adicionar o botão ao menu hambúrguer. Isso salva o aplicativo na tela inicial, embora eu não tenha certeza se apenas isso concede a funcionalidade de PWA, como salvar o estado anterior.
Chrome no Desktop: Não tenho o botão de instalação no menu hambúrguer no meu navegador Chrome no Mac. Ele deveria estar lá? Poderia ser adicionado?
Safari no Desktop: Também não tenho o botão de instalação no menu hambúrguer no meu navegador Safari no Mac. Ele deveria estar lá? Poderia ser adicionado?
Sim, concordo com o que @JQ331 disse.
A solução do Falco é o menu do Chrome. Quando falo em menu hambúrguer, me refiro ao do Discourse, não ao do navegador. Como alguns acima apontaram que isso não funciona no Safari ou no Firefox, essa opção depende do navegador. Supondo que ela possa ser instalada lá, a opção simplesmente não é oferecida; uma opção de menu do Discourse parece ser a melhor escolha. Além disso, isso lembra ao usuário que essa opção existe, já que ele pode nunca procurar no menu do Chrome.
Você não pode adicionar botões de instalação em qualquer coisa controlada pela Apple, e a Apple disse várias vezes que não quer permitir que desenvolvedores criem esses botões, nunca.
Ele está aqui para mim:
Também está na barra de endereços no desktop.
Você não o vê no seu site por causa daquela questão do logo em JPG. PWA é um alvo em movimento rápido, e os critérios mudam o tempo todo. Eu sugeriria usar nosso canal de lançamento padrão se você quiser máxima compatibilidade com PWA.
Eu estava me referindo ao menu hambúrguer do Discourse (não ao menu do Chrome). Na verdade, agora vejo que as capturas de tela do Android também eram do menu do Chrome, não do menu hambúrguer do Discourse.
Seria bom ter o botão no menu hambúrguer do Discourse — o usuário o veria com mais frequência e ficaria um pouco mais claro em termos de como instruir os usuários a instalar como um PWA. Provavelmente não vale um grande esforço de desenvolvimento, mas seria um toque útil.
Os navegadores Chromium parecem ser os únicos com o prompt de instalação. O Mozilla Firefox e o Safari são baseados em engines de renderização diferentes.
Eu simplesmente adicionei o botão criando um componente de tema.
Basta criar um novo componente de tema.
Adicione o seguinte código JS, por exemplo, no cabeçalho:
<script>
let deferredPrompt; // Permite mostrar o prompt de instalação
const installButton = document.getElementById("install_button");
window.addEventListener("beforeinstallprompt", e => {
console.log("beforeinstallprompt disparado");
// Impede que o Chrome 76 e anteriores mostrem automaticamente um prompt
e.preventDefault();
// Armazena o evento para que possa ser acionado posteriormente.
deferredPrompt = e;
// Mostra o botão de instalação
installButton.hidden = false;
installButton.addEventListener("click", installApp);
});
function installApp() {
// Mostra o prompt
deferredPrompt.prompt();
installButton.disabled = true;
// Aguarda a resposta do usuário ao prompt
deferredPrompt.userChoice.then(choiceResult => {
if (choiceResult.outcome === "accepted") {
console.log("Configuração do PWA aceita");
installButton.hidden = true;
} else {
console.log("Configuração do PWA rejeitada");
}
installButton.disabled = false;
deferredPrompt = null;
});
}
window.addEventListener("appinstalled", evt => {
console.log("appinstalled disparado", evt);
});
</script>
E coloque o seguinte HTML onde desejar que o botão de instalação apareça:
<button id="install_button" hidden>Instalar</button>
Ele está oculto por padrão e aparecerá se o PWA não estiver instalado.
Testei no Chrome.
Brilhante! Você não consideraria torná-lo um componente de tema formal? Ou melhor ainda, modificar o componente de tema de links do Hambúrguer para incluí-lo? Porque é lá que eu gostaria de tê-lo!
Você pode enviar o código modificado para que o botão ‘Instalar aplicativo’ seja exibido no menu hambúrguer???
Não consigo fazer isso funcionar. Admito que sou novo em tudo isso.
Carreguei o componente, adicionei o js ao cabeçalho, defini o componente para o tema padrão.
Mas então o script HTML – é possível ter HTML em uma postagem? Não parece. Se não for, onde posso realmente colocá-lo de forma útil?
Obrigado! Realmente espero que isso possa me ajudar.
Acho que isso só vai funcionar no Android?