Localize the chrome://flags/enterprise page

Even if the chrome://flags page is not localized, the
chrome://flags/enterprise page has to be localized.
Also, that page should not have  dev and beta channel promo messages.

Screenshot: http://screen/NRUmyRFCMkG

Bug: 982371
Change-Id: I2939d6f38467d60d3dcd2da79b419c24c5692c43
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1721049
Commit-Queue: Yann Dago <ydago@chromium.org>
Reviewed-by: Nico Weber <thakis@chromium.org>
Reviewed-by: Hector Carmona <hcarmona@chromium.org>
Reviewed-by: Eugene But <eugenebut@chromium.org>
Cr-Commit-Position: refs/heads/master@{#689657}

chrome/browser/ui/webui/flags_ui.cc

@@ -58,9 +58,6 @@ content::WebUIDataSource* CreateFlagsUIHTMLSource() {
       content::WebUIDataSource::Create(chrome::kChromeUIFlagsHost);
   source->OverrideContentSecurityPolicyScriptSrc(
       "script-src chrome://resources 'self' 'unsafe-eval';");
-
-  source->AddLocalizedString(flags_ui::kFlagsRestartNotice,
-                             IDS_FLAGS_UI_RELAUNCH_NOTICE);
   source->AddString(flags_ui::kVersion, version_info::GetVersionNumber());
 
 #if defined(OS_CHROMEOS)
@@ -69,11 +66,11 @@ content::WebUIDataSource* CreateFlagsUIHTMLSource() {
     // Set the string to show which user can actually change the flags.
     std::string owner;
     chromeos::CrosSettings::Get()->GetString(chromeos::kDeviceOwner, &owner);
-    source->AddString(flags_ui::kOwnerEmail, base::UTF8ToUTF16(owner));
+    source->AddString("owner-warning",
+                      l10n_util::GetStringFUTF16(IDS_FLAGS_UI_OWNER_WARNING,
+                                                 base::UTF8ToUTF16(owner)));
   } else {
-    // The warning will be only shown on ChromeOS, when the current user is not
-    // the owner.
-    source->AddString(flags_ui::kOwnerEmail, base::string16());
+    source->AddString("owner-warning", base::string16());
   }
 #endif
 
@@ -123,6 +120,64 @@ void FinishInitialization(base::WeakPtr<T> flags_ui,
 
 }  // namespace
 
+// static
+void FlagsUI::AddFlagsStrings(content::WebUIDataSource* source) {
+  // Strings added here are all marked a non-translatable, so they are not
+  // actually localized.
+  source->AddLocalizedString(flags_ui::kFlagsRestartNotice,
+                             IDS_FLAGS_UI_RELAUNCH_NOTICE);
+  source->AddLocalizedString("available", IDS_FLAGS_UI_AVAILABLE_FEATURE);
+  source->AddLocalizedString("clear-search", IDS_FLAGS_UI_CLEAR_SEARCH);
+  source->AddLocalizedString("disabled", IDS_FLAGS_UI_DISABLED_FEATURE);
+  source->AddLocalizedString("enabled", IDS_FLAGS_UI_ENABLED_FEATURE);
+  source->AddLocalizedString("experiment-enabled",
+                             IDS_FLAGS_UI_EXPERIMENT_ENABLED);
+  source->AddLocalizedString("no-results", IDS_FLAGS_UI_NO_RESULTS);
+  source->AddLocalizedString("not-available-platform",
+                             IDS_FLAGS_UI_NOT_AVAILABLE_ON_PLATFORM);
+  source->AddLocalizedString("page-warning", IDS_FLAGS_UI_PAGE_WARNING);
+  source->AddLocalizedString("page-warning-explanation",
+                             IDS_FLAGS_UI_PAGE_WARNING_EXPLANATION);
+  source->AddLocalizedString("relaunch", IDS_FLAGS_UI_RELAUNCH);
+  source->AddLocalizedString("reset", IDS_FLAGS_UI_PAGE_RESET);
+  source->AddLocalizedString("reset-complete", IDS_FLAGS_UI_RESET_COMPLETE);
+  source->AddLocalizedString("search-placeholder",
+                             IDS_FLAGS_UI_SEARCH_PLACEHOLDER);
+  source->AddLocalizedString("title", IDS_FLAGS_UI_TITLE);
+  source->AddLocalizedString("unavailable", IDS_FLAGS_UI_UNAVAILABLE_FEATURE);
+}
+
+// static
+void FlagsEnterpriseUI::AddEnterpriseStrings(content::WebUIDataSource* source) {
+  source->AddLocalizedString(flags_ui::kFlagsRestartNotice,
+                             IDS_ENTERPRISE_SETTINGS_RELAUNCH_NOTICE);
+  source->AddLocalizedString("available",
+                             IDS_ENTERPRISE_SETTINGS_AVAILABLE_FEATURE);
+  source->AddLocalizedString("clear-search", IDS_ENTERPRISE_UI_CLEAR_SEARCH);
+  source->AddLocalizedString("disabled",
+                             IDS_ENTERPRISE_SETTINGS_DISABLED_FEATURE);
+  source->AddLocalizedString("enabled",
+                             IDS_ENTERPRISE_SETTINGS_ENABLED_FEATURE);
+  source->AddLocalizedString("experiment-enabled",
+                             IDS_ENTERPRISE_UI_EXPERIMENT_ENABLED);
+  source->AddLocalizedString("no-results", IDS_ENTERPRISE_SETTINGS_NO_RESULTS);
+  source->AddLocalizedString("not-available-platform",
+                             IDS_ENTERPRISE_SETTINGS_NOT_AVAILABLE_ON_PLATFORM);
+  source->AddLocalizedString("page-warning",
+                             IDS_ENTERPRISE_SETTINGS_PAGE_WARNING);
+  source->AddLocalizedString("page-warning-explanation",
+                             IDS_ENTERPRISE_SETTINGS_PAGE_WARNING_EXPLANATION);
+  source->AddLocalizedString("relaunch", IDS_ENTERPRISE_SETTINGS_RELAUNCH);
+  source->AddLocalizedString("reset", IDS_ENTERPRISE_SETTINGS_PAGE_RESET);
+  source->AddLocalizedString("reset-complete",
+                             IDS_ENTERPRISE_UI_RESET_COMPLETE);
+  source->AddLocalizedString("search-placeholder",
+                             IDS_ENTERPRISE_SETTINGS_SEARCH_PLACEHOLDER);
+  source->AddLocalizedString("title", IDS_ENTERPRISE_SETTINGS_TITLE);
+  source->AddLocalizedString("unavailable",
+                             IDS_ENTERPRISE_SETTINGS_UNAVAILABLE_FEATURE);
+}
+
 template <class T>
 FlagsUIHandler* InitializeHandler(content::WebUI* web_ui,
                                   Profile* profile,
@@ -163,7 +218,9 @@ FlagsUI::FlagsUI(content::WebUI* web_ui)
   handler->set_enterprise_features_only(false);
 
   // Set up the about:flags source.
-  content::WebUIDataSource::Add(profile, CreateFlagsUIHTMLSource());
+  auto* source = CreateFlagsUIHTMLSource();
+  AddFlagsStrings(source);
+  content::WebUIDataSource::Add(profile, source);
 }
 
 FlagsUI::~FlagsUI() {
@@ -184,7 +241,9 @@ FlagsEnterpriseUI::FlagsEnterpriseUI(content::WebUI* web_ui)
   handler->set_enterprise_features_only(true);
 
   // Set up the about:enterprise-flags source.
-  content::WebUIDataSource::Add(profile, CreateFlagsUIHTMLSource());
+  auto* source = CreateFlagsUIHTMLSource();
+  AddEnterpriseStrings(source);
+  content::WebUIDataSource::Add(profile, source);
 }
 
 FlagsEnterpriseUI::~FlagsEnterpriseUI() {}

chrome/browser/ui/webui/flags_ui.h

@@ -19,11 +19,16 @@ namespace base {
 class RefCountedMemory;
 }
 
+namespace content {
+class WebUIDataSource;
+}
+
 class FlagsUI : public content::WebUIController {
  public:
   explicit FlagsUI(content::WebUI* web_ui);
   ~FlagsUI() override;
 
+  static void AddFlagsStrings(content::WebUIDataSource* source);
   static base::RefCountedMemory* GetFaviconResourceBytes(
       ui::ScaleFactor scale_factor);
 
@@ -38,6 +43,7 @@ class FlagsEnterpriseUI : public content::WebUIController {
   explicit FlagsEnterpriseUI(content::WebUI* web_ui);
   ~FlagsEnterpriseUI() override;
 
+  static void AddEnterpriseStrings(content::WebUIDataSource* source);
   static bool IsEnterpriseUrl(const GURL& url);
 
  private:

chrome/browser/ui/webui/flags_ui_handler.cc

@@ -92,10 +92,12 @@ void FlagsUIHandler::HandleRequestExperimentalFeatures(
 
 #if defined(OS_WIN) || defined(OS_MACOSX) || defined(OS_CHROMEOS)
   version_info::Channel channel = chrome::GetChannel();
-  results.SetBoolean(flags_ui::kShowBetaChannelPromotion,
-                     channel == version_info::Channel::STABLE);
-  results.SetBoolean(flags_ui::kShowDevChannelPromotion,
-                     channel == version_info::Channel::BETA);
+  results.SetBoolean(
+      flags_ui::kShowBetaChannelPromotion,
+      channel == version_info::Channel::STABLE && !enterprise_features_only_);
+  results.SetBoolean(
+      flags_ui::kShowDevChannelPromotion,
+      channel == version_info::Channel::BETA && !enterprise_features_only_);
 #else
   results.SetBoolean(flags_ui::kShowBetaChannelPromotion, false);
   results.SetBoolean(flags_ui::kShowDevChannelPromotion, false);

chrome/browser/ui/webui/flags_ui_unittest.cc

@@ -4,12 +4,19 @@
 
 #include "chrome/browser/ui/webui/flags_ui.h"
 
+#include "base/values.h"
+#include "content/public/test/test_browser_thread_bundle.h"
+#include "content/public/test/test_web_ui_data_source.h"
+
 #include "testing/gtest/include/gtest/gtest.h"
 #include "url/gurl.h"
 
 class FlagsUITest : public testing::Test {
  public:
   FlagsUITest() = default;
+
+ private:
+  content::TestBrowserThreadBundle bundle_;
 };
 
 TEST_F(FlagsUITest, IsEnterpriseUrl) {
@@ -30,3 +37,15 @@ TEST_F(FlagsUITest, IsEnterpriseUrl) {
               FlagsEnterpriseUI::IsEnterpriseUrl(GURL(expectation.url)));
   }
 }
+
+TEST_F(FlagsUITest, FlagsAndEnterpriseSources) {
+  std::unique_ptr<content::TestWebUIDataSource> flags_strings =
+      content::TestWebUIDataSource::Create("A");
+  std::unique_ptr<content::TestWebUIDataSource> enterprise_strings =
+      content::TestWebUIDataSource::Create("B");
+  FlagsUI::AddFlagsStrings(flags_strings->GetWebUIDataSource());
+  FlagsEnterpriseUI::AddEnterpriseStrings(
+      enterprise_strings->GetWebUIDataSource());
+  EXPECT_EQ(flags_strings->GetLocalizedStrings()->size(),
+            enterprise_strings->GetLocalizedStrings()->size());
+}

components/components_chromium_strings.grd

@@ -188,12 +188,24 @@
 
       <!-- About Flags UI -->
       <if expr="not chromeos">
-        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" desc="Notifies the user that they need to relaunch Chromium. Shown next to a button that says 'Relaunch Now'.">
+        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" translateable="false" desc="Notifies the user that they need to relaunch Chromium. Shown next to a button that says 'Relaunch Now'.">
           Your changes will take effect the next time you relaunch Chromium.
         </message>
       </if>
       <if expr="chromeos">
-        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" desc="Notifies the user that they need to restart Chromium OS. Shown next to a button that says 'Restart Now'.">
+        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" translateable="false" desc="Notifies the user that they need to restart Chromium OS. Shown next to a button that says 'Restart Now'.">
+          Your changes will take effect the next time you restart your device.
+        </message>
+      </if>
+
+      <!-- about:flags/enterprise strings -->
+      <if expr="not chromeos">
+        <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH_NOTICE" desc="Notifies the user that they need to relaunch Chromium. Shown next to a button that says 'Relaunch Now'.">
+          Your changes will take effect the next time you relaunch Chromium.
+        </message>
+      </if>
+      <if expr="chromeos">
+        <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH_NOTICE" desc="Notifies the user that they need to restart Chromium OS. Shown next to a button that says 'Restart Now'.">
           Your changes will take effect the next time you restart your device.
         </message>
       </if>

components/components_google_chrome_strings.grd

@@ -188,12 +188,24 @@
 
       <!-- About Flags UI -->
       <if expr="not chromeos">
-        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" desc="Notifies the user that they need to relaunch Chrome. Shown next to a button that says 'Relaunch Now'.">
+        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" translateable="false" desc="Notifies the user that they need to relaunch Chrome. Shown next to a button that says 'Relaunch Now'.">
           Your changes will take effect the next time you relaunch Google Chrome.
         </message>
       </if>
       <if expr="chromeos">
-        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" desc="Notifies the user that they need to restart Chrome OS. Shown next to a button that says 'Restart Now'.">
+        <message name="IDS_FLAGS_UI_RELAUNCH_NOTICE" translateable="false" desc="Notifies the user that they need to restart Chrome OS. Shown next to a button that says 'Restart Now'.">
+          Your changes will take effect the next time you restart your device.
+        </message>
+      </if>
+
+      <!-- about:flags/enterprise strings -->
+      <if expr="not chromeos">
+        <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH_NOTICE" desc="Notifies the user that they need to relaunch Chrome. Shown next to a button that says 'Relaunch Now'.">
+          Your changes will take effect the next time you relaunch Google Chrome.
+        </message>
+      </if>
+      <if expr="chromeos">
+        <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH_NOTICE" desc="Notifies the user that they need to restart Chrome OS. Shown next to a button that says 'Restart Now'.">
           Your changes will take effect the next time you restart your device.
         </message>
       </if>

components/components_strings.grd

@@ -204,6 +204,7 @@
       <part file="dom_distiller_strings.grdp" />
       <part file="error_page_strings.grdp" />
       <part file="find_in_page_strings.grdp" />
+      <part file="flags_strings.grdp" />
       <part file="history_strings.grdp" />
       <part file="login_dialog_strings.grdp" />
       <part file="media_message_center_strings.grdp" />

components/flags_strings.grdp

+<?xml version="1.0" encoding="utf-8"?>
+<grit-part>
+  <!-- about:flags
+      Not translated. See discussion at: https://crbug.com/587272
+      New entries here should also be added for About:flags/enterprise below -->
+  <message name="IDS_FLAGS_UI_SEARCH_PLACEHOLDER" translateable="false" desc="The placeholder for the search box on the about:flags page.">
+    Search flags
+  </message>
+  <message name="IDS_FLAGS_UI_TITLE" translateable="false" desc="The page title for the about:flags page.">
+    Experiments
+  </message>
+  <message name="IDS_FLAGS_UI_PAGE_RESET" translateable="false" desc="Label for button that resets the flags to their default value.">
+    Reset all to default
+  </message>
+  <message name="IDS_FLAGS_UI_PAGE_WARNING" desc="A warning stating that the features of the page are experimental.">
+    Warning: Experimental features ahead!
+  </message>
+  <message name="IDS_FLAGS_UI_PAGE_WARNING_EXPLANATION" desc="A warning stating what the user gets exposed to by enabling one the features.">
+    By enabling these features, you could lose browser data or
+    compromise your security or privacy. Enabled features apply to all
+    users of this browser.
+  </message>
+  <message name="IDS_FLAGS_UI_OWNER_WARNING" translateable="false" desc="A warning stating what system-wide features can only be set by the owner.">
+    Flags that apply system-wide can only be set by the owner: <ph name="OWNER_EMAIL">$1<ex>owner@email.com</ex></ph>
+  </message>
+  <message name="IDS_FLAGS_UI_AVAILABLE_FEATURE" translateable="false" desc="Label for button that shows available features.">
+    Available
+  </message>
+  <message name="IDS_FLAGS_UI_UNAVAILABLE_FEATURE" translateable="false" desc="Label for button that shows unavailable features.">
+    Unavailable
+  </message>
+  <message name="IDS_FLAGS_UI_ENABLED_FEATURE" translateable="false" desc="This is the 'Enabled' option, not the label for the menu.">
+    Enabled
+  </message>
+  <message name="IDS_FLAGS_UI_DISABLED_FEATURE" translateable="false" desc="This is the 'Disabled' option, not the label for the menu.">
+    Disabled
+  </message>
+  <message name="IDS_FLAGS_UI_NO_RESULTS" translateable="false" desc="Message stating that there are no experiments matching the search criterias.">
+    No matching experiments
+  </message>
+  <message name="IDS_FLAGS_UI_NOT_AVAILABLE_ON_PLATFORM" translateable="false" desc="Message stating that an experiment is not available for the current platform.">
+    Not available on your platform.
+  </message>
+  <if expr="chromeos">
+    <message name="IDS_FLAGS_UI_RELAUNCH" translateable="false" desc="Label for button that restarts chrome os.">
+      Restart
+    </message>
+  </if>
+  <if expr="not chromeos">
+    <message name="IDS_FLAGS_UI_RELAUNCH" translateable="false" desc="Label for button that relaunches chrome.">
+      Relaunch
+    </message>
+  </if>
+  <message name="IDS_FLAGS_UI_CLEAR_SEARCH" translateable="false" desc="Tooltip for icon button that clears the searchbar on the chrome://flags page.">
+    Clear search
+  </message>
+  <message name="IDS_FLAGS_UI_RESET_COMPLETE" translateable="false" desc="Screen reader text stating that the reset action was completed.">
+    Reset complete
+  </message>
+  <message name="IDS_FLAGS_UI_EXPERIMENT_ENABLED" translateable="false" desc="Screen reader text stating that an experiment is enabled.">
+    Experiment enabled
+  </message>
+  <!-- about:flags/enterprise
+      New entries here should also be added for about:flags above -->
+  <message name="IDS_ENTERPRISE_SETTINGS_PAGE_RESET" desc="Label for button that resets the features to their default value.">
+    Reset all to default
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_OWNER_WARNING" desc="A warning stating what system-wide features can only be set by the owner.">
+    Features that apply system-wide can only be set by the owner: <ph name="OWNER_EMAIL">$1<ex>owner@email.com</ex></ph>
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_AVAILABLE_FEATURE" desc="Label for button that shows available features.">
+    Available
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_UNAVAILABLE_FEATURE" desc="Label for button that shows unavailable features.">
+    Unavailable
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_ENABLED_FEATURE" desc="This is the 'Enabled' option, not the label for the menu.">
+    Enabled
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_DISABLED_FEATURE" desc="This is the 'Disabled' option, not the label for the menu">
+    Disabled
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_NOT_AVAILABLE_ON_PLATFORM" desc="Message stating that an experiment is not available for the current platform.">
+    Not available on your platform.
+  </message>
+  <if expr="chromeos">
+    <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH" desc="Label for button that restarts chrome os.">
+      Restart
+    </message>
+  </if>
+  <if expr="not chromeos">
+    <message name="IDS_ENTERPRISE_SETTINGS_RELAUNCH" desc="Label for button that relaunches chrome.">
+      Relaunch
+    </message>
+  </if>
+  <message name="IDS_ENTERPRISE_SETTINGS_SEARCH_PLACEHOLDER" desc="The placeholder for the search box on the about:enterprise-settings page.">
+    Search features
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_TITLE" desc="The page title for the about:enterprise-settings page.">
+    Deprecated Features
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_PAGE_WARNING" desc="A warning stating that the features of the page are experimental.">
+    Warning: Deprecated features ahead!
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_PAGE_WARNING_EXPLANATION" desc="Warning to users that features are deprecated. Shown prominently at the top of the page.">
+    By enabling these features, you will be using deprecated features
+    that will disappear in future versions.
+  </message>
+  <message name="IDS_ENTERPRISE_SETTINGS_NO_RESULTS" desc="Message shown when searching and no results were found.">
+    No matching features
+  </message>
+  <message name="IDS_ENTERPRISE_UI_CLEAR_SEARCH" desc="Tooltip for icon button that clears the searchbar on the chrome://flags/enterprise page.">
+    Clear search
+  </message>
+  <message name="IDS_ENTERPRISE_UI_RESET_COMPLETE" desc="Screen reader text stating that the reset action was completed.">
+    Reset complete
+  </message>
+  <message name="IDS_ENTERPRISE_UI_EXPERIMENT_ENABLED" desc="Screen reader text stating that an experiment is enabled.">
+    Experiment enabled
+  </message>
+</grit-part>

components/flags_ui/flags_ui_constants.cc

@@ -23,7 +23,6 @@ const char kRestartBrowser[] = "restartBrowser";
 const char kFlagsRestartButton[] = "flagsRestartButton";
 const char kFlagsRestartNotice[] = "flagsRestartNotice";
 const char kNeedsRestart[] = "needsRestart";
-const char kOwnerEmail[] = "ownerEmail";
 const char kReturnExperimentalFeatures[] = "returnExperimentalFeatures";
 const char kShowBetaChannelPromotion[] = "showBetaChannelPromotion";
 const char kShowDevChannelPromotion[] = "showDevChannelPromotion";

components/flags_ui/flags_ui_constants.h

@@ -27,7 +27,6 @@ extern const char kRestartBrowser[];
 extern const char kFlagsRestartButton[];
 extern const char kFlagsRestartNotice[];
 extern const char kNeedsRestart[];
-extern const char kOwnerEmail[];
 extern const char kReturnExperimentalFeatures[];
 extern const char kShowBetaChannelPromotion[];
 extern const char kShowDevChannelPromotion[];

components/flags_ui/resources/flags.html

@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link rel="stylesheet" href="chrome://resources/css/text_defaults_md.css">
 </if>
-<title>Flags</title>
+<title>$i18n{title}</title>
 
 <link rel="stylesheet" href="chrome://flags/flags.css">
 
@@ -17,7 +17,9 @@
   <script src="chrome://resources/js/ios/web_ui.js"></script>
 </if>
 
-<script src="chrome://flags/flags_style_loader.js"></script>
+<if expr="not is_ios">
+  <script src="chrome://flags/flags_style_loader.js"></script>
+</if>
 <script src="chrome://resources/js/cr.js"></script>
 <script src="chrome://resources/js/cr/ui/focus_outline_manager.js"></script>
 <script src="chrome://resources/js/util.js"></script>
@@ -26,48 +28,42 @@
 <div id="header">
   <div class="flex-container">
     <div id="enterprise-flags-title" class="flex">
-      <h1>Deprecated features</h1>
+      <h1>$i18n{title}</h1>
     </div>
     <div class="flex center-content">
       <div class="search-container">
         <div class="search-hint"></div>
-        <input type="text" id="search" placeholder="Search flags" tabindex="1"
+        <input type="text" id="search" placeholder="$i18n{search-placeholder}" tabindex="1"
             autocomplete="off" spellcheck="false">
-        <input type="button" class="clear-search" title="Clear search"
+        <input type="button" class="clear-search" title="$i18n{clear-search}"
             tabindex="2">
       </div>
     </div>
     <div class="flex">
       <button id="experiment-reset-all" type="button" tabindex="3">
-        Reset all to default
+          $i18n{reset}
       </button>
       <div class="screen-reader-only" id="reset-all-success-message"
-           role="status">Reset complete</div>
+           role="status">$i18n{reset-complete}</div>
     </div>
   </div>
 </div>
 <div id="body-container" style="visibility:hidden">
   <div id="flagsTemplate">
     <div id="flags-title" class="flex-container">
-      <div class="flex"><h1 class="section-header-title">Experiments</h1></div>
+      <div class="flex"><h1 class="section-header-title">$i18n{title}</h1></div>
       <span id="version" class="flex">$i18n{version}</span>
     </div>
     <div class="blurb-container">
-      <span class="blurb-warning">
-         Warning: Experimental features ahead!
-      </span>
-      <span>
-        By enabling these features, you could lose browser data or
-        compromise your security or privacy. Enabled features apply to all
-        users of this browser.
-      </span>
+      <span class="blurb-warning">$i18n{page-warning}</span>
+      <span>$i18n{page-warning-explanation}</span>
 <if expr="chromeos">
-      <p id="owner-warning">
-        <span>Flags that apply system-wide can only be set by the owner: $i18n{ownerEmail}</span>
-      </p>
+      <p id="owner-warning">$i18n{owner-warning}</p>
 </if>
     </div>
     <p id="promos" hidden>
+      <!-- Those strings are not localized because they only appear in
+           chrome://flags, which is not localized. -->
       <span id="channel-promo-beta" hidden>
         Interested in cool new Chrome features? Try our
         <a href="https://chrome.com/beta">beta channel</a>.
@@ -82,7 +78,7 @@
         <a href="#tab-content-available" id="tab-available" class="tab" role="tab"
             aria-selected="true"
             aria-controls="panel1"
-            tabindex="4">Available</a>
+            tabindex="4">$i18n{available}</a>
         <div id="tab-content-available" class="tab-content"
             role="tabpanel" aria-labelledby="tab-available" aria-hidden="false">
         </div>
@@ -96,7 +92,7 @@
                     : 'experiment-switched flex-container'">
               <div class="flex">
                 <h3 class="experiment-name" jscontent="name"
-                    jsvalues="title: is_default ? '' : 'Experiment enabled';
+                    jsvalues="title: is_default ? '' : $i18n{experiment-enabled};
                         id:internal_name + '_name'"></h3>
                 <p>
                   <span jsvalues=".innerHTML:description"></span> –
@@ -127,9 +123,9 @@
                     jsvalues=".internal_name:internal_name;
                         aria-labelledby:internal_name + '_name'">
                   <option jsvalues=".selected:!enabled; data-default: enabled ? 1 : 0"
-                      value="disabled">Disabled</option>
+                      value="disabled">$i18n{disabled}</option>
                   <option jsvalues=".selected:enabled; data-default: !enabled ? 1 : 0"
-                      value="enabled">Enabled</option>
+                      value="enabled">$i18n{enabled}</option>
                 </select>
               </div>
             </div>
@@ -143,7 +139,7 @@
                     : 'experiment-switched flex-container'">
               <div class="flex">
                 <h3 class="experiment-name" jscontent="name"
-                    jsvalues="title: is_default ? '' : 'Experiment enabled';
+                    jsvalues="title: is_default ? '' : $i18n{experiment-enabled};
                         id:internal_name + '_name'"></h3>
                 <p>
                   <span jsvalues=".innerHTML:description"></span> –
@@ -175,14 +171,14 @@
                     jsvalues=".internal_name:internal_name;
                         aria-labelledby:internal_name + '_name'">
                   <option jsvalues=".selected:!enabled; data-default:!enabled ? 1 : 0"
-                      value="disabled">Disabled</option>
+                      value="disabled">$i18n{disabled}</option>
                   <option jsvalues=".selected:enabled; data-default: enabled ? 1 : 0"
-                      value="enabled">Enabled</option>
+                      value="enabled">$i18n{enabled}</option>
                 </select>
               </div>
             </div>
           </div>
-          <div class="no-match hidden" role="alert">No matching experiments</div>
+          <div class="no-match hidden" role="alert">$i18n{no-results}</div>
         </div>
       </li>
 <!-- Unsupported experiments are not shown on iOS -->
@@ -190,7 +186,7 @@
       <li>
         <a href="#tab-content-unavailable" id="tab-unavailable" class="tab" role="tab"
            aria-selected="false" aria-controls="panel2"
-           tabindex="5">Unavailable</a>
+           tabindex="5">$i18n{unavailable}</a>
         <div id="tab-content-unavailable" class="tab-content"
             role="tabpanel" aria-labelledby="tab-unavailable" aria-hidden="false">
           <div class="experiment"
@@ -201,7 +197,7 @@
                     : 'experiment-switched flex-container'">
               <div class="flex">
                 <h3 class="experiment-name"
-                    jscontent="name">Name</h3>
+                    jscontent="name"></h3>
                 <p>
                   <span jsvalues=".innerHTML:description"></span>
                   <span class="platforms" jscontent="supported_platforms.join(', ')"></span>
@@ -210,11 +206,11 @@
                     jsvalues="href: '#' + internal_name"
                     jscontent="'#' + internal_name" tabindex="8"></a>
               </div>
-              <div class="flex experiment-actions">Not available on your platform.</div>
+              <div class="flex experiment-actions">$i18n{not-available-platform}</div>
             </div>
           </div>
           <div class="no-match hidden" role="alert">
-            No matching experiments
+            $i18n{no-results}
           </div>
         </div>
       </li>
@@ -226,12 +222,7 @@
         <div class="flex">
 <if expr="not is_ios">
           <button id="experiment-restart-button" class="primary" tabindex="9">
-<if expr="not chromeos">
-          Relaunch Now
-</if>
-<if expr="chromeos">
-          Restart Now
-</if>
+            $i18n{relaunch}
           </button>
 </if>
         </div>

ios/chrome/browser/ui/webui/flags_ui.cc

@@ -39,12 +39,10 @@ namespace {
 web::WebUIIOSDataSource* CreateFlagsUIHTMLSource() {
   web::WebUIIOSDataSource* source =
       web::WebUIIOSDataSource::Create(kChromeUIFlagsHost);
-
-  source->AddLocalizedString(flags_ui::kFlagsRestartNotice,
-                             IDS_FLAGS_UI_RELAUNCH_NOTICE);
   source->AddString(flags_ui::kVersion, version_info::GetVersionNumber());
 
   source->UseStringsJs();
+  FlagsUI::AddFlagsIOSStrings(source);
   source->AddResourcePath(flags_ui::kFlagsJS, IDR_FLAGS_UI_FLAGS_JS);
   source->AddResourcePath(flags_ui::kFlagsCSS, IDR_FLAGS_UI_FLAGS_CSS);
   source->SetDefaultResource(IDR_FLAGS_UI_FLAGS_HTML);
@@ -207,3 +205,30 @@ FlagsUI::FlagsUI(web::WebUIIOS* web_ui)
 }
 
 FlagsUI::~FlagsUI() {}
+
+// static
+void FlagsUI::AddFlagsIOSStrings(web::WebUIIOSDataSource* source) {
+  // Strings added here are all marked a non-translatable, so they are not
+  // actually localized.
+  source->AddLocalizedString(flags_ui::kFlagsRestartNotice,
+                             IDS_FLAGS_UI_RELAUNCH_NOTICE);
+  source->AddLocalizedString("available", IDS_FLAGS_UI_AVAILABLE_FEATURE);
+  source->AddLocalizedString("clear-search", IDS_FLAGS_UI_CLEAR_SEARCH);
+  source->AddLocalizedString("disabled", IDS_FLAGS_UI_DISABLED_FEATURE);
+  source->AddLocalizedString("enabled", IDS_FLAGS_UI_ENABLED_FEATURE);
+  source->AddLocalizedString("experiment-enabled",
+                             IDS_FLAGS_UI_EXPERIMENT_ENABLED);
+  source->AddLocalizedString("no-results", IDS_FLAGS_UI_NO_RESULTS);
+  source->AddLocalizedString("not-available-platform",
+                             IDS_FLAGS_UI_NOT_AVAILABLE_ON_PLATFORM);
+  source->AddLocalizedString("page-warning", IDS_FLAGS_UI_PAGE_WARNING);
+  source->AddLocalizedString("page-warning-explanation",
+                             IDS_FLAGS_UI_PAGE_WARNING_EXPLANATION);
+  source->AddLocalizedString("relaunch", IDS_FLAGS_UI_RELAUNCH);
+  source->AddLocalizedString("reset", IDS_FLAGS_UI_PAGE_RESET);
+  source->AddLocalizedString("reset-complete", IDS_FLAGS_UI_RESET_COMPLETE);
+  source->AddLocalizedString("search-placeholder",
+                             IDS_FLAGS_UI_SEARCH_PLACEHOLDER);
+  source->AddLocalizedString("title", IDS_FLAGS_UI_TITLE);
+  source->AddLocalizedString("unavailable", IDS_FLAGS_UI_UNAVAILABLE_FEATURE);
+}
\ No newline at end of file

ios/chrome/browser/ui/webui/flags_ui.h

@@ -9,10 +9,15 @@
 #include "base/memory/weak_ptr.h"
 #include "ios/web/public/webui/web_ui_ios_controller.h"
 
+namespace web {
+class WebUIIOSDataSource;
+}
+
 class FlagsUI : public web::WebUIIOSController {
  public:
   explicit FlagsUI(web::WebUIIOS* web_ui);
   ~FlagsUI() override;
+  static void AddFlagsIOSStrings(web::WebUIIOSDataSource* source);
 
  private:
   base::WeakPtrFactory<FlagsUI> weak_factory_;