From c6843aa82af2b5c8918161fe5b0cad8ad33cb8fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= <emilio@crisal.io>
Date: Thu, 13 Jun 2024 12:39:45 +0000
Subject: [PATCH] Bug 1896901 - Don't use an <input> for unknown content type
 file. r=dao,desktop-theme-reviewers a=RyanVM

This happens because the input minimum size doesn't depend on the value
text. There's an experimental CSS property to support something like
this, field-sizing:

  https://developer.mozilla.org/en-US/docs/Web/CSS/field-sizing

Which is tracked on bug 1832409, but which we don't implement yet.

This makes the form minimum size account for the content, while keeping
text selectability. It's not ideal because there's no caret / Ctrl+A
etc, but it's probably an ok trade-off? Alternatively we can wontfix /
make this depend on implementing field-sizing.

Differential Revision: https://phabricator.services.mozilla.com/D210513
---
 toolkit/mozapps/downloads/HelperAppDlg.sys.mjs        |  6 +++---
 .../downloads/content/unknownContentType.xhtml        |  2 +-
 .../themes/shared/downloads/unknownContentType.css    | 11 +++++------
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/toolkit/mozapps/downloads/HelperAppDlg.sys.mjs b/toolkit/mozapps/downloads/HelperAppDlg.sys.mjs
index 01d1a518d8e43..7a5cba641a266 100644
--- a/toolkit/mozapps/downloads/HelperAppDlg.sys.mjs
+++ b/toolkit/mozapps/downloads/HelperAppDlg.sys.mjs
@@ -677,17 +677,17 @@ nsUnknownContentTypeDialog.prototype = {
       }
     }
     // When the length is unknown, contentLength would be -1
+    let value = typeString;
     if (this.mLauncher.contentLength >= 0) {
       let [size, unit] = DownloadUtils.convertByteUnits(
         this.mLauncher.contentLength
       );
-      type.value = this.dialogElement("strings").getFormattedString(
+      value = this.dialogElement("strings").getFormattedString(
         "orderedFileSizeWithType",
         [typeString, size, unit]
       );
-    } else {
-      type.value = typeString;
     }
+    type.textContent = value;
   },
 
   // Returns true if opening the default application makes sense.
diff --git a/toolkit/mozapps/downloads/content/unknownContentType.xhtml b/toolkit/mozapps/downloads/content/unknownContentType.xhtml
index 76d35d2162881..6d1f2b4e5a53b 100644
--- a/toolkit/mozapps/downloads/content/unknownContentType.xhtml
+++ b/toolkit/mozapps/downloads/content/unknownContentType.xhtml
@@ -43,7 +43,7 @@
         <separator class="thin"/>
         <hbox align="center">
           <label id="whichIs" data-l10n-id="unknowncontenttype-which-is"/>
-          <html:input id="type" readonly="readonly" noinitialfocus="true"/>
+          <label id="type" tabindex="0" noinitialfocus="true"/>
         </hbox>
         <hbox align="center">
           <label data-l10n-id="unknowncontenttype-from" id="from"/>
diff --git a/toolkit/themes/shared/downloads/unknownContentType.css b/toolkit/themes/shared/downloads/unknownContentType.css
index 17aec61d945ca..5272ca8fcaca9 100644
--- a/toolkit/themes/shared/downloads/unknownContentType.css
+++ b/toolkit/themes/shared/downloads/unknownContentType.css
@@ -13,14 +13,13 @@
 }
 
 #type {
-  appearance: none;
+  -moz-user-focus: normal;
+  user-select: text;
   flex: 1;
-  background-color: transparent;
-  color: inherit;
-  border: 0;
   margin: 0;
-  padding: 0;
-  outline-offset: 0;
+  &:focus-visible {
+    outline: var(--focus-outline);
+  }
 }
 
 #from {
-- 
GitLab