From fa0928059e811c428dbf1db70b404a69fa3aa4cb Mon Sep 17 00:00:00 2001
From: Tim Down <158919+timdown@users.noreply.github.com>
Date: Mon, 23 Jun 2025 12:25:47 +0100
Subject: [PATCH] Merge pull request #26244 from
 overleaf/td-limit-browser-translate-ide

Prevent browser translation of stuff that shouldn't be translated in IDE page

GitOrigin-RevId: 96a75b51c3c8efc4cbcec7eb17d9e331a03e2c96
---
 services/web/app/views/_metadata.pug          |  6 +++---
 .../chat/components/message-content.tsx       |  2 +-
 .../js/features/chat/components/message.tsx   |  2 +-
 .../components/dictionary-modal-content.tsx   |  4 +++-
 .../components/left-menu-button.tsx           |  8 ++++---
 .../components/settings/settings-compiler.tsx |  1 +
 .../components/settings/settings-document.tsx |  1 +
 .../settings/settings-editor-theme.tsx        |  1 +
 .../settings/settings-font-family.tsx         |  1 +
 .../settings/settings-image-name.tsx          |  1 +
 .../settings/settings-menu-select.tsx         |  3 +++
 .../settings/settings-pdf-viewer.tsx          |  1 +
 .../components/online-users-widget.tsx        |  1 +
 .../file-tree/components/file-tree-doc.tsx    |  1 +
 .../file-tree/components/file-tree-folder.tsx |  1 +
 .../components/change-list/changes.tsx        |  2 ++
 .../components/change-list/tag-tooltip.tsx    | 21 +++++++++++++------
 .../user-name-with-colored-badge.tsx          | 10 ++++++++-
 .../file-tree/history-file-tree-doc.tsx       |  1 +
 .../file-tree/history-file-tree-folder.tsx    |  1 +
 .../ide-redesign/components/breadcrumbs.tsx   |  2 +-
 .../editor-theme-setting.tsx                  |  1 +
 .../font-family-setting.tsx                   |  1 +
 .../compiler-settings/compiler-setting.tsx    |  1 +
 .../compiler-settings/image-name-setting.tsx  |  1 +
 .../root-document-setting.tsx                 |  1 +
 .../components/settings/dropdown-setting.tsx  |  3 +++
 .../editor-settings/pdf-viewer-setting.tsx    |  1 +
 .../components/toolbar/project-title.tsx      |  4 +++-
 .../outline/components/outline-item.tsx       |  1 +
 .../components/pdf-log-entry-raw-content.tsx  |  2 +-
 .../components/preview-log-entry-header.tsx   |  8 +++++--
 .../components/review-panel-entry-user.tsx    |  2 +-
 .../review-panel-expandable-content.tsx       |  3 +++
 .../components/review-panel-message.tsx       |  1 +
 .../review-panel-resolved-thread.tsx          |  6 +++++-
 .../extensions/toolbar/toolbar-panel.ts       |  2 +-
 .../components/collapsible-file-header.tsx    |  1 +
 .../acceptance/src/ProjectInviteTests.mjs     |  8 ++++---
 .../src/helpers/expectErrorResponse.mjs       |  2 +-
 .../src/steps/100_loadProjectDashboard.js     |  3 ++-
 41 files changed, 94 insertions(+), 29 deletions(-)

diff --git a/services/web/app/views/_metadata.pug b/services/web/app/views/_metadata.pug
index 6d7c599546..b28ca6abd2 100644
--- a/services/web/app/views/_metadata.pug
+++ b/services/web/app/views/_metadata.pug
@@ -1,10 +1,10 @@
 //- Title
 if metadata && metadata.title
-	title= metadata.title + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
+	title(translate='no')= metadata.title + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
 	meta(name='twitter:title' content=metadata.title)
 	meta(name='og:title' content=metadata.title)
 else if typeof title == 'undefined'
-	title= settings.appName + ', ' + translate('online_latex_editor')
+	title(translate='no')= settings.appName + ', ' + translate('online_latex_editor')
 	meta(
 		name='twitter:title'
 		content=settings.appName + ', ' + translate('online_latex_editor')
@@ -14,7 +14,7 @@ else if typeof title == 'undefined'
 		content=settings.appName + ', ' + translate('online_latex_editor')
 	)
 else
