Skip to main content
Arabic is not a translation: 17 RTL tests before release

Arabic is not a translation: 17 RTL tests before release

Every string can be translated while the application still fails Arabic users. The problem appears in a back arrow that points the wrong way, a broken phone number, a transition that begins from the wrong edge, or a button that disappears when text becomes larger.

I have met these cases while building and publishing Arabic applications for iOS and Android. The repeating lesson is that RTL is a complete runtime state, not a final flexDirection change.

React Native provides RTL controls through I18nManager, but its documentation also notes that allowRTL and forceRTL changes require a restart and that forceRTL is intended for development testing, not production behavior.

Official React Native I18nManager reference

1. Cold start in Arabic

Set the device language to Arabic, terminate the app, and start it again. Do not rely only on changing language inside one session because direction settings may not apply until restart.

2. Cold start in English after Arabic

The reverse test reveals persisted direction or state left behind by the previous session.

3. Narrow screen

Use a small phone and real copy. Inspect headings, buttons, badges, and bottom sheets. A large current device is not enough coverage.

4. Large text

Increase system text size. Buttons should not clip, and headings should not collide with navigation.

5. Mixed-direction text

Use realistic content:

الطلب INV-2026-104، الإجمالي QAR 1,250.00
الدعم: support@example.com

Check symbols, punctuation, and numbers. A specific value may need an explicit direction without changing the whole page.

6. Phone numbers

Keep the visual order stable and use an international value for the link. Do not reverse a number because its container is RTL.

7. Dates and time

Decide which calendar, digit system, and time zone the product uses. Test midnight boundaries rather than one static example.

8. Currency

Test QAR, USD, negative values, discounts, and tax. The meaning must remain clear in tables, receipts, and notifications.

9. Directional icons

A search icon does not change, while back, forward, or send icons might. Do not mirror every SVG automatically.

10. Navigation animation

Open a screen and return using gesture and button. The motion should agree with the navigation order and platform behavior.

11. Drawers

Check the opening edge, closing gesture, overlay, and focus. A drawer can appear on the correct side while keeping its gesture on the wrong edge.

12. Logical edges

Use logical start and end, or make a deliberate decision with I18nManager.isRTL when a property is directional. Explicit left and right values are not always wrong, but they must be intentional.

const backTransform = {
  transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],
};

13. Images and charts

Do not mirror logos, product photos, or diagrams containing text. Mirror only assets whose meaning is directional.

14. Fields and keyboards

Test name, email, phone, password, and search fields. Field direction, keyboard type, and clear-button position are separate decisions.

15. Screen readers

Run VoiceOver and TalkBack. Review focus order, labels, values, errors, and whether each control has an understandable purpose.

16. Loading and failure states

Test loading, empty, error, retry, and expired-session states. RTL differences often appear in messages outside the happy path.

17. Signed build on real devices

Run the Release build, not only a development build. Verify a real iPhone and Android device when both are in scope, including deep links, notifications, permissions, and the real backend.

My public release pages on the App Store and Google Play demonstrate published applications. Store publication is not evidence that every RTL state was tested on behalf of the product team.

Use this checklist when

  • Arabic is primary or equal to English.
  • The app includes input, mixed content, and long copy.
  • Navigation, motion, notifications, or deep links are part of the product.
  • You want to reduce post-release RTL defects.

Add domain-specific tests when

  • Payments, health, or sensitive permissions are involved.
  • The app targets special hardware, wearables, or vehicle surfaces.
  • More than one writing system and direction is supported.

Conclusion

Good RTL testing reviews meaning before mirroring. The goal is not a reversed screen. The goal is a user who can read, navigate, enter data, and understand state without resistance.

Download the Arabic app and RTL testing checklist and run it against the signed build before store submission.