Tengo una etiqueta de botón en mi código como botón de descarga para la aplicación web progresiva (PWA). Este botón se muestra en Chrome de escritorio, mi navegador Chrome de Android, pero no en mi iPhone (Safari). Aquí está el código

 index.html

 <div class="fixed-action-btn"> <button class="add-button modal-trigger btn btn-large btn-floating amber waves-effect waves-light orange darken-3"> <i class="large material-icons">file_download</i> </button> </div>

Agregar a la secuencia de comandos de la pantalla de inicio en javascript

 let deferredPrompt; const addBtn = document.querySelector('.add-button'); addBtn.style.display = 'none'; window.addEventListener('beforeinstallprompt', (e) => { // Prevent Chrome 67 and earlier from automatically showing the prompt e.preventDefault(); // Stash the event so it can be triggered later. deferredPrompt = e; // Update UI to notify the user they can add to home screen addBtn.style.display = 'block'; addBtn.addEventListener('click', (e) => { // hide our user interface that shows our A2HS button addBtn.style.display = 'none'; // Show the prompt deferredPrompt.prompt(); // Wait for the user to respond to the prompt deferredPrompt.userChoice.then((choiceResult) => { if (choiceResult.outcome === 'accepted') { console.log('User accepted the A2HS prompt'); } else { console.log('User dismissed the A2HS prompt'); } deferredPrompt = null; }); }); }); </script>

el botón no tiene CSS adicional. NOTA: la aplicación está alojada en heroku