bug: ion-toast wrong wrapping when using <b> inside

[RafaelKr]

Bug Report

Ionic version:

[x] 4.x
[x] probably also 5.x

Current behavior:
I'm using an ion-toast. I'm using <b> tags in my toast message. The white-space: pre-wrap makes the toast wrapping behave wrong when the text wraps directly after the closing </b>.

As you can see the next line is indented by one space:

Expected behavior:
The correct behavior is achieved with either white-space: normal or white-space: pre-line:

More info: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space#Values

Related code:
The last change of this was here: #16360

Other information:
It would be great if this could be backported to 4.X
I can open a PR if you want. If there's something I have to know to get this backported, please tell me, thanks!

Ionic info:

Ionic:

 Ionic CLI : 6.1.0 (/home/rafael/.nvm/versions/node/v13.7.0/lib/node_modules/@ionic/cli)
 Ionic Framework : @ionic/angular 4.11.7
 @angular-devkit/build-angular : 0.803.19
 @angular-devkit/schematics : 8.3.19
 @angular/cli : 8.3.19
 @ionic/angular-toolkit : 2.1.1

Cordova:

 Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
 Cordova Platforms : android 8.1.0
 Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 16 other plugins)

Utility:

 cordova-res : not installed
 native-run : 0.3.0

System:

 Android SDK Tools : 26.1.1 (/opt/android-sdk-linux)
 NodeJS : v13.7.0 (/home/rafael/.nvm/versions/node/v13.7.0/bin/node)
 npm : 6.13.6
 OS : Linux 5.3

[liamdebeasi]

Thanks for the issue! I can confirm that this should be pre-line. I have created a PR for this fix; however, Ionic Framework v4 is only receiving critical security fixes, so this fix will be available in Ionic Framework v5.

[liamdebeasi]

I discussed this more with the team and we decided the better approach was to a) add a CSS variable to let users customize white-space and b) expose certain internals of the toast via CSS Shadow Parts.

[liamdebeasi]

Thanks for the issue. This has been resolved via #20729 and will be available in an upcoming release of Ionic Framework.

[RafaelKr]

Thanks!

Also to discuss with @brandyscarney:
I think pre-wrap is still the wrong default behavior because most people won't even run into this and so they will never change the --white-space variable.
Of course this default should usually not be changed in a minor release. But is there any case where you really want it to be pre-line? Wouldn't it make sense to treat a change to normal as a bug-fix?

If you think this isn't a viable idea, could we open an issue which will be added to a 6.0.0 milestone, which requests changing it to a default behavior of --white-space: normal? Or do you track something like this on an internal list?