Bug 1168055 - Fix the :active pseudo-class on text controls. r=smaug, a=sledru
authorEhsan Akhgari <ehsan@mozilla.com>
Tue, 26 May 2015 23:20:02 -0400
changeset 266129 4f5b9c0de6ce
parent 266128 cc237f8e9fa5
child 266130 2d83b8a022a6
push id4762
push userryanvm@gmail.com
push date2015-05-28 18:54 +0000
treeherdermozilla-beta@dc9c305024f4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerssmaug, sledru
bugs1168055
milestone39.0
Bug 1168055 - Fix the :active pseudo-class on text controls. r=smaug, a=sledru
dom/events/EventStateManager.cpp
dom/events/test/test_bug924087.html
--- a/dom/events/EventStateManager.cpp
+++ b/dom/events/EventStateManager.cpp
@@ -4712,18 +4712,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>