[NTP] Determine shortcut title direction by the first strong character and...

[NTP] Determine shortcut title direction by the first strong character and adjust RTL for edit shortcut dialog fields

Determine text direction using the first strong character instead of
whether the text contains any RTL character.

Also add direction support in the edit shortcut dialog fields

LTR browser:
https://screenshot.googleplex.com/11Z58bTugPV.png
https://screenshot.googleplex.com/ne61RSr24qg.png
https://screenshot.googleplex.com/fr28i5Zzceh.png

RTL browser:
https://screenshot.googleplex.com/ZEGVSdiOsTS.png
https://screenshot.googleplex.com/cNtF8s6htp9.png
https://screenshot.googleplex.com/RHoZu97GL8y.png

Bug: 910385
Change-Id: I842c1479e3a3003e218d58d5ccfa511fdddc4963
Reviewed-on: https://chromium-review.googlesource.com/c/1357637
Commit-Queue: Kristi Park <kristipark@chromium.org>
Reviewed-by: Ramya Nagarajan <ramyan@chromium.org>
Cr-Commit-Position: refs/heads/master@{#613283}

chrome/browser/resources/local_ntp/custom_links_edit.css

@@ -72,6 +72,10 @@ input {
   width: calc(100% - 16px);
 }
 
+html[dir=rtl] input {
+  text-align: right;
+}
+
 input::placeholder {
   color: rgba(32, 33, 36, 0.38);
 }
@@ -95,6 +99,10 @@ input:focus + .underline {
   width: 100%;
 }
 
+#url-field {
+  direction: ltr;
+}
+
 .field-title.focused {
   color: rgb(26, 115, 232);
 }

chrome/browser/resources/local_ntp/custom_links_edit.js

@@ -100,6 +100,7 @@ function prepopulateFields(rid) {
     return;
   prepopulatedLink.rid = rid;
   $(IDS.TITLE_FIELD).value = prepopulatedLink.title = data.title;
+  $(IDS.TITLE_FIELD).style.direction = data.direction || 'ltr';
   $(IDS.URL_FIELD).value = prepopulatedLink.url = data.url;
 
   // Set accessibility names.
@@ -175,6 +176,7 @@ function closeDialog() {
   // Small delay to allow the dialog to close before cleaning up.
   window.setTimeout(() => {
     $(IDS.FORM).reset();
+    $(IDS.TITLE_FIELD).style.direction = null;
     $(IDS.URL_FIELD_CONTAINER).classList.remove('invalid');
     $(IDS.DELETE).disabled = false;
     $(IDS.DONE).disabled = false;

chrome/renderer/searchbox/searchbox_extension.cc

@@ -151,10 +151,12 @@ v8::Local<v8::Object> GenerateMostVisitedItemData(
   // title will be rendered as "!Yahoo" if its "dir" attribute is not set to
   // "ltr".
   const char* direction;
-  if (base::i18n::StringContainsStrongRTLChars(mv_item.title))
+  if (base::i18n::GetFirstStrongCharacterDirection(mv_item.title) ==
+      base::i18n::RIGHT_TO_LEFT) {
     direction = kRTLHtmlTextDirection;
-  else
+  } else {
     direction = kLTRHtmlTextDirection;
+  }
 
   std::string title = base::UTF16ToUTF8(mv_item.title);
   if (title.empty())