Bug 1168055 - Fix the :active pseudo-class on text controls; r=smaug
authorEhsan Akhgari <ehsan@mozilla.com>
Tue, 26 May 2015 23:20:02 -0400
changeset 268042 d28aa0b0b47f24616efd6e58a1c7c352bf7db55a
parent 268041 67efcb1efc4383180e645b9ee4de6bcbfc774b6a
child 268043 7431168bfa3b193e8475af224b993e39329d5693
push id2294
push userbsmedberg@mozilla.com
push dateWed, 27 May 2015 15:05:10 +0000
reviewerssmaug
bugs1168055
milestone41.0a1
Bug 1168055 - Fix the :active pseudo-class on text controls; r=smaug
dom/events/EventStateManager.cpp
dom/events/test/test_bug924087.html
--- a/dom/events/EventStateManager.cpp
+++ b/dom/events/EventStateManager.cpp
@@ -4792,18 +4792,20 @@ EventStateManager::SetContentState(nsICo
     {
       const nsStyleUserInterface* ui = mCurrentTarget->StyleUserInterface();
       if (ui->mUserInput == NS_STYLE_USER_INPUT_NONE)
         return false;
     }
 
     if (aState == NS_EVENT_STATE_ACTIVE) {
       // Editable content can never become active since their default actions
-      // are disabled.
-      if (aContent && aContent->IsEditable()) {
+      // are disabled.  Watch out for editable content in native anonymous
+      // subtrees though, as they belong to text controls.
+      if (aContent && aContent->IsEditable() &&
+          !aContent->IsInNativeAnonymousSubtree()) {
         aContent = nullptr;
       }
       if (aContent != mActiveContent) {
         notifyContent1 = aContent;
         notifyContent2 = mActiveContent;
         mActiveContent = aContent;
       }
     } else {
--- a/dom/events/test/test_bug924087.html
+++ b/dom/events/test/test_bug924087.html
@@ -7,30 +7,39 @@ https://bugzilla.mozilla.org/show_bug.cg
   <title>Test for Bug 924087</title>
   <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
   <script type="application/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
 </head>
 <body>
 <div contenteditable><a id="editable" href="#">editable link</a></div>
 <a id="noneditable" href="#">non-editable link</a>
+<input>
+<textarea></textarea>
 <pre id="test">
 <script type="application/javascript;version=1.8">
 
 /** Test for Bug 924087 **/
 SimpleTest.waitForExplicitFinish();
 SimpleTest.waitForFocus(function() {
   var editable = document.querySelector("#editable");
   var noneditable = document.querySelector("#noneditable");
+  var input = document.querySelector("input");
+  var textarea = document.querySelector("textarea");
   synthesizeMouseAtCenter(noneditable, {type:"mousedown"});
   is(document.querySelector(":active:link"), noneditable, "Normal links should become :active");
   synthesizeMouseAtCenter(noneditable, {type:"mouseup"});
   synthesizeMouseAtCenter(editable, {type:"mousedown"});
   is(document.querySelector(":active:link"), null, "Editable links should not become :active");
   synthesizeMouseAtCenter(editable, {type:"mouseup"});
+  [input, textarea].forEach(textbox => {
+    synthesizeMouseAtCenter(textbox, {type:"mousedown"});
+    is(document.querySelector(textbox.localName + ":active"), textbox, "The textbox should become :active");
+    synthesizeMouseAtCenter(textbox, {type:"mouseup"});
+  });
   SimpleTest.finish();
 });
 
 </script>
 </pre>
 
 </body>
 </html>