1 files changed, 109 insertions, 0 deletions
diff --git a/editor/libeditor/tests/test_resizers_appearance.html b/editor/libeditor/tests/test_resizers_appearance.html
new file mode 100644
index 0000000000..e09c80f530
--- /dev/null
+++ b/editor/libeditor/tests/test_resizers_appearance.html
@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Test for resizers appearance</title>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+</head>
+<body>
+<p id="display"></p>
+<div id="content" style="display: none;">
+
+</div>
+
+<div id="editor" contenteditable></div>
+<div id="clickaway" style="width: 3px; height: 3px;"></div>
+<img src="green.png"><!-- for ensuring to load the image at first test of <img> case -->
+<pre id="test">
+
+<script class="testbody" type="application/javascript">
+"use strict";
+
+SimpleTest.waitForExplicitFinish();
+SimpleTest.waitForFocus(async function() {
+  async function waitForSelectionChange() {
+    return new Promise(resolve => {
+      document.addEventListener("selectionchange", () => {
+        resolve();
+      }, {once: true});
+    });
+  }
+
+  let editor = document.getElementById("editor");
+  let outOfEditor = document.getElementById("clickaway");
+
+  const kTests = [
+    { description: "<img>",
+      innerHTML: "<img id=\"target\" src=\"green.png\" width=\"100\" height=\"100\">",
+      resizable: true,
+    },
+    { description: "<table>",
+      innerHTML: "<table id=\"target\" border><tr><td>1-1</td><td>1-2</td></tr><tr><td>2-1</td><td>2-2</td></tr></table>",
+      resizable: true,
+    },
+    { description: "absolute positioned <div>",
+      innerHTML: "<div id=\"target\" style=\"position: absolute; top: 50px; left: 50px;\">positioned</div>",
+      resizable() { return document.queryCommandState("enableAbsolutePositionEditing"); },
+    },
+    { description: "fixed positioned <div>",
+      innerHTML: "<div id=\"target\" style=\"position: fixed; top: 50px; left: 50px;\">positioned</div>",
+      resizable: false,
+    },
+    { description: "relative positioned <div>",
+      innerHTML: "<div id=\"target\" style=\"position: relative; top: 50px; left: 50px;\">positioned</div>",
+      resizable: false,
+    },
+  ];
+
+  for (let kEnableAbsolutePositionEditor of [true, false]) {
+    document.execCommand("enableAbsolutePositionEditing", false, kEnableAbsolutePositionEditor);
+    for (const kTest of kTests) {
+      const kDescription = kTest.description +
+        (kEnableAbsolutePositionEditor ? " (enabled absolute position editor)" : "") + ": ";
+      editor.innerHTML = kTest.innerHTML;
+      let target = document.getElementById("target");
+
+      document.execCommand("enableObjectResizing", false, false);
+      ok(!document.queryCommandState("enableObjectResizing"),
+         kDescription + "Object resizer should be disabled by the call of execCommand");
+
+      synthesizeMouseAtCenter(outOfEditor, {});
+      let promiseSelectionChangeEvent1 = waitForSelectionChange();
+      synthesizeMouseAtCenter(target, {});
+      await promiseSelectionChangeEvent1;
+
+      ok(!target.hasAttribute("_moz_resizing"),
+         kDescription + ": While enableObjectResizing is disabled, resizers shouldn't appear");
+
+      document.execCommand("enableObjectResizing", false, true);
+      ok(document.queryCommandState("enableObjectResizing"),
+         kDescription + "Object resizer should be enabled by the call of execCommand");
+
+      synthesizeMouseAtCenter(outOfEditor, {});
+      let promiseSelectionChangeEvent2 = waitForSelectionChange();
+      synthesizeMouseAtCenter(target, {});
+      await promiseSelectionChangeEvent2;
+
+      const kResizable = typeof kTest.resizable === "function" ? kTest.resizable() : kTest.resizable;
+      is(target.hasAttribute("_moz_resizing"), kResizable,
+         kDescription + (kResizable ? "While enableObjectResizing is enabled, resizers should appear" :
+                                      "Even while enableObjectResizing is enabled, resizers shouldn't appear"));
+
+      document.execCommand("enableObjectResizing", false, false);
+      ok(!target.hasAttribute("_moz_resizing"),
+         kDescription + "enableObjectResizing is disabled even while resizers are visible, resizers should disappear");
+
+      document.execCommand("enableObjectResizing", false, true);
+      is(target.hasAttribute("_moz_resizing"), kResizable,
+         kDescription + (kResizable ? "enableObjectResizing is enabled when resizable object is selected, resizers should appear" :
+                                      "Even if enableObjectResizing is enabled when non-resizable object is selected, resizers shouldn't appear"));
+    }
+  }
+
+  SimpleTest.finish();
+});
+</script>
+</pre>
+</body>
+</html>