Skip to content

[RTE] Unify how the TipTap editor determines RTL #6114

Description

@rtibblesbot

This issue is not open for contribution. Visit Contributing guidelines to learn about the contributing process and how to find suitable issues.

Overview

The TipTap editor resolves the page direction four different ways, so an RTL fix applied to one control does not carry to the others. Reduce them to a single source.

Complexity: Low
Target branch: unstable

Context

  • TipTapEditor/composables/useRovingTabIndex.js reads window.isRTL.
  • TipTapEditor/components/toolbar/ToolbarButton.vue reads document.dir or <html dir>.
  • TipTapEditor/composables/useLinkHandling.js reads document.dir.
  • TipTapEditor/components/image/ImageNodeView.vue walks up from the editor DOM to the nearest [dir="rtl"].
  • Studio sets window.isRTL in templates/base.html and re-exposes it as Vue.prototype.$isRTL in shared/i18n/setup.js.

The Change

  • Every JavaScript RTL check under shared/views/TipTapEditor/ should resolve from one source.
  • ImageNodeView's ancestor walk is the only one that can report a direction differing from the page's; whether that difference is worth keeping is part of this task.

Out of Scope

  • RTL reads elsewhere in Studio.
  • [dir='rtl'] CSS selectors, which RTLCSS handles.

Acceptance Criteria

  • Every JavaScript RTL check under shared/views/TipTapEditor/ reads from one source
  • In RTL, toolbar icons still flip, the link popover still anchors on the correct side, image resize handles still track the drag direction, and toolbar arrow keys still move in reverse
  • Jest tests that exercise RTL set the direction through that single source

References

AI usage

Claude Code drafted this issue from a review comment on #6108. It grepped shared/views/TipTapEditor/ for the direction checks and listed the four call sites it found; the acceptance criteria were reviewed against those call sites before filing.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions