РЕДАКТИРОВАТЬ: рассказ Я сделал песочницу для кода:
https://codesandbox.io/s/928m541rny?fontsize=14
открыть в Safari для Mac, и вы увидите этоесли вы немного растянете окно: 
Если вы щелкнете по тексту, это будет правильно.
У меня очень интригующая ошибкав Safari для Mac (12.0.3) текст не корректно выравнивается (скриншот 1) при первом рендеринге, он корректно выравнивается только после нажатия на него (скриншот 2).
Я использую React с материалом-UI и переопределение стиля всего моего body2 непосредственно в моем файле theme.js следующим образом:
body2: {
textAlign: "justify"
}
Эта реализация правильно работает в Chrome.Строка исходит из моего бэкэнда, который получает его из магазина Google Firestore.Новые строки представлены \n символами.Я ищу, чтобы решить эту проблему и не найти обходной путь (как замена \n символ на <br /> HTML-теги)
Что я пытался:
- поиск проблем, связанных сна
text-align: justify в Safari - при попытке поиграть со свойством
text-justify
На самом деле я понятия не имею, где искать, чтобы решить эту проблему, и никогда не было ошибок такого рода (изменение css после клика без какой-либо логики onClick.).Вот почему я перечислил так много тегов, потому что на данный момент у меня нет реальной идеи.
После нажатия на него, он отображается правильно: 
Дополнительная информация:
<Typography paragraph>
{description}
</Typography>
Я также перезаписываю корневую типографику следующим образом (если нет, новые строки из строк в пожарном хранилище не отображаются):
MuiTypography: {
root: {
whiteSpace: "pre-line"
},
body2: {
fontSize: 15,
textAlign: "justify"
}
},