From 2aa4a82499d4becd2284cdb482213d541b8804dd Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Sun, 28 Apr 2024 16:29:10 +0200
Subject: Adding upstream version 86.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../reftests/forms/input/file/background-ref.xhtml | 16 ++++++
 layout/reftests/forms/input/file/background.html   | 11 ++++
 .../forms/input/file/button-height-ref.html        |  6 ++
 .../reftests/forms/input/file/button-height.html   |  6 ++
 .../forms/input/file/color-inherit-ref.html        |  6 ++
 .../reftests/forms/input/file/color-inherit.html   |  6 ++
 .../reftests/forms/input/file/css-display-ref.html | 54 ++++++++++++++++++
 layout/reftests/forms/input/file/css-display.html  | 64 ++++++++++++++++++++++
 .../forms/input/file/css-overflow-ref.html         | 39 +++++++++++++
 layout/reftests/forms/input/file/css-overflow.html | 46 ++++++++++++++++
 .../forms/input/file/dynamic-max-width-ref.html    | 20 +++++++
 .../forms/input/file/dynamic-max-width.html        | 34 ++++++++++++
 .../input/file/label-min-inline-size-ref.html      | 23 ++++++++
 .../forms/input/file/label-min-inline-size.html    | 44 +++++++++++++++
 layout/reftests/forms/input/file/reftest.list      | 12 ++++
 layout/reftests/forms/input/file/rtl-ref.xhtml     | 17 ++++++
 layout/reftests/forms/input/file/rtl.html          |  8 +++
 layout/reftests/forms/input/file/simple-ref.xhtml  | 14 +++++
 layout/reftests/forms/input/file/simple.html       |  8 +++
 layout/reftests/forms/input/file/size.html         |  9 +++
 layout/reftests/forms/input/file/style-ref.xhtml   | 25 +++++++++
 layout/reftests/forms/input/file/style.css         | 61 +++++++++++++++++++++
 layout/reftests/forms/input/file/style.html        | 16 ++++++
 .../reftests/forms/input/file/width-clip-ref.html  |  3 +
 layout/reftests/forms/input/file/width-clip.html   |  3 +
 25 files changed, 551 insertions(+)
 create mode 100644 layout/reftests/forms/input/file/background-ref.xhtml
 create mode 100644 layout/reftests/forms/input/file/background.html
 create mode 100644 layout/reftests/forms/input/file/button-height-ref.html
 create mode 100644 layout/reftests/forms/input/file/button-height.html
 create mode 100644 layout/reftests/forms/input/file/color-inherit-ref.html
 create mode 100644 layout/reftests/forms/input/file/color-inherit.html
 create mode 100644 layout/reftests/forms/input/file/css-display-ref.html
 create mode 100644 layout/reftests/forms/input/file/css-display.html
 create mode 100644 layout/reftests/forms/input/file/css-overflow-ref.html
 create mode 100644 layout/reftests/forms/input/file/css-overflow.html
 create mode 100644 layout/reftests/forms/input/file/dynamic-max-width-ref.html
 create mode 100644 layout/reftests/forms/input/file/dynamic-max-width.html
 create mode 100644 layout/reftests/forms/input/file/label-min-inline-size-ref.html
 create mode 100644 layout/reftests/forms/input/file/label-min-inline-size.html
 create mode 100644 layout/reftests/forms/input/file/reftest.list
 create mode 100644 layout/reftests/forms/input/file/rtl-ref.xhtml
 create mode 100644 layout/reftests/forms/input/file/rtl.html
 create mode 100644 layout/reftests/forms/input/file/simple-ref.xhtml
 create mode 100644 layout/reftests/forms/input/file/simple.html
 create mode 100644 layout/reftests/forms/input/file/size.html
 create mode 100644 layout/reftests/forms/input/file/style-ref.xhtml
 create mode 100644 layout/reftests/forms/input/file/style.css
 create mode 100644 layout/reftests/forms/input/file/style.html
 create mode 100644 layout/reftests/forms/input/file/width-clip-ref.html
 create mode 100644 layout/reftests/forms/input/file/width-clip.html

(limited to 'layout/reftests/forms/input/file')

