Skip to main content

Browser auto-translation crashes the app for non-English traders

TLDR

A Brazilian trader's page crashed while configuring her copier, because Chrome auto-translated the app and broke it. The app has no protection against this, so any trader who doesn't read English risks the same crash. Worse, these crashes go unreported, so we can't see how often it happens.

Done when

  • [code] The app is marked as not translatable - Check: src/app/layout.tsx - Expect: the html element carries translate=no (plus a google notranslate meta tag), so Chrome offers no auto-translation and the DOM is left alone
  • [human] The SL & TP tab survives translation - Check: Chrome with Portuguese auto-translate forced on, Copy Trading → Add Receiver → switch to the SL & TP tab, then between all three tabs repeatedly - Expect: no crash, no error boundary
  • [code] Crashes on copy-trading are reported - Check: src/app/(authenticated)/copy-trading/error.tsx - Expect: it calls Sentry.captureException(error) like src/app/error.tsx:16-17 does; today it only calls console.error, so every crash on our most important page is invisible to us
  • [human] Confirm no other route-level error.tsx has the same gap - Check: every error.tsx under src/app - Expect: all report to Sentry
  • [human] The affected customer is told it is fixed - Check: Jéssica Rodriguês, Featurebase #28 - Expect: told it is fixed and can open the SL & TP tab

Out of scope

  • Translating the product into Portuguese (no i18n library exists — separate decision)
  • The broker dropdown that closes on open, TRADA-1168 (Featurebase #23) — likely the same root cause; re-test it once this lands before doing more work there

Tech context

  • Customer: Jéssica Rodriguês, MT5, FTMO sender + FXIFY / FTMO-Demo / BlueGuardian receivers. Screenshot shows the whole UI in Portuguese with tabs rendered "Negociação / SL e TP / Proteção" — the real labels are "Trading / SL & TP / Protection" (copy-trading-view.tsx:4152-4156)
  • Exact error shown: "Falha ao executar 'removeChild' em 'Node': O nó a ser removido não é filho deste nó"
  • Root cause: the translator rewrites text nodes, React can no longer reconcile them, and the error boundary fires
  • The app is English-only — no i18n library in package.json, no locale files, all strings hardcoded (src/app/error.tsx:21). So a Portuguese UI can only be the browser translating
  • Conditions that make the crash likely: Radix Tabs with no forceMount, so inactive TabsContent fully unmounts and remounts on every tab switch (src/components/ui/tabs.tsx); the modal renders through a portal onto document.body (src/components/ui/dialog.tsx:58); and inline conditional text nodes as siblings in one parent (copy-trading-view.tsx:4596-4600, 4685-4689, same pattern at 4176-4178)
  • No notranslate attribute, translate="no" attribute, or google notranslate meta tag anywhere in the repo — verified by grep across src, public, next.config.ts and src/app/layout.tsx
  • Not yet reproduced in-house: the code shape and the customer's evidence point clearly at translation, but nobody has run the repro above. Do that first.

Source

Featurebase support conversation #28 (customer Jéssica Rodriguês), messages of 11 Sep 2026 12:27 UTC. Filed 14 Sep 2026. https://trada.featurebase.app/dashboard/inbox/conversation/28

Status: In Progress

No comments yet

Be the first to share your thoughts.