Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

[Bug]: Preview annotation comments do not support RTL text direction

Đã đóng Phù hợp với người mới
  • Có gì không ổn?
#4,644 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@abdelrhmanehab10 đang làm issue này rồi.

Từ ngày 9/9/2026.

  • #10999 của @abdelrhmanehab10 — đã đóng, không merge
  • #11005 của @abdelrhmanehab10 — đang mở
  • #16747 của @haithamassoli44 — đang mở

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
78/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
typescript
Lĩnh vực
desktop, frontend

Hướng nghiên cứu

Bắt đầu tại apps/desktop/src/preview/PickPreload.ts, khoảng các dòng 414-419, nơi textarea chú thích được tạo. Tái hiện vấn đề bằng một chú thích tiếng Ả Rập trên trang LTR, sau đó kiểm tra cách overlay chú thích nhận hướng từ tài liệu được kiểm tra. Được xem là hoàn tất khi văn bản chú thích RTL và chú thích có hướng hỗn hợp hiển thị chính xác, trong khi thanh công cụ và các điều khiển của trình chỉnh sửa vẫn giữ bố cục ổn định.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Area

apps/desktop

Summary

Arabic and other RTL comments in the browser annotation editor use the inspected page's text direction instead of the comment's own content. On a normal LTR page, the RTL comment is aligned incorrectly; on an RTL page, the entire annotation toolbar is mirrored.

Steps to reproduce
  1. Open any left-to-right page in the T3 Code desktop browser panel, for example https://example.com.
  2. Click Annotate preview.
  3. Select any element so the annotation comment editor appears.
  4. Type an Arabic comment, for example كبّر هذا العنوان.
Expected behavior

The comment field should infer direction from the entered text. Arabic, Hebrew, Persian, and other RTL comments should start from the right and preserve readable bidirectional ordering.

The annotation toolbar and editor controls should keep their own stable layout regardless of the inspected page's direction.

Actual behavior

The annotation comment field inherits the inspected page's direction:

  • On an LTR page, Arabic annotation text remains in an LTR field and is aligned/ordered incorrectly.
  • On an RTL page, the comment flows RTL, but the annotation chrome is also mirrored, including the tool order and Attach button placement.

This couples the annotation UI to the host document instead of handling the comment direction independently.

Impact

Minor bug or occasional failure. RTL users can enter a comment, but the field is awkward to edit and mixed RTL/LTR content such as URLs, selectors, and code tokens can be displayed in the wrong visual order.

Version or commit

Reproduced on 0.0.29-nightly.20260724.893 (ece05087a70e).

Environment

T3 Code desktop nightly, Linux/X11, Electron.

Screenshots, recordings, or supporting files

Actual behavior on an LTR page: the short Arabic comment is anchored to the left side of the field.

Arabic annotation comment remains LTR on an LTR page

Diagnostic control with the host page set to RTL: the same comment moves to the right, but the toolbar order and Attach button also reverse. This shows that the annotation overlay inherits direction from the inspected page.

Forcing the host page to RTL also mirrors annotation controls

Related but not duplicate: #1771 is a broad proposal for bidi-ready renderer styling and message bodies. This report is narrowly about the desktop preview annotation overlay and its comment textarea.

Technical note

Current main at 5719e8ac4020 creates the annotation <textarea> without a dir attribute. Giving the comment field content-based direction such as dir="auto", while explicitly isolating the annotation chrome from the host document direction, appears to be the smallest relevant scope.

Workaround

No practical per-comment workaround. Temporarily changing the inspected document's root direction to RTL also changes the page and annotation controls.

Ngôn ngữ chính
TypeScript
Star
24.8k
Fork
6.4k
Merge trung bình
6 giờ 53 phút
Pull request đã merge (30 ngày)
222

Chuẩn bị môi trường

Mở trong Codespaces

Khởi chạy dev container của dự án ngay trên trình duyệt, bằng tài khoản GitHub của bạn.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của pingdotgg/t3code

Tất cả issue của pingdotgg/t3code

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.