diff --git a/layout/reftests/forms/input/file/background-ref.xhtml b/layout/reftests/forms/input/file/background-ref.xhtml
new file mode 100644
index 0000000000..cf5b0c5e48
--- /dev/null
+++ b/layout/reftests/forms/input/file/background-ref.xhtml
@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="style.css" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml">
+  <html:style>
+    window {
+      background-color: blue;
+    }
+  </html:style>
+
+  <vbox>
+    <html:div class='file'>
+      <html:button>Browse&#8230;</html:button><label value="No file selected."/>
+    </html:div>
+  </vbox>
+</window>
diff --git a/layout/reftests/forms/input/file/background.html b/layout/reftests/forms/input/file/background.html
new file mode 100644
index 0000000000..02af1d143d
--- /dev/null
+++ b/layout/reftests/forms/input/file/background.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+  <style>
+    body {
+      background-color: blue;
+    }
+  </style>
+  <body>
+    <input type='file'>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/button-height-ref.html b/layout/reftests/forms/input/file/button-height-ref.html
new file mode 100644
index 0000000000..a80d261cf8
--- /dev/null
+++ b/layout/reftests/forms/input/file/button-height-ref.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<style>
+  /* Android adds a border for some reason */
+  input { border: 0 }
+</style>
+<input type="file">
diff --git a/layout/reftests/forms/input/file/button-height.html b/layout/reftests/forms/input/file/button-height.html
new file mode 100644
index 0000000000..b1094ad783
--- /dev/null
+++ b/layout/reftests/forms/input/file/button-height.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<style>
+  /* Android adds a border for some reason */
+  input { border: 0 }
+</style>
+<input type="file" style="height: 400px">
diff --git a/layout/reftests/forms/input/file/color-inherit-ref.html b/layout/reftests/forms/input/file/color-inherit-ref.html
new file mode 100644
index 0000000000..39cd471a56
--- /dev/null
+++ b/layout/reftests/forms/input/file/color-inherit-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+  <body>
+    <input type='file' style='color: chartreuse;'>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/color-inherit.html b/layout/reftests/forms/input/file/color-inherit.html
new file mode 100644
index 0000000000..8435329537
--- /dev/null
+++ b/layout/reftests/forms/input/file/color-inherit.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+  <body style='color: chartreuse;'>
+    <input type='file'>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/css-display-ref.html b/layout/reftests/forms/input/file/css-display-ref.html
new file mode 100644
index 0000000000..875362bddf
--- /dev/null
+++ b/layout/reftests/forms/input/file/css-display-ref.html
@@ -0,0 +1,54 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Reference: File input with CSS display</title>
+<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
+<style>
+input {
+  height: 3em;
+}
+.grid  { display: block; }
+.flex  { display: block; }
+.block { display: block; }
+.table { display: block; }
+.columns { display: block; }
+.n { -webkit-appearance:none; appearance:none; }
+</style>
+<body>
+  <input type="file" class="grid">
+  <input type="file" class="flex">
+  <input type="file" class="block">
+  <input type="file" class="table">
+  <input type="file" class="columns">
+
+  A<input type="file">
+  <input type="file" class="inline">
+  <input type="file" class="inline-grid">
+  <input type="file" class="inline-flex">
+  <input type="file" class="inline-block">
+  <input type="file" class="inline-table">
+  <input type="file" class="inline-columns">
+
+  A<input disabled type="file">
+  <input disabled type="file" class="inline">
+  <input disabled type="file" class="inline-grid">
+  <input disabled type="file" class="inline-flex">
+  <input disabled type="file" class="inline-block">
+  <input disabled type="file" class="inline-table">
+  <input disabled type="file" class="inline-columns">
+
+  A<input type="file" class="n">
+  <input type="file" class="n inline">
+  <input type="file" class="n inline-grid">
+  <input type="file" class="n inline-flex">
+  <input type="file" class="n inline-block">
+  <input type="file" class="n inline-table">
+  <input type="file" class="n inline-columns">
+
+  A<input disabled type="file" class="n">
+  <input disabled type="file" class="n inline">
+  <input disabled type="file" class="n inline-grid">
+  <input disabled type="file" class="n inline-flex">
+  <input disabled type="file" class="n inline-block">
+  <input disabled type="file" class="n inline-table">
+  <input disabled type="file" class="n inline-columns">
+</body>
diff --git a/layout/reftests/forms/input/file/css-display.html b/layout/reftests/forms/input/file/css-display.html
new file mode 100644
index 0000000000..aba7435015
--- /dev/null
+++ b/layout/reftests/forms/input/file/css-display.html
@@ -0,0 +1,64 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Test: File input with CSS display</title>
+<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/rendering.html#widgets">
+<link rel="help" href="https://github.com/whatwg/html/issues/4082">
+<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#propdef-overflow">
+<link rel="match" href="css-overflow-ref.html">
+<style>
+input {
+  height: 3em;
+}
+.inline       { display: inline }
+.inline-grid  { display: inline-grid; grid: 500px/500px; align-items: end; }
+.inline-flex  { display: inline-flex; flex-flow: column; align-items: end; }
+.inline-block { display: inline-block }
+.inline-table { display: inline-table }
+.inline-columns { display: inline-block; column-width: 500px; column-rule: 10px solid; }
+.grid  { display: grid; grid: 500px/500px; align-items: end; }
+.flex  { display: flex; flex-flow: column; align-items: end; }
+.block { display: block }
+.table { display: table }
+.columns { display: block; column-width: 500px; column-rule: 10px solid; }
+.n { -webkit-appearance:none; appearance:none; }
+</style>
+<body>
+  <input type="file" class="grid">
+  <input type="file" class="flex">
+  <input type="file" class="block">
+  <input type="file" class="table">
+  <input type="file" class="columns">
+
+  A<input type="file">
+  <input type="file" class="inline">
+  <input type="file" class="inline-grid">
+  <input type="file" class="inline-flex">
+  <input type="file" class="inline-block">
+  <input type="file" class="inline-table">
+  <input type="file" class="inline-columns">
+
+  A<input disabled type="file">
+  <input disabled type="file" class="inline">
+  <input disabled type="file" class="inline-grid">
+  <input disabled type="file" class="inline-flex">
+  <input disabled type="file" class="inline-block">
+  <input disabled type="file" class="inline-table">
+  <input disabled type="file" class="inline-columns">
+
+  A<input type="file" class="n">
+  <input type="file" class="n inline">
+  <input type="file" class="n inline-grid">
+  <input type="file" class="n inline-flex">
+  <input type="file" class="n inline-block">
+  <input type="file" class="n inline-table">
+  <input type="file" class="n inline-columns">
+
+  A<input disabled type="file" class="n">
+  <input disabled type="file" class="n inline">
+  <input disabled type="file" class="n inline-grid">
+  <input disabled type="file" class="n inline-flex">
+  <input disabled type="file" class="n inline-block">
+  <input disabled type="file" class="n inline-table">
+  <input disabled type="file" class="n inline-columns">
+</body>
diff --git a/layout/reftests/forms/input/file/css-overflow-ref.html b/layout/reftests/forms/input/file/css-overflow-ref.html
new file mode 100644
index 0000000000..a3f696fcf2
--- /dev/null
+++ b/layout/reftests/forms/input/file/css-overflow-ref.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Reference: File input with CSS overflow</title>
+<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
+<style>
+input {
+  display: inline-block;
+  width: 100px;
+  height: 30px;
+  font-size: 48px;
+  overflow: visible;
+}
+.n { -webkit-appearance:none; appearance:none; }
+</style>
+<body>
+  A<input type="file">
+  <input type="file" class="ov">
+  <input type="file" class="oh">
+  <input type="file" class="os">
+  <input type="file" class="oa">
+
+  A<input disabled type="file">
+  <input disabled type="file" class="ov">
+  <input disabled type="file" class="oh">
+  <input disabled type="file" class="os">
+  <input disabled type="file" class="oa">
+
+  A<input type="file" class="n">
+  <input type="file" class="n ov">
+  <input type="file" class="n oh">
+  <input type="file" class="n os">
+  <input type="file" class="n oa">
+
+  A<input disabled type="file" class="n">
+  <input disabled type="file" class="n ov">
+  <input disabled type="file" class="n oh">
+  <input disabled type="file" class="n os">
+  <input disabled type="file" class="n oa">
+</body>
diff --git a/layout/reftests/forms/input/file/css-overflow.html b/layout/reftests/forms/input/file/css-overflow.html
new file mode 100644
index 0000000000..dd3fb08bf5
--- /dev/null
+++ b/layout/reftests/forms/input/file/css-overflow.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Test: File input with CSS overflow</title>
+<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/rendering.html#widgets">
+<link rel="help" href="https://github.com/whatwg/html/issues/4082">
+<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#propdef-overflow">
+<link rel="match" href="css-overflow-ref.html">
+<style>
+input {
+  display: inline-block;
+  width: 100px;
+  height: 30px;
+  font-size: 48px;
+}
+.ov { overflow: visible; }
+.oh { overflow: hidden; }
+.os { overflow: scroll; }
+.oa { overflow: auto; }
+.n { -webkit-appearance:none; appearance:none; }
+</style>
+<body>
+  A<input type="file">
+  <input type="file" class="ov">
+  <input type="file" class="oh">
+  <input type="file" class="os">
+  <input type="file" class="oa">
+
+  A<input disabled type="file">
+  <input disabled type="file" class="ov">
+  <input disabled type="file" class="oh">
+  <input disabled type="file" class="os">
+  <input disabled type="file" class="oa">
+
+  A<input type="file" class="n">
+  <input type="file" class="n ov">
+  <input type="file" class="n oh">
+  <input type="file" class="n os">
+  <input type="file" class="n oa">
+
+  A<input disabled type="file" class="n">
+  <input disabled type="file" class="n ov">
+  <input disabled type="file" class="n oh">
+  <input disabled type="file" class="n os">
+  <input disabled type="file" class="n oa">
+</body>
diff --git a/layout/reftests/forms/input/file/dynamic-max-width-ref.html b/layout/reftests/forms/input/file/dynamic-max-width-ref.html
new file mode 100644
index 0000000000..1628c5fa30
--- /dev/null
+++ b/layout/reftests/forms/input/file/dynamic-max-width-ref.html
@@ -0,0 +1,20 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>Reference for dynamic-max-width.html</title>
+</head>
+<body>
+
+<input type=file dir=rtl>
+
+<br>
+
+<input type=file>
+
+
+</body>
+</html>
diff --git a/layout/reftests/forms/input/file/dynamic-max-width.html b/layout/reftests/forms/input/file/dynamic-max-width.html
new file mode 100644
index 0000000000..1cad23c169
--- /dev/null
+++ b/layout/reftests/forms/input/file/dynamic-max-width.html
@@ -0,0 +1,34 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html class="reftest-wait"><head>
+  <meta charset="utf-8">
+  <title>CSS Test: file control with dynamic change to max-width</title>
+  <style type="text/css">
+
+    input { max-width: 10em; }
+
+  </style>
+  <script>
+    function tweak() {
+      [...document.querySelectorAll('input')].forEach(function(e) {
+        e.style.maxWidth = 'initial';
+      });
+      document.documentElement.removeAttribute("class");
+    }
+    window.addEventListener("MozReftestInvalidate", tweak);
+  </script>
+</head>
+<body onload="test()">
+
+<input type=file dir=rtl>
+
+<br>
+
+<input type=file>
+
+
+</body>
+</html>
diff --git a/layout/reftests/forms/input/file/label-min-inline-size-ref.html b/layout/reftests/forms/input/file/label-min-inline-size-ref.html
new file mode 100644
index 0000000000..6e8e1287c3
--- /dev/null
+++ b/layout/reftests/forms/input/file/label-min-inline-size-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>Testcase for bug 1500530</title>
+  <style type="text/css">
+html,body {
+  color:black; background-color:black; font:48pt/1 Arial; padding:0; margin:0;
+}
+
+div { width: 100px; height: 20px; margin-top: -2px; background: lime; }
+
+  </style>
+</head>
+<body>
+
+<div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/input/file/label-min-inline-size.html b/layout/reftests/forms/input/file/label-min-inline-size.html
new file mode 100644
index 0000000000..3c97476211
--- /dev/null
+++ b/layout/reftests/forms/input/file/label-min-inline-size.html
@@ -0,0 +1,44 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>Testcase for bug 1500530</title>
+  <style type="text/css">
+html,body {
+  color:black; background-color:white; font:48pt/1 Arial; padding:0; margin:0;
+}
+
+input {
+  font-family: Arial;
+  font-size: 48pt;
+  vertical-align: top;
+  background: lime;
+}
+div { text-indent: -24ch; margin-top: -2px; }
+
+mask {
+  position: absolute;
+  left: 100px; right: 0; top: 0; bottom: 0;
+  background: black;
+}
+
+mask2 {
+  position: absolute;
+  left: 0; right: 0; top: 18px; bottom: 0;
+  background: black;
+}
+
+  </style>
+</head>
+<body>
+
+<mask></mask>
+<mask2></mask2>
+<div><input type="file"></div>
+
+
+</body>
+</html>
diff --git a/layout/reftests/forms/input/file/reftest.list b/layout/reftests/forms/input/file/reftest.list
new file mode 100644
index 0000000000..193017a364
--- /dev/null
+++ b/layout/reftests/forms/input/file/reftest.list
@@ -0,0 +1,12 @@
+fuzzy-if(gtkWidget||webrender,0-1,0-34) == simple.html chrome://reftest/content/forms/input/file/simple-ref.xhtml
+fuzzy-if(gtkWidget||webrender,0-1,0-17) == rtl.html chrome://reftest/content/forms/input/file/rtl-ref.xhtml
+fuzzy-if(gtkWidget||webrender,0-1,0-34) == size.html chrome://reftest/content/forms/input/file/simple-ref.xhtml
+fuzzy-if(gtkWidget||webrender,0-1,0-10) == background.html chrome://reftest/content/forms/input/file/background-ref.xhtml
+fuzzy-if(gtkWidget,0-1,0-10) == style.html chrome://reftest/content/forms/input/file/style-ref.xhtml
+!= width-clip.html width-clip-ref.html
+== color-inherit.html color-inherit-ref.html
+fuzzy-if(Android,0-2,0-2) fuzzy-if(OSX,0-34,0-134) fails-if(webrender&&!(cocoaWidget||geckoview)) == dynamic-max-width.html dynamic-max-width-ref.html # bug 1496542 for webrender.
+== label-min-inline-size.html label-min-inline-size-ref.html
+== css-overflow.html css-overflow-ref.html
+== css-display.html css-display-ref.html
+== button-height.html button-height-ref.html
diff --git a/layout/reftests/forms/input/file/rtl-ref.xhtml b/layout/reftests/forms/input/file/rtl-ref.xhtml
new file mode 100644
index 0000000000..eb61d45c74
--- /dev/null
+++ b/layout/reftests/forms/input/file/rtl-ref.xhtml
@@ -0,0 +1,17 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="style.css" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml">
+  <vbox>
+    <html:style>
+      vbox {
+       margin-right: 8px;
+      }
+    </html:style>
+    <html:div dir='rtl'>
+      <html:div class='file' dir='rtl'>
+        <html:button>Browse&#8230;</html:button><label value="No file selected."/>
+      </html:div>
+    </html:div>
+  </vbox>
+</window>
diff --git a/layout/reftests/forms/input/file/rtl.html b/layout/reftests/forms/input/file/rtl.html
new file mode 100644
index 0000000000..81e841a124
--- /dev/null
+++ b/layout/reftests/forms/input/file/rtl.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+  <body>
+    <div dir='rtl'>
+      <input type='file'>
+    </div>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/simple-ref.xhtml b/layout/reftests/forms/input/file/simple-ref.xhtml
new file mode 100644
index 0000000000..a9bc3cbd94
--- /dev/null
+++ b/layout/reftests/forms/input/file/simple-ref.xhtml
@@ -0,0 +1,14 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="style.css" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml">
+  <vbox>
+    <html:div class='file'>
+      <html:button>Browse&#8230;</html:button><label value="No file selected."/>
+    </html:div>
+    <html:br/>
+    <html:div class='file'>
+      <html:button>Browse&#8230;</html:button><label value="No files selected."/>
+    </html:div>
+  </vbox>
+</window>
diff --git a/layout/reftests/forms/input/file/simple.html b/layout/reftests/forms/input/file/simple.html
new file mode 100644
index 0000000000..03a2a7bde5
--- /dev/null
+++ b/layout/reftests/forms/input/file/simple.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+  <body>
+    <input type='file'>
+    <br>
+    <input type='file' multiple>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/size.html b/layout/reftests/forms/input/file/size.html
new file mode 100644
index 0000000000..33606f935d
--- /dev/null
+++ b/layout/reftests/forms/input/file/size.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<!-- size should have no impact on <input type='file'>. -->
+<html>
+  <body>
+    <input type='file' size='5'>
+    <br>
+    <input type='file' multiple size='30'>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/style-ref.xhtml b/layout/reftests/forms/input/file/style-ref.xhtml
new file mode 100644
index 0000000000..20af35b487
--- /dev/null
+++ b/layout/reftests/forms/input/file/style-ref.xhtml
@@ -0,0 +1,25 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="style.css" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml">
+  <hbox>
+    <html:style>
+      .file {
+        background-color: blue;
+        border: 1px red solid;
+        width: 400px;
+        padding: 2px;
+        margin: 5px;
+        display: inline-block;
+      }
+
+      .file > label {
+        /* color only applies to the label */
+        color: white;
+      }
+    </html:style>
+    <html:div class='file'>
+      <html:button>Browse&#8230;</html:button><label value="No file selected."/>
+    </html:div>
+  </hbox>
+</window>
diff --git a/layout/reftests/forms/input/file/style.css b/layout/reftests/forms/input/file/style.css
new file mode 100644
index 0000000000..5a7c22b251
--- /dev/null
+++ b/layout/reftests/forms/input/file/style.css
@@ -0,0 +1,61 @@
+vbox, hbox {
+  margin-top: 8px;
+  margin-left: 8px;
+  display: block;
+}
+
+.file {
+  /* Copy of input properties that apply of forms.css below this */
+  color: inherit;
+  font: -moz-field;
+  text-rendering: optimizeLegibility;
+  line-height: normal !important;
+  text-align: start;
+  text-transform: none;
+  word-spacing: normal;
+  letter-spacing: normal;
+  text-indent: 0;
+  user-select: text;
+  text-shadow: none;
+
+  /* Copy of the type=file part of forms.css below this */
+  display: inline; /* this one isn't really a copy... */
+  white-space: nowrap;
+  overflow:hidden;
+
+  -moz-appearance: none;
+  -moz-binding: none;
+  cursor: default;
+  border: none;
+  background-color: transparent;
+  padding: 0;
+}
+
+.file > label {
+  display: inline-block;
+
+  /* Copy from forms.css below this */
+  min-width: 12em;
+  padding-inline-start: 5px;
+
+  color: inherit;
+  font-size: inherit;
+  letter-spacing: inherit;
+
+  direction: ltr !important;
+}
+
+.file[dir='rtl'] > label {
+  /* Copy from forms.css below this */
+  padding-inline-start: 0px;
+  padding-right: 5px;
+  text-align: right;
+}
+
+.file > button {
+  /* Copy from forms.css below this */
+  height: inherit;
+  font-size: inherit;
+  letter-spacing: inherit;
+  cursor: inherit;
+}
diff --git a/layout/reftests/forms/input/file/style.html b/layout/reftests/forms/input/file/style.html
new file mode 100644
index 0000000000..76fa4d971d
--- /dev/null
+++ b/layout/reftests/forms/input/file/style.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+  <style>
+    input {
+      background-color: blue;
+      border: 1px red solid;
+      width: 400px;
+      color: white;
+      padding: 2px;
+      margin: 5px;
+    }
+  </style>
+  <body>
+    <input type='file'>
+  </body>
+</html>
diff --git a/layout/reftests/forms/input/file/width-clip-ref.html b/layout/reftests/forms/input/file/width-clip-ref.html
new file mode 100644
index 0000000000..a6c746ac8d
--- /dev/null
+++ b/layout/reftests/forms/input/file/width-clip-ref.html
@@ -0,0 +1,3 @@
+<div style="width: 5px;"><input type="file"></div>
+<div style="width: 500px;"><input type="file"></div>
+
diff --git a/layout/reftests/forms/input/file/width-clip.html b/layout/reftests/forms/input/file/width-clip.html
new file mode 100644
index 0000000000..d4acd7e27f
--- /dev/null
+++ b/layout/reftests/forms/input/file/width-clip.html
@@ -0,0 +1,3 @@
+<div><input type="file" style="width: 5px"></div>
+<div><input type="file" style="width: 500px"></div>
+
-- 
cgit v1.2.3