diff --git a/layout/generic/test/mochitest.ini b/layout/generic/test/mochitest.ini
index bde689457ebc..4e4e31936b33 100644
--- a/layout/generic/test/mochitest.ini
+++ b/layout/generic/test/mochitest.ini
@@ -60,7 +60,6 @@ skip-if = true # Bug 489560
 [test_bug503813.html]
 [test_bug507902.html]
 skip-if = true # Bug 510001
-[test_bug527306.html]
 [test_bug579767.html]
 support-files = file_bug579767_1.html file_bug579767_2.html
 [test_bug522632.html]
diff --git a/layout/generic/test/test_bug527306.html b/layout/generic/test/test_bug527306.html
deleted file mode 100644
index 0e10ebb38b4f..000000000000
--- a/layout/generic/test/test_bug527306.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!DOCTYPE HTML>
-<html>
-<!--
-https://bugzilla.mozilla.org/show_bug.cgi?id=527306
--->
-<head>
-  <title>Test for Bug 527306</title>
-  <script src="/tests/SimpleTest/SimpleTest.js"></script>
-  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
-
-</head>
-<body onload="runTests()">
-<p><a target="_blank" href="https://bugzilla.mozilla.org/show_bug?id=527306">Mozilla Bug 527306</a>
-
-<p><input type="text" id="t1" value="FAIL"></p>
-<p><input type="text" id="t2" value="FAIL"></p>
-<p><input type="text" id="t3" value="FAIL"></p>
-<p><textarea id="t4">FAIL</textarea></p>
-
-<pre id="test">
-<script>
-
-function testElement(t) {
-  t.style.display = "none";
-  t.value = "PASS";
-  is(t.value, "PASS", "Value should be set correctly");
-}
-
-function runTests() {
-  var t = document.getElementById("t1");
-  testElement(t);
-  t = document.getElementById("t2");
-  t.focus();
-  testElement(t);
-  t = document.getElementById("t3");
-  t.focus();
-  t.blur();
-  testElement(t);
-  t = document.getElementById("t4");
-  testElement(t);
-  SimpleTest.finish();
-}
-
-SimpleTest.waitForExplicitFinish();
-</script>
-</pre>
-
-</body>
-</html>
diff --git a/testing/web-platform/meta/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html.ini b/testing/web-platform/meta/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html.ini
new file mode 100644
index 000000000000..6b134ef7b94a
--- /dev/null
+++ b/testing/web-platform/meta/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html.ini
@@ -0,0 +1,66 @@
+[edit-in-textcontrol-immediately-after-hidden.tentative.html?editor=textarea&hide-target=editor]
+  [execCommand("insertText", false, "typed value") in <textarea>]
+    expected: FAIL
+
+  [execCommand("delete") in <textarea>]
+    expected: FAIL
+
+  [<textarea> is hidden by "keydown" event listener]
+    expected: FAIL
+
+  [<textarea> is hidden by "keypress" event listener]
+    expected: FAIL
+
+  [<textarea> is hidden by "beforeinput" event listener]
+    expected: FAIL
+
+
+[edit-in-textcontrol-immediately-after-hidden.tentative.html?editor=textarea&hide-target=parent]
+  [execCommand("insertText", false, "typed value") in <textarea>]
+    expected: FAIL
+
+  [execCommand("delete") in <textarea>]
+    expected: FAIL
+
+  [<textarea> is hidden by "keydown" event listener]
+    expected: FAIL
+
+  [<textarea> is hidden by "keypress" event listener]
+    expected: FAIL
+
+  [<textarea> is hidden by "beforeinput" event listener]
+    expected: FAIL
+
+
+[edit-in-textcontrol-immediately-after-hidden.tentative.html?editor=input&hide-target=parent]
+  [execCommand("insertText", false, "typed value") in <input>]
+    expected: FAIL
+
+  [execCommand("delete") in <input>]
+    expected: FAIL
+
+  [<input> is hidden by "keydown" event listener]
+    expected: FAIL
+
+  [<input> is hidden by "keypress" event listener]
+    expected: FAIL
+
+  [<input> is hidden by "beforeinput" event listener]
+    expected: FAIL
+
+
+[edit-in-textcontrol-immediately-after-hidden.tentative.html?editor=input&hide-target=editor]
+  [execCommand("insertText", false, "typed value") in <input>]
+    expected: FAIL
+
+  [execCommand("delete") in <input>]
+    expected: FAIL
+
+  [<input> is hidden by "keydown" event listener]
+    expected: FAIL
+
+  [<input> is hidden by "keypress" event listener]
+    expected: FAIL
+
+  [<input> is hidden by "beforeinput" event listener]
+    expected: FAIL
diff --git a/testing/web-platform/tests/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html b/testing/web-platform/tests/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html
new file mode 100644
index 000000000000..2cdffd6e2c07
--- /dev/null
+++ b/testing/web-platform/tests/editing/other/edit-in-textcontrol-immediately-after-hidden.tentative.html
@@ -0,0 +1,138 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="variant" content="?editor=input&hide-target=editor">
+<meta name="variant" content="?editor=textarea&hide-target=editor">
+<meta name="variant" content="?editor=input&hide-target=parent">
+<meta name="variant" content="?editor=textarea&hide-target=parent">
+<title>Testing edit action in zombie editor</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<body>
+<script>
+"use strict";
+
+const params = new URLSearchParams(location.search);
+
+/**
+ * The expected results is based on Chrome 93.
+ * The behavior is reasonable because JS API which requires focus and user input
+ * does not work if it's hidden.
+ */
+
+function init() {
+  const div = document.createElement("div");
+  const editor = document.createElement(params.get("editor"));
+  const hideTarget = params.get("hide-target") == "editor" ? editor : div;
+  editor.value = "default value";
+  div.appendChild(editor);
+  document.body.appendChild(div);
+  return [ hideTarget, editor ];
+}
+
+function finalize(editor) {
+  editor.blur();
+  editor.parentNode.remove();
+  document.body.getBoundingClientRect();
+}
+
+promise_test(async () => {
+  await new Promise(resolve => addEventListener("load", resolve, {once: true}));
+}, "Wait for load event");
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.select();
+    hideTarget.style.display = "none";
+    document.execCommand("insertText", false, "typed value");
+    assert_equals(editor.value, "default value", "The value shouldn't be modified by \"insertText\" command");
+  } finally {
+    finalize(editor);
+  }
+}, `execCommand("insertText", false, "typed value") in <${params.get("editor")}>`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.select();
+    hideTarget.style.display = "none";
+    document.execCommand("delete");
+    assert_equals(editor.value, "default value", "The value shouldn't be modified by \"delete\" command");
+  } finally {
+    finalize(editor);
+  }
+}, `execCommand("delete") in <${params.get("editor")}>`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.select();
+    const waitForKeyDown = new Promise(resolve => {
+      editor.addEventListener("keydown", () => {
+        hideTarget.style.display = "none";
+        resolve();
+      });
+    });
+    await new test_driver.Actions()
+      .keyDown("a").keyUp("a")
+      .send();
+    assert_equals(
+      editor.value,
+      "default value",
+      "The value shouldn't be modified by user input if \"keydown\" event listener destroyed the editor"
+    );
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}> is hidden by "keydown" event listener`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.select();
+    const waitForKeyDown = new Promise(resolve => {
+      editor.addEventListener("keypress", () => {
+        hideTarget.style.display = "none";
+        resolve();
+      });
+    });
+    await new test_driver.Actions()
+      .keyDown("a").keyUp("a")
+      .send();
+    assert_equals(
+      editor.value,
+      "default value",
+      "The value shouldn't be modified by user input if \"keypress\" event listener destroyed the editor"
+    );
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}> is hidden by "keypress" event listener`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.select();
+    const waitForKeyDown = new Promise(resolve => {
+      editor.addEventListener("beforeinput", () => {
+        hideTarget.style.display = "none";
+        resolve();
+      });
+    });
+    await new test_driver.Actions()
+      .keyDown("a").keyUp("a")
+      .send();
+    assert_equals(
+      editor.value,
+      "default value",
+      "The value shouldn't be modified by user input if \"beforeinput\" event listener destroyed the editor"
+    );
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}> is hidden by "beforeinput" event listener`);
+</script>
+</body>
diff --git a/testing/web-platform/tests/editing/other/setting-value-of-textcontrol-immediately-after-hidden.html b/testing/web-platform/tests/editing/other/setting-value-of-textcontrol-immediately-after-hidden.html
new file mode 100644
index 000000000000..f8a867f0782a
--- /dev/null
+++ b/testing/web-platform/tests/editing/other/setting-value-of-textcontrol-immediately-after-hidden.html
@@ -0,0 +1,118 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="variant" content="?editor=input&hide-target=editor">
+<meta name="variant" content="?editor=textarea&hide-target=editor">
+<meta name="variant" content="?editor=input&hide-target=parent">
+<meta name="variant" content="?editor=textarea&hide-target=parent">
+<title>Testing edit action in zombie editor</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<body>
+<script>
+"use strict";
+
+const params = new URLSearchParams(location.search);
+
+/**
+ * The expected results is based on Chrome 93.
+ * The behavior is reasonable because JS API which does not require focus keeps
+ * working even if it's hidden.
+ */
+
+function init() {
+  const div = document.createElement("div");
+  const editor = document.createElement(params.get("editor"));
+  const hideTarget = params.get("hide-target") == "editor" ? editor : div;
+  editor.value = "default value";
+  div.appendChild(editor);
+  document.body.appendChild(div);
+  return [ hideTarget, editor ];
+}
+
+function finalize(editor) {
+  editor.blur();
+  editor.parentNode.remove();
+  document.body.getBoundingClientRect();
+}
+
+promise_test(async () => {
+  await new Promise(resolve => addEventListener("load", resolve, {once: true}));
+}, "Wait for load event");
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    hideTarget.style.display = "none";
+    editor.value = "new value";
+    assert_equals(editor.value, "new value", "The value should be set properly");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.value = "new value" (without focus)`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.focus();
+    hideTarget.style.display = "none";
+    editor.value = "new value";
+    assert_equals(editor.value, "new value", "The value should be set properly");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.value = "new value" (with focus)`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.focus();
+    editor.blur();
+    hideTarget.style.display = "none";
+    editor.value = "new value";
+    assert_equals(editor.value, "new value", "The value should be set properly");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.value = "new value" (after blur)`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    hideTarget.style.display = "none";
+    editor.setRangeText("new", 0, "default".length);
+    assert_equals(editor.value, "new value", "The value should be set properly by setRangeText");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.setRangeText("new", 0, "default".length) (without focus)`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.focus();
+    hideTarget.style.display = "none";
+    editor.setRangeText("new", 0, "default".length);
+    assert_equals(editor.value, "new value", "The value should be set properly by setRangeText");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.setRangeText("new", 0, "default".length) (with focus)`);
+
+promise_test(async () => {
+  const [hideTarget, editor] = init();
+  try {
+    editor.focus();
+    editor.blur();
+    hideTarget.style.display = "none";
+    editor.setRangeText("new", 0, "default".length);
+    assert_equals(editor.value, "new value", "The value should be set properly by setRangeText");
+  } finally {
+    finalize(editor);
+  }
+}, `<${params.get("editor")}>.setRangeText("new", 0, "default".length) (after blur)`);
+
+</script>
+</body>
