monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2026-01-09 17:04:30 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix(caret): align caret correctly in RTL tape mode (@byseif21) (#7259)

Browse source 
* In RTL tests, enabling tape mode causes the main caret to be
misaligned from the start of the test and remain offset while typing.
The tape margin was always calculated from the left side, which is
correct for LTR but incorrect for RTL layouts.

fix

* we should have mirrored the margin from the right side.
This commit is contained in:
Seif Soliman 2025-12-17 20:18:46 +02:00 • committed by GitHub
parent 3f21023fc1
commit 96169a149e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 7 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
frontend/src/ts/utils/caret.ts
View file

@ -450,6 +450,9 @@ export class Caret {
let left = 0;
let top = 0;
const tapeOffset =
wordsWrapperCache.getOffsetWidth() * (Config.tapeMargin / 100);
// yes, this is all super verbose, but its easier to maintain and understand
if (isWordRTL) {
let afterLetterCorrection = 0;
@ -475,8 +478,7 @@ export class Caret {
left += options.letter.getOffsetLeft();
left += afterLetterCorrection;
if (this.isMainCaret && lockedMainCaretInTape) {
left +=
wordsWrapperCache.getOffsetWidth() * (Config.tapeMargin / 100);
left += wordsWrapperCache.getOffsetWidth() - tapeOffset;
} else {
left += options.word.getOffsetLeft();
left += options.word.getOffsetWidth();
@ -486,8 +488,7 @@ export class Caret {
left += width * -1;
}
if (this.isMainCaret && lockedMainCaretInTape) {
left +=
wordsWrapperCache.getOffsetWidth() * (Config.tapeMargin / 100);
left += wordsWrapperCache.getOffsetWidth() - tapeOffset;
} else {
left += options.letter.getOffsetLeft();
left += options.word.getOffsetLeft();
@ -508,15 +509,13 @@ export class Caret {
left += options.letter.getOffsetLeft();
left += afterLetterCorrection;
if (this.isMainCaret && lockedMainCaretInTape) {
left +=
wordsWrapperCache.getOffsetWidth() * (Config.tapeMargin / 100);
left += tapeOffset;
} else {
left += options.word.getOffsetLeft();
}
} else if (Config.tapeMode === "letter") {
if (this.isMainCaret && lockedMainCaretInTape) {
left +=
wordsWrapperCache.getOffsetWidth() * (Config.tapeMargin / 100);
left += tapeOffset;
} else {
left += options.letter.getOffsetLeft();
left += options.word.getOffsetLeft();