-	title= translate(title) + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
+	title(translate='no')= translate(title) + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
 	//- to do - not translate?
 	meta(name='twitter:title' content=translate(title))
 	meta(name='og:title' content=translate(title))
diff --git a/services/web/frontend/js/features/chat/components/message-content.tsx b/services/web/frontend/js/features/chat/components/message-content.tsx
index ad2e6a623f..3d86b4be68 100644
--- a/services/web/frontend/js/features/chat/components/message-content.tsx
+++ b/services/web/frontend/js/features/chat/components/message-content.tsx
@@ -34,7 +34,7 @@ const MessageContent: FC<{ content: string }> = ({ content }) => {
   }, [content, mounted])
 
   return (
-    <p ref={root}>
+    <p ref={root} translate="no">
       <Linkify>{content}</Linkify>
     </p>
   )
diff --git a/services/web/frontend/js/features/chat/components/message.tsx b/services/web/frontend/js/features/chat/components/message.tsx
index aa2779f1e8..8a410c0d9d 100644
--- a/services/web/frontend/js/features/chat/components/message.tsx
+++ b/services/web/frontend/js/features/chat/components/message.tsx
@@ -29,7 +29,7 @@ function Message({ message, fromSelf }: MessageProps) {
   return (
     <div className="message-wrapper">
       {!fromSelf && (
-        <div className="name">
+        <div className="name" translate="no">
           <span>{message.user.first_name || message.user.email}</span>
         </div>
       )}
diff --git a/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx b/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
index 38795e145c..52664de105 100644
--- a/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
+++ b/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
@@ -68,7 +68,9 @@ export default function DictionaryModalContent({
           <ul className="list-unstyled dictionary-entries-list">
             {[...learnedWords].sort(wordsSortFunction).map(learnedWord => (
               <li key={learnedWord} className="dictionary-entry">
-                <span className="dictionary-entry-name">{learnedWord}</span>
+                <span className="dictionary-entry-name" translate="no">
+                  {learnedWord}
+                </span>
                 <OLTooltip
                   id={`tooltip-remove-learned-word-${learnedWord}`}
                   description={t('edit_dictionary_remove')}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
index e827c7e528..4d4efe6dbc 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
@@ -9,6 +9,7 @@ type Props = {
   disabledAccesibilityText?: string
   type?: 'button' | 'link'
   href?: string
+  translate?: React.HTMLAttributes<HTMLElement>['translate']
 }
 
 function LeftMenuButtonIcon({
@@ -34,12 +35,13 @@ export default function LeftMenuButton({
   disabledAccesibilityText,
   type = 'button',
   href,
+  translate,
 }: PropsWithChildren<Props>) {
   if (disabled) {
     return (
       <div className="left-menu-button link-disabled">
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
         {disabledAccesibilityText ? (
           <span className="sr-only">{disabledAccesibilityText}</span>
         ) : null}
@@ -51,7 +53,7 @@ export default function LeftMenuButton({
     return (
       <button onClick={onClick} className="left-menu-button">
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
       </button>
     )
   } else {
@@ -63,7 +65,7 @@ export default function LeftMenuButton({
         className="left-menu-button"
       >
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
       </a>
     )
   }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
index 8d7076ebd4..2eab7f25b5 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
@@ -34,6 +34,7 @@ export default function SettingsCompiler() {
       ]}
       label={t('compiler')}
       name="compiler"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
index 839bd499eb..8655a63cfc 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
@@ -43,6 +43,7 @@ export default function SettingsDocument() {
       options={validDocsOptions}
       label={t('main_document')}
       name="rootDocId"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
index 5f9ad51869..870ce48ca1 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
@@ -40,6 +40,7 @@ export default function SettingsEditorTheme() {
       options={options}
       label={t('editor_theme')}
       name="editorTheme"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
index 5a327093a4..a0c2ec49dc 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
@@ -29,6 +29,7 @@ export default function SettingsFontFamily() {
         ]}
         label={t('font_family')}
         name="fontFamily"
+        translateOptions="no"
       />
       <BetaBadge
         phase="release"
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
index f52347814a..a0499fe569 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
@@ -37,6 +37,7 @@ export default function SettingsImageName() {
       options={options}
       label={t('tex_live_version')}
       name="imageName"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
index 6b1f06ec36..c48486ec1c 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
@@ -28,6 +28,7 @@ type SettingsMenuSelectProps<T extends PossibleValue = string> = {
   onChange: (val: T) => void
   value?: T
   disabled?: boolean
+  translateOptions?: 'yes' | 'no'
 }
 
 export default function SettingsMenuSelect<T extends PossibleValue = string>({
@@ -39,6 +40,7 @@ export default function SettingsMenuSelect<T extends PossibleValue = string>({
   onChange,
   value,
   disabled = false,
+  translateOptions,
 }: SettingsMenuSelectProps<T>) {
   const handleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
     event => {
@@ -95,6 +97,7 @@ export default function SettingsMenuSelect<T extends PossibleValue = string>({
           value={value?.toString()}
           disabled={disabled}
           ref={selectRef}
+          translate={translateOptions}
         >
           {options.map(option => (
             <option
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
index 7adea8c57c..3a0269693e 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
@@ -23,6 +23,7 @@ export default function SettingsPdfViewer() {
       ]}
       label={t('pdf_viewer')}
       name="pdfViewer"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
index 6188d5e8ea..e9d8f52506 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
@@ -60,6 +60,7 @@ function OnlineUsersWidget({
             id="online-user"
             description={user.name}
             overlayProps={{ placement: 'bottom', trigger: ['hover', 'focus'] }}
+            tooltipProps={{ translate: 'no' }}
           >
             <span>
               {/* OverlayTrigger won't fire unless UserIcon is wrapped in a span */}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
index 3b67073316..48006b0dee 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
@@ -28,6 +28,7 @@ function FileTreeDoc({
       {...selectableEntityProps}
       aria-label={name}
       tabIndex={0}
+      translate="no"
     >
       <FileTreeItemInner
         id={id}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
index 5ad8481349..a35646b6d6 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
@@ -67,6 +67,7 @@ function FileTreeFolder({
         className={classNames(selectableEntityProps.className, {
           'dnd-droppable-hover': isOverRoot || isOverList,
         })}
+        translate="no"
       >
         <FileTreeItemInner
           id={id}
diff --git a/services/web/frontend/js/features/history/components/change-list/changes.tsx b/services/web/frontend/js/features/history/components/change-list/changes.tsx
index ea5e495be3..6e3c1ca30e 100644
--- a/services/web/frontend/js/features/history/components/change-list/changes.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/changes.tsx
@@ -23,6 +23,7 @@ function Changes({ pathnames, projectOps }: ChangesProps) {
           <div
             className="history-version-change-doc"
             data-testid="history-version-change-doc"
+            translate="no"
           >
             {pathname}
           </div>
@@ -41,6 +42,7 @@ function Changes({ pathnames, projectOps }: ChangesProps) {
           <div
             className="history-version-change-doc"
             data-testid="history-version-change-doc"
+            translate="no"
           >
             {getProjectOpDoc(op)}
           </div>
diff --git a/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx b/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
index 18736c4f37..c766c4e25b 100644
--- a/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
@@ -87,6 +87,7 @@ const ChangeTag = forwardRef<HTMLElement, TagProps>(
           className="history-version-badge"
           data-testid="history-version-badge"
           {...props}
+          translate={isPseudoCurrentStateLabel ? 'yes' : 'no'}
         >
           {isPseudoCurrentStateLabel
             ? t('history_label_project_current_state')
@@ -147,24 +148,32 @@ function TagTooltip({ label, currentUserId, showTooltip }: LabelBadgesProps) {
 
   const isPseudoCurrentStateLabel = isPseudoLabel(label)
   const currentLabelData = allLabels?.find(({ id }) => id === label.id)
-  const labelOwnerName =
-    currentLabelData && !isPseudoLabel(currentLabelData)
-      ? currentLabelData.user_display_name
-      : t('anonymous')
+  const isAnonymous = !currentLabelData || isPseudoLabel(currentLabelData)
+  const labelOwnerName = isAnonymous
+    ? t('anonymous')
+    : currentLabelData.user_display_name
+  const labelOwnerNameComponent = isAnonymous ? (
+    labelOwnerName
+  ) : (
+    <span translate="no">{labelOwnerName}</span>
+  )
 
   return !isPseudoCurrentStateLabel ? (
     <OLTooltip
       description={
         <div className="history-version-label-tooltip">
           <div className="history-version-label-tooltip-row">
-            <b className="history-version-label-tooltip-row-comment">
+            <b
+              className="history-version-label-tooltip-row-comment"
+              translate="no"
+            >
               <OLTagIcon />
               &nbsp;
               {label.comment}
             </b>
           </div>
           <div className="history-version-label-tooltip-row">
-            {t('history_label_created_by')} {labelOwnerName}
+            {t('history_label_created_by')} {labelOwnerNameComponent}
           </div>
           <div className="history-version-label-tooltip-row">
             <time>
diff --git a/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx b/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
index ed1da6e757..b72eeb2fc4 100644
--- a/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
@@ -14,6 +14,7 @@ function UserNameWithColoredBadge({
   currentUserId,
 }: UserNameWithColoredBadgeProps) {
   const { t } = useTranslation()
+  let allowBrowserTranslate = true
 
   let userName: string
   if (!user) {
@@ -22,8 +23,10 @@ function UserNameWithColoredBadge({
     userName = t('you')
   } else if ('displayName' in user) {
     userName = user.displayName
+    allowBrowserTranslate = false
   } else {
     userName = formatUserName(user)
+    allowBrowserTranslate = false
   }
 
   return (
@@ -32,7 +35,12 @@ function UserNameWithColoredBadge({
         className="history-version-user-badge-color"
         style={{ backgroundColor: getBackgroundColorForUserId(user?.id) }}
       />
-      <span className="history-version-user-badge-text">{userName}</span>
+      <span
+        className="history-version-user-badge-text"
+        translate={allowBrowserTranslate ? 'yes' : 'no'}
+      >
+        {userName}
+      </span>
     </>
   )
 }
diff --git a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
index e3543ef527..7088588e27 100644
--- a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
+++ b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
@@ -42,6 +42,7 @@ function HistoryFileTreeDoc({
       aria-selected={selected}
       aria-label={name}
       tabIndex={0}
+      translate="no"
     >
       <HistoryFileTreeItem
         name={name}
diff --git a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
index 44cb7f2921..738b0a4688 100644
--- a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
+++ b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
@@ -79,6 +79,7 @@ function HistoryFileTreeFolder({
             setExpanded(!expanded)
           }
         }}
+        translate="no"
       >
         <HistoryFileTreeItem name={name} icons={icons} />
       </li>
diff --git a/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx b/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
index 9949b98c7f..1c21df0f82 100644
--- a/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
@@ -83,7 +83,7 @@ export default function Breadcrumbs() {
   const numOutlineItems = outlineHierarchy.length
 
   return (
-    <div className="ol-cm-breadcrumbs">
+    <div className="ol-cm-breadcrumbs" translate="no">
       {folderHierarchy.map(folder => (
         <Fragment key={folder._id}>
           <div>{folder.name}</div>
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
index eba0fc5b6c..1a1a3f1c1e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
@@ -41,6 +41,7 @@ export default function EditorThemeSetting() {
       options={options}
       onChange={setEditorTheme}
       value={editorTheme}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
index d0310e2b1b..f1c279cf23 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
@@ -27,6 +27,7 @@ export default function FontFamilySetting() {
       onChange={setFontFamily}
       value={fontFamily}
       width="wide"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
index c007a0608e..1da6a167c6 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
@@ -38,6 +38,7 @@ export default function CompilerSetting() {
       options={OPTIONS}
       onChange={setCompiler}
       value={compiler}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
index 0574657971..0a7166ae68 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
@@ -38,6 +38,7 @@ export default function ImageNameSetting() {
       options={options}
       onChange={setImageName}
       value={imageName}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
index bd493a018a..719ea4da5a 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
@@ -44,6 +44,7 @@ export default function RootDocumentSetting() {
       options={validDocsOptions}
       onChange={setRootDocId}
       value={rootDocId}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
index 47c5c54ef0..3d9db79c3d 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
@@ -31,6 +31,7 @@ type SettingsMenuSelectProps<T extends PossibleValue = string> = {
   disabled?: boolean
   width?: 'default' | 'wide'
   loading?: boolean
+  translateOptions?: 'yes' | 'no'
 }
 
 export default function DropdownSetting<T extends PossibleValue = string>({
@@ -44,6 +45,7 @@ export default function DropdownSetting<T extends PossibleValue = string>({
   disabled = false,
   width = 'default',
   loading = false,
+  translateOptions,
 }: SettingsMenuSelectProps<T>) {
   const handleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
     event => {
@@ -78,6 +80,7 @@ export default function DropdownSetting<T extends PossibleValue = string>({
           onChange={handleChange}
           value={value?.toString()}
           disabled={disabled}
+          translate={translateOptions}
         >
           {options.map(option => (
             <option
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
index 20d1e56d11..87e5bba5cc 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
@@ -22,6 +22,7 @@ export default function PDFViewerSetting() {
       ]}
       onChange={setPdfViewer}
       value={pdfViewer}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
index 61e29023a0..43e5c678d7 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
@@ -58,7 +58,9 @@ export const ToolbarProjectTitle = () => {
         id="project-title-options"
         className="ide-redesign-toolbar-project-dropdown-toggle ide-redesign-toolbar-dropdown-toggle-subdued fw-bold ide-redesign-toolbar-button-subdued"
       >
-        <span className="ide-redesign-toolbar-project-name">{name}</span>
+        <span className="ide-redesign-toolbar-project-name" translate="no">
+          {name}
+        </span>
         <MaterialIcon
           type="keyboard_arrow_down"
           accessibilityLabel={t('project_title_options')}
diff --git a/services/web/frontend/js/features/outline/components/outline-item.tsx b/services/web/frontend/js/features/outline/components/outline-item.tsx
index 08a6b0f942..05539bdf13 100644
--- a/services/web/frontend/js/features/outline/components/outline-item.tsx
+++ b/services/web/frontend/js/features/outline/components/outline-item.tsx
@@ -62,6 +62,7 @@ const OutlineItem = memo(function OutlineItem({
       role="treeitem"
       aria-current={isHighlighted}
       aria-label={outlineItem.title}
+      translate="no"
     >
       <div className="outline-item-row">
         {!!outlineItem.children && (
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
index 0e9cc5246d..2ace1667f3 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
@@ -39,7 +39,7 @@ export default function PdfLogEntryRawContent({
           height: expanded || !needsExpander ? 'auto' : collapsedSize,
         }}
       >
-        <pre className="log-entry-content-raw" ref={elementRef}>
+        <pre className="log-entry-content-raw" ref={elementRef} translate="no">
           {rawContent.trim()}
         </pre>
       </div>
diff --git a/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx b/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
index 8ce318b1c8..f5b1f49ce6 100644
--- a/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
+++ b/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
@@ -86,7 +86,11 @@ function PreviewLogEntryHeader({
       onClick={onSourceLocationClick}
     >
       <MaterialIcon type="link" />
-      <span ref={logLocationSpanRef} className="log-entry-header-link-location">
+      <span
+        ref={logLocationSpanRef}
+        className="log-entry-header-link-location"
+        translate="no"
+      >
         {`\u202A${locationLinkText}\u202C`}
       </span>
     </OLButton>
@@ -105,7 +109,7 @@ function PreviewLogEntryHeader({
           id={locationLinkText}
           description={locationLinkText}
           overlayProps={{ placement: 'left' }}
-          tooltipProps={{ className: 'log-location-tooltip' }}
+          tooltipProps={{ className: 'log-location-tooltip', translate: 'no' }}
         >
           {locationLink}
         </OLTooltip>
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
index 932813faef..ae53fbc8c8 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
@@ -12,7 +12,7 @@ const ReviewPanelEntryUser = ({
   const userName = buildName(user)
 
   return (
-    <div className="review-panel-entry-user">
+    <div className="review-panel-entry-user" translate="no">
       <span
         className="review-panel-entry-user-color-badge"
         style={{
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
index 7a8d29f032..2e107159ed 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
@@ -11,6 +11,7 @@ export const ExpandableContent = memo<{
   newLineCharsLimit?: number
   checkNewLines?: boolean
   inline?: boolean
+  translate?: 'yes' | 'no'
 }>(function ExpandableContent({
   content,
   className,
@@ -18,6 +19,7 @@ export const ExpandableContent = memo<{
   newLineCharsLimit = 3,
   checkNewLines = true,
   inline = false,
+  translate,
 }) {
   const { t } = useTranslation()
   const contentRef = useRef<HTMLDivElement>(null)
@@ -50,6 +52,7 @@ export const ExpandableContent = memo<{
       <div
         ref={contentRef}
         className={classNames('review-panel-expandable-content', className)}
+        translate={translate}
       >
         {isExpanded ? content : content.slice(0, limit)}
         {isOverflowing && !isExpanded && '...'}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
index ae3a66f729..d6017208d8 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
@@ -135,6 +135,7 @@ export const ReviewPanelMessage: FC<{
           contentLimit={100}
           checkNewLines
           content={message.content}
+          translate="no"
         />
       )}
 
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
index 53ac6d2192..76a12cd1c3 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
@@ -73,7 +73,10 @@ export const ReviewPanelResolvedThread: FC<{
             i18nKey="from_filename"
             components={[
               // eslint-disable-next-line react/jsx-key
-              <span className="review-panel-resolved-comment-filename" />,
+              <span
+                className="review-panel-resolved-comment-filename"
+                translate="no"
+              />,
             ]}
             values={{ filename: docName }}
             shouldUnescape
@@ -121,6 +124,7 @@ export const ReviewPanelResolvedThread: FC<{
           className="review-panel-resolved-comment-quoted-text-quote"
           content={comment?.op.c}
           checkNewLines
+          translate="no"
         />
       </div>
 
diff --git a/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts b/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
index a2fd37473f..30eb0098f8 100644
--- a/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
@@ -238,7 +238,7 @@ const toolbarTheme = EditorView.theme({
       color: 'inherit',
     },
     '& .ol-cm-toolbar-menu': {
-      width: '120px',
+      minWidth: '120px',
       display: 'flex',
       flexDirection: 'column',
       boxSizing: 'border-box',
diff --git a/services/web/frontend/js/shared/components/collapsible-file-header.tsx b/services/web/frontend/js/shared/components/collapsible-file-header.tsx
index efcd51a74f..b12239fd85 100644
--- a/services/web/frontend/js/shared/components/collapsible-file-header.tsx
+++ b/services/web/frontend/js/shared/components/collapsible-file-header.tsx
@@ -11,6 +11,7 @@ export const CollapsibleFileHeader: FC<{
     type="button"
     className="collapsible-file-header"
     onClick={toggleCollapsed}
+    translate="no"
   >
     <MaterialIcon
       type={collapsed ? 'keyboard_arrow_right' : 'keyboard_arrow_down'}
diff --git a/services/web/test/acceptance/src/ProjectInviteTests.mjs b/services/web/test/acceptance/src/ProjectInviteTests.mjs
index df13d71d37..e61feff6c9 100644
--- a/services/web/test/acceptance/src/ProjectInviteTests.mjs
+++ b/services/web/test/acceptance/src/ProjectInviteTests.mjs
@@ -200,7 +200,7 @@ const expectInvitePage = (user, link, callback) => {
   tryFollowInviteLink(user, link, (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(200)
-    expect(body).to.match(/<title>Project Invite - .*<\/title>/)
+    expect(body).to.match(/<title[^>]*>Project Invite - .*<\/title>/)
     callback()
   })
 }
@@ -210,7 +210,7 @@ const expectInvalidInvitePage = (user, link, callback) => {
   tryFollowInviteLink(user, link, (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(404)
-    expect(body).to.match(/<title>Invalid Invite - .*<\/title>/)
+    expect(body).to.match(/<title[^>]*>Invalid Invite - .*<\/title>/)
     callback()
   })
 }
@@ -237,7 +237,9 @@ const expectLoginPage = (user, callback) => {
   tryFollowLoginLink(user, '/login', (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(200)
-    expect(body).to.match(/<title>(Login|Log in to Overleaf) - .*<\/title>/)
+    expect(body).to.match(
+      /<title[^>]*>(Login|Log in to Overleaf) - .*<\/title>/
+    )
     callback()
   })
 }
diff --git a/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs b/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
index e79bfd5b2e..2bc3010412 100644
--- a/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
+++ b/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
@@ -12,7 +12,7 @@ export default {
   restricted: {
     html(response, body) {
       expect(response.statusCode).to.equal(403)
-      expect(body).to.match(/<head><title>Restricted/)
+      expect(body).to.match(/<head><title translate="no">Restricted/)
     },
     json(response, body) {
       expect(response.statusCode).to.equal(403)
diff --git a/services/web/test/smoke/src/steps/100_loadProjectDashboard.js b/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
index 2a60f8d4b3..aa471e0672 100644
--- a/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
+++ b/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
@@ -1,4 +1,5 @@
-const TITLE_REGEX = /<title>Your projects - .*, Online LaTeX Editor<\/title>/
+const TITLE_REGEX =
+  /<title[^>]*>Your projects - .*, Online LaTeX Editor<\/title>/
 
 async function run({ request, assertHasStatusCode }) {
   const response = await request('/project')