search

ionic-team / pwa-elements

Quality UI experiences for Web APIs that require custom UI (such as media/camera).
https://medium.com/@maxlynch/building-the-progressive-web-app-os-57daebcb69c1
MIT License
168 stars 50 forks source link

Toast messages don't respect line breaks #34

Open Erudition opened 5 years ago

Erudition commented 5 years ago

I can not figure out how to create line breaks in a toast message. When on Android, for example, I can use \n to insert a newline, which works great. However, the same messages are being flattened to one line in the PWA, which looks ugly. Is there a way to represent line breaks?

I'm submitting a ... [x] bug report [x] feature request [x] support request

Current behavior: All whitespace (\n, \t, multiple spaces in a row) in the input text of the Toast plugin seems to be normalized to a single space. When I try to use HTML line breaks like <br />, they are passed through un-parsed.

Expected behavior: There should be a way to represent line breaks in the toast messages, like on other Capacitor-supported platforms. Ideally this should simply respect the \n character so toast works identically across platforms.

Steps to reproduce: On a browser page with both pwa elements and capacitor.js, paste in the developer console:

window.Capacitor.Plugins.Toast.show({ text: "0m 11s spent on Meditate \n Meditate ➤ Workout \n Starting from 0m 0s", duration: '10000'}).then();
sneko commented 3 years ago

I agree with @Erudition . Any thought @mlynch ?

Thank you,