User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:90.0) Gecko/20100101 Firefox/90.0

Steps to reproduce:

Visited a website with a right-to-left language in the title (eg. https://addons.mozilla.org/en-US/firefox/addon/%D8%A7%D9%84%D8%B9%D8%B1%D8%A8%D9%8A%D8%A9-language-pack/).

I have also reproduced this issue by opening the browser toolbox and setting the "labeldirection" attribute in .tab-label-container to "rtl". I then set the page title to "a right-to-left tab title....."

Actual results:

The tab looks fine initially, but when hovering over the tab, the five periods in the title "a right-to-left tab title....." get switched to the left-hand side of the label, making the tab title appear as ".....a right-to-left tab title". The rest of the text remains the same.

If using a longer text as the page title or using smaller width tabs, the entire label is moved a few pixels toward the left instead.

This issue is not present under "ltr" label directions. It is also not present in non-proton Firefox versions.

Expected results:

I would expect the page title label text to not change or move position when hovering over it. This is what happens in my Firefox 88 installation, but not in Nightly 90.

Thanks for the detailed instructions to reproduce, assuming all this will be tracked and fixed in bug 1701394