hnaseri
February 9, 2022, 10:15am
1
I have a forum in rtl language .Recently quotes show text in ltr direction instead of rtl.
pmusaraj
February 9, 2022, 11:32am
2
Are you on latest Discourse? I can’t reproduce it locally when switching my locale to Arabic, for example.
hnaseri
February 9, 2022, 1:40pm
3
I updated to latest just now. It didn’t fix the problem.
pmusaraj
February 9, 2022, 3:41pm
4
Does this happen on multiple posts, or just that specific one? Have you also tried in safe mode ?
1 Like
hnaseri
February 10, 2022, 6:44am
5
Yes it happens in multiple posts. And it also happens in safe mode .
1 Like
pmusaraj
February 10, 2022, 7:58am
6
Can you post a link to your site so we can have a look?
pmusaraj
February 10, 2022, 9:40am
8
Thanks, from looking at the source code, the quotes there have a dir="ltr" attribute. I’m guessing you have enabled the setting mixed text direction. In fact, I can reproduce your issue when I enable that setting locally.
I’m not sure whether this is “working as designed” or whether there is a small/big bug here. @Osama are you familiar with this part of the app?
3 Likes
Osama
February 10, 2022, 9:48am
9
It certainly feels like we have a bug here. I’d expect the quote direction to match the site direction. I’ll dig in and see what’s causing this!
4 Likes
Osama
February 20, 2022, 8:07pm
11
After looking into this, I’m a little bit confused, are you sure this used to render correctly? Because I couldn’t see anything in the code for handling quoted RTL text with a username in a LTR language. I also tried a Discourse version from more than a year ago and the quote didn’t render correctly either.
Anyways, here is a PR for handling this correctly:
discourse:main ← discourse:fix/quoted-rtl-text
opened 08:02PM - 20 Feb 22 UTC
Meta topic: https://meta.discourse.org/t/rtl-direction-is-broken-in-quotes/21763… 9?u=osama.
Posts in Discourse are by default always rendered in the same direction as the rest of site, for example if the site is RTL, a post in that site is always rendered RTL even if it's made of an LTR language entirely. However, this behavior can be changed by enabling the `support mixed text direction` site setting which makes our posts rendering engine consider each "paragraph" in the post and apply an appropriate direction (using the `dir` attribute) on it based on its content/language.
I put paragraph in quotes because technically we only loop through the immediate children of the HTML element that contains the post cooked HTML and do this direction check on them. Most of the time the immediate children are actually paragraphs, but not always. The direction of an element is determined by checking its `textContent` property against a regular expression that checks all characters are RTL characters and based on the regular expression result the `dir` attribute is set on the element.
This technique doesn't work so well on quotes because they may contain multiple paragraphs which may be in different languages/directions. For example:
In this screenshot, the site's language is Arabic (RTL language) and the `support mixed text direction` setting is enabled. The paragraphs outside the quotes are rendered as expected with the right direction, however the paragraphs within the quote aren't; both the Arabic and English paragraphs are rendered LTR. Additionally, the avatar in the quote is misplaced; it should always be on the right hand site in RTL sites.
The reason for this is that when we're determining the direction for the quote, it's considered as one element and the direction is set on the whole quote. But for complex quotes like the one above, we need to be more surgical and apply direction on elements within the quote.
This PR adds special handling for quotes to ensure that:
* the quote title (the avatar plus the chevron and arrow) always match the site direction
* each immediate paragraph (`<p>` elements) under `<blockquote>` in the quote gets a direction based on its content.
Screenshot of the above quote with this PR:
5 Likes
pmusaraj
February 28, 2022, 7:00am
12
This topic was automatically closed after 3 days. New replies are no longer allowed.
