Merge pull request #700 from syranide/100%autofocus

Patch missing autoFocus-support in older browsers

src/dom/DefaultDOMPropertyConfig.js

@@ -45,7 +45,8 @@ var DefaultDOMPropertyConfig = {
     alt: null,
     async: HAS_BOOLEAN_VALUE,
     autoComplete: null,
-    autoFocus: HAS_BOOLEAN_VALUE,
+    // autoFocus is polyfilled/normalized by AutoFocusMixin
+    // autoFocus: HAS_BOOLEAN_VALUE,
     autoPlay: HAS_BOOLEAN_VALUE,
     cellPadding: null,
     cellSpacing: null,

src/dom/components/AutoFocusMixin.js

@@ -0,0 +1,30 @@
+/**
+ * Copyright 2013 Facebook, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * @providesModule AutoFocusMixin
+ * @typechecks static-only
+ */
+
+"use strict";
+
+var AutoFocusMixin = {
+  componentDidMount: function() {
+    if (this.props.autoFocus) {
+      this.getDOMNode().focus();
+    }
+  }
+};
+
+module.exports = AutoFocusMixin;

src/dom/components/ReactDOMButton.js

@@ -18,6 +18,7 @@
 
 "use strict";
 
+var AutoFocusMixin = require('AutoFocusMixin');
 var ReactCompositeComponent = require('ReactCompositeComponent');
 var ReactDOM = require('ReactDOM');
 
@@ -44,6 +45,7 @@ var mouseListenerNames = keyMirror({
  * when `disabled` is set.
  */
 var ReactDOMButton = ReactCompositeComponent.createClass({
+  mixins: [AutoFocusMixin],
 
   render: function() {
     var props = {};

src/dom/components/ReactDOMInput.js

@@ -20,6 +20,7 @@
 
 var DOMPropertyOperations = require('DOMPropertyOperations');
 var LinkedValueMixin = require('LinkedValueMixin');
+var AutoFocusMixin = require('AutoFocusMixin');
 var ReactCompositeComponent = require('ReactCompositeComponent');
 var ReactDOM = require('ReactDOM');
 var ReactMount = require('ReactMount');
@@ -49,7 +50,7 @@ var instancesByReactID = {};
  * @see http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
  */
 var ReactDOMInput = ReactCompositeComponent.createClass({
-  mixins: [LinkedValueMixin],
+  mixins: [LinkedValueMixin, AutoFocusMixin],
 
   getInitialState: function() {
     var defaultValue = this.props.defaultValue;

src/dom/components/ReactDOMSelect.js

@@ -19,6 +19,7 @@
 "use strict";
 
 var LinkedValueMixin = require('LinkedValueMixin');
+var AutoFocusMixin = require('AutoFocusMixin');
 var ReactCompositeComponent = require('ReactCompositeComponent');
 var ReactDOM = require('ReactDOM');
 
@@ -99,7 +100,7 @@ function updateOptions() {
  * selected.
  */
 var ReactDOMSelect = ReactCompositeComponent.createClass({
-  mixins: [LinkedValueMixin],
+  mixins: [LinkedValueMixin, AutoFocusMixin],
 
   propTypes: {
     defaultValue: selectValueType,

src/dom/components/ReactDOMTextarea.js

@@ -20,6 +20,7 @@
 
 var DOMPropertyOperations = require('DOMPropertyOperations');
 var LinkedValueMixin = require('LinkedValueMixin');
+var AutoFocusMixin = require('AutoFocusMixin');
 var ReactCompositeComponent = require('ReactCompositeComponent');
 var ReactDOM = require('ReactDOM');
 
@@ -45,7 +46,7 @@ var textarea = ReactDOM.textarea;
  * `defaultValue` if specified, or the children content (deprecated).
  */
 var ReactDOMTextarea = ReactCompositeComponent.createClass({
-  mixins: [LinkedValueMixin],
+  mixins: [LinkedValueMixin, AutoFocusMixin],
 
   getInitialState: function() {
     var defaultValue = this.props.defaultValue;