Justify option doesn't work in Paragraph block using Firefox

[mriyazuddin]

Steps to reproduce

1. Using Firefox browser, create a new post on a simple or AT site regardless of the theme.
2. Add some text to a paragraph block.
3. Try justifying the text.

What I expected

The text should have justified alignment in the editor itself.

What happened instead

The text remains as is.

Browser / OS version

Firefox 81.0.1 (64-bit) | OS: macOS Catalina 10.15.7 (19H2)

On other browsers though, it works fine. When text is justified in Firefox, though it appears as is in the editor but appears justified when previewed. So, its only the editor where it doesn't change.

Screenshot / Video

https://d.pr/v/kDjSlh

Context / Source

[adelineyaw]

Adding ticket: #3368510-zen here for future follow up.

[pauljacobson]

I was able to reproduce this in Firefox Developer Edition, v84.0b3 too, so it seems like a more general issue with how Firefox renders the text in the block editor. That said, this doesn't seem to affect how the text is actually displayed on the published post.

My previews indicate that the text alignment changes are applied to previews of the post, at least. Here is my test:

Browser/OS

• Firefox Developer Edition, v84.0b3
• macOS 11.0.1

Test site

• Theme: Brompton
• Gutenberg: v9.4.1
• Plan: WordPress.com Premium plan

[obenland]

Paragraph blocks seem to get an inline style of white-space: pre-wrap, to which then Firefox decided to not justify text.
Adding white-space: normal !important; to the .has-text-align-justify selector should fix it.

[poojashetty18]

Another report here #4408361-zen

[renata-franco]

Report here: 34660574-hc