From 771d50381ec04b5be05616a413c0a6f140c0a511 Mon Sep 17 00:00:00 2001
From: Mats Palmgren <mats@mozilla.com>
Date: Sat, 6 Oct 2018 19:31:51 +0200
Subject: [PATCH] Bug 1495153 part 1 - Replace the XUL label in <input
 type=file> with an HTML label.  r=emilio

---
 layout/forms/nsFileControlFrame.cpp | 17 ++++++-----------
 layout/style/res/forms.css          | 20 ++++----------------
 2 files changed, 10 insertions(+), 27 deletions(-)

diff --git a/layout/forms/nsFileControlFrame.cpp b/layout/forms/nsFileControlFrame.cpp
index 61a77685e19d..6f1b47afa132 100644
--- a/layout/forms/nsFileControlFrame.cpp
+++ b/layout/forms/nsFileControlFrame.cpp
@@ -141,25 +141,19 @@ nsFileControlFrame::CreateAnonymousContent(nsTArray<ContentInfo>& aElements)
   }
 
   // Create and setup the text showing the selected files.
-  RefPtr<NodeInfo> nodeInfo;
-  nodeInfo = doc->NodeInfoManager()->GetNodeInfo(nsGkAtoms::label, nullptr,
-                                                 kNameSpaceID_XUL,
-                                                 nsINode::ELEMENT_NODE);
-  NS_TrustedNewXULElement(getter_AddRefs(mTextContent), nodeInfo.forget());
+  mTextContent = doc->CreateHTMLElement(nsGkAtoms::label);
   // NOTE: SetIsNativeAnonymousRoot() has to be called before setting any
   // attribute.
   mTextContent->SetIsNativeAnonymousRoot();
-  mTextContent->SetAttr(kNameSpaceID_None, nsGkAtoms::crop,
-                        NS_LITERAL_STRING("center"), false);
+  RefPtr<nsTextNode> text = new nsTextNode(doc->NodeInfoManager());
+  mTextContent->AppendChildTo(text, false);
 
   // Update the displayed text to reflect the current element's value.
   nsAutoString value;
   HTMLInputElement::FromNode(mContent)->GetDisplayFileName(value);
   UpdateDisplayedValue(value, false);
 
-  if (!aElements.AppendElement(mTextContent)) {
-    return NS_ERROR_OUT_OF_MEMORY;
-  }
+  aElements.AppendElement(mTextContent);
 
   // We should be able to interact with the element by doing drag and drop.
   mContent->AddSystemEventListener(NS_LITERAL_STRING("drop"),
@@ -475,7 +469,8 @@ nsFileControlFrame::GetFrameName(nsAString& aResult) const
 void
 nsFileControlFrame::UpdateDisplayedValue(const nsAString& aValue, bool aNotify)
 {
-  mTextContent->SetAttr(kNameSpaceID_None, nsGkAtoms::value, aValue, aNotify);
+  auto* text = Text::FromNode(mTextContent->GetFirstChild());
+  text->SetText(aValue, aNotify);
 }
 
 nsresult
diff --git a/layout/style/res/forms.css b/layout/style/res/forms.css
index 70aaf63e9335..abb84ea89c7f 100644
--- a/layout/style/res/forms.css
+++ b/layout/style/res/forms.css
@@ -8,7 +8,6 @@
 
 
 @namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */
-@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
 
 *|*::-moz-fieldset-content {
   display: block; /* StyleAdjuster::adjust_for_fieldset_content overrides this in some cases */
@@ -480,7 +479,7 @@ input[type="image"]:-moz-focusring {
 /* file selector */
 input[type="file"] {
   display: inline-block;
-  white-space: nowrap;
+  white-space: nowrap !important;
   overflow: hidden;
   overflow-clip-box: padding-box;
   color: unset;
@@ -495,7 +494,7 @@ input[type="file"] {
   padding: unset;
 }
 
-input[type="file"] > xul|label {
+input[type="file"] > label {
   min-inline-size: 12em;
   padding-inline-start: 5px;
   text-align: match-parent;
@@ -504,11 +503,8 @@ input[type="file"] > xul|label {
   font-size: unset;
   letter-spacing: unset;
 
-  /*
-   * Force the text to have LTR directionality. Otherwise filenames containing
-   * RTL characters will be reordered with chaotic results.
-   */
-  direction: ltr !important;
+  -moz-user-select: none;
+  unicode-bidi: plaintext;
 }
 
 /* button part of file selector */
@@ -532,14 +528,6 @@ input[type="color"]::-moz-color-swatch {
   display: block;
 }
 
-/* Try to make RTL <input type='file'> look nicer. */
-/* TODO: find a better solution than forcing direction: ltr on all file
-   input labels and remove this override -- bug 1161482 */
-input[type="file"]:dir(rtl) > xul|label {
-  padding-inline-start: 0px;
-  padding-inline-end: 5px;
-}
-
 /* radio buttons */
 input[type="radio"] {
   display: inline-block;