Polyfill/normalize autoFocus across all browsers
Andreas Svensson committed
Dec 23, 2013 at 23:47 UTC
01b4b23118e6a55d5cbd93a27b7c99f49e7521e0
6 files changed
+40
-4
src/dom/DefaultDOMPropertyConfig.js
+2
-1
@@ -45,7 +45,8 @@ var DefaultDOMPropertyConfig = {
45
alt: null,
46
async: HAS_BOOLEAN_VALUE,
47
autoComplete: null,
48
- autoFocus: HAS_BOOLEAN_VALUE,
48
+ // autoFocus is polyfilled/normalized by AutoFocusMixin
49
+ // autoFocus: HAS_BOOLEAN_VALUE,
50
autoPlay: HAS_BOOLEAN_VALUE,
51
cellPadding: null,
52
cellSpacing: null,
src/dom/components/AutoFocusMixin.js
new
+30
@@ -0,0 +1,30 @@
1
+/**
2
+ * Copyright 2013 Facebook, Inc.
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ *
16
+ * @providesModule AutoFocusMixin
17
+ * @typechecks static-only
18
+ */
19
+
20
+"use strict";
21
+
22
+var AutoFocusMixin = {
23
+ componentDidMount: function() {
24
+ if (this.props.autoFocus) {
25
+ this.getDOMNode().focus();
26
+ }
27
+ }
28
+};
29
+
30
+module.exports = AutoFocusMixin;
src/dom/components/ReactDOMButton.js
+2
@@ -18,6 +18,7 @@
18
19
"use strict";
20
21
+var AutoFocusMixin = require('AutoFocusMixin');
22
var ReactCompositeComponent = require('ReactCompositeComponent');
23
var ReactDOM = require('ReactDOM');
24
@@ -44,6 +45,7 @@ var mouseListenerNames = keyMirror({
45
* when `disabled` is set.
46
*/
47
var ReactDOMButton = ReactCompositeComponent.createClass({
48
+ mixins: [AutoFocusMixin],
49
50
render: function() {
51
var props = {};
src/dom/components/ReactDOMInput.js
+2
-1
@@ -20,6 +20,7 @@
20
21
var DOMPropertyOperations = require('DOMPropertyOperations');
22
var LinkedValueMixin = require('LinkedValueMixin');
23
+var AutoFocusMixin = require('AutoFocusMixin');
24
var ReactCompositeComponent = require('ReactCompositeComponent');
25
var ReactDOM = require('ReactDOM');
26
var ReactMount = require('ReactMount');
@@ -49,7 +50,7 @@ var instancesByReactID = {};
50
* @see http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
51
*/
52
var ReactDOMInput = ReactCompositeComponent.createClass({
52
- mixins: [LinkedValueMixin],
53
+ mixins: [LinkedValueMixin, AutoFocusMixin],
54
55
getInitialState: function() {
56
var defaultValue = this.props.defaultValue;
src/dom/components/ReactDOMSelect.js
+2
-1
@@ -19,6 +19,7 @@
19
"use strict";
20
21
var LinkedValueMixin = require('LinkedValueMixin');
22
+var AutoFocusMixin = require('AutoFocusMixin');
23
var ReactCompositeComponent = require('ReactCompositeComponent');
24
var ReactDOM = require('ReactDOM');
25
@@ -99,7 +100,7 @@ function updateOptions() {
100
* selected.
101
*/
102
var ReactDOMSelect = ReactCompositeComponent.createClass({
102
- mixins: [LinkedValueMixin],
103
+ mixins: [LinkedValueMixin, AutoFocusMixin],
104
105
propTypes: {
106
defaultValue: selectValueType,
src/dom/components/ReactDOMTextarea.js
+2
-1
@@ -20,6 +20,7 @@
20
21
var DOMPropertyOperations = require('DOMPropertyOperations');
22
var LinkedValueMixin = require('LinkedValueMixin');
23
+var AutoFocusMixin = require('AutoFocusMixin');
24
var ReactCompositeComponent = require('ReactCompositeComponent');
25
var ReactDOM = require('ReactDOM');
26
@@ -45,7 +46,7 @@ var textarea = ReactDOM.textarea;
46
* `defaultValue` if specified, or the children content (deprecated).
47
*/
48
var ReactDOMTextarea = ReactCompositeComponent.createClass({
48
- mixins: [LinkedValueMixin],
49
+ mixins: [LinkedValueMixin, AutoFocusMixin],
50
51
getInitialState: function() {
52
var defaultValue = this.props.defaultValue;