1 files changed, 44 insertions, 0 deletions
diff --git a/toolkit/components/satchel/test/test_popup_direction.html b/toolkit/components/satchel/test/test_popup_direction.html
new file mode 100644
index 0000000000..6b2fa010d6
--- /dev/null
+++ b/toolkit/components/satchel/test/test_popup_direction.html
@@ -0,0 +1,44 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title>Test for Popup Direction</title>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <script type="text/javascript" src="satchel_common.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+</head>
+<body>
+Test for Popup Direction
+<p id="display"></p>
+
+<!-- we presumably can't hide the content for this test. -->
+<div id="content">
+  <!-- normal, basic form -->
+  <form id="form1" onsubmit="return false;">
+    <input  type="text" name="field1">
+    <button type="submit">Submit</button>
+  </form>
+</div>
+
+<script>
+
+add_setup(async () => {
+  await updateFormHistory([
+    { op: "remove" },
+    { op: "add", fieldname: "field1", value: "value1" },
+    { op: "add", fieldname: "field1", value: "value2" },
+  ]);
+});
+
+add_task(async function test_popup_direction() {
+  for (const direction of ["ltr", "rtl"]) {
+    document.getElementById("content").style.direction = direction;
+    await openPopupOn("#form1 > input");
+    const popupState = await getPopupState();
+    is(popupState.direction, direction, "Direction should match.");
+  }
+});
+
+</script>
+</body>
+</html>