editor/libeditor/tests/test_native_key_bindings_in_shadow.html

   1 <!doctype html>
   2 <html>
   3 <head>
   4 <meta charset="utf-8">
   5 <title>Check whether native key bindings work in shadow DOM in editor</title>
   6 <script src="/tests/SimpleTest/SimpleTest.js"></script>
   7 <script src="/tests/SimpleTest/EventUtils.js"></script>
   8 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
   9 <script>
  10 "use strict";
  11
  12 const kIsMac = navigator.platform.includes("Mac");
  13
  14 SimpleTest.waitForExplicitFinish();
  15 SimpleTest.waitForFocus(() => {
  16   const shadowHost = document.querySelector("div");
  17   const shadowRoot = shadowHost.attachShadow({mode: "open"});
  18   shadowRoot.innerHTML = "<div contenteditable>abc def</div>";
  19   const editingHost = shadowRoot.querySelector("div[contenteditable]");
  20   editingHost.focus();
  21   getSelection().collapse(editingHost.firstChild, "abc ".length);
  22   if (kIsMac) {
  23     synthesizeKey("KEY_ArrowLeft", {metaKey: true});
  24   } else {
  25     synthesizeKey("KEY_Home");
  26   }
  27   synthesizeKey("X", {shiftKey: true});
  28   is(
  29     editingHost.textContent,
  30     "Xabc def",
  31     "X should've insert start of the editing host after typing \"Home\""
  32   );
  33   if (kIsMac) {
  34     synthesizeKey("KEY_ArrowRight", {metaKey: true});
  35   } else {
  36     synthesizeKey("KEY_End");
  37   }
  38   synthesizeKey("Y", {shiftKey: true});
  39   is(
  40     editingHost.textContent,
  41     "Xabc defY",
  42     "Y should've been inserted end of the editing host after typing \"End\""
  43   );
  44
  45   SimpleTest.finish();
  46 });
  47 </script>
  48 </head>
  49 <body><div></div></body>
  50 </html>