From 0047e3bc2ddea5c4ff8ef6d7fe9a0e947ffcd853 Mon Sep 17 00:00:00 2001 From: Nathan Sobo Date: Wed, 11 Feb 2015 15:36:13 -0700 Subject: [PATCH] Perform InputComponent DOM updates manually --- src/input-component.coffee | 30 +++++++++++++++++++++++++----- 1 file changed, 25 insertions(+), 5 deletions(-) diff --git a/src/input-component.coffee b/src/input-component.coffee index 4a0a666a2..d04c5e419 100644 --- a/src/input-component.coffee +++ b/src/input-component.coffee @@ -8,9 +8,7 @@ InputComponent = React.createClass render: -> {className} = @props - style = @props.presenter.state.hiddenInput - style.WebkitTransform ?= 'translateZ(0)' - input {className, style, 'data-react-skip-selection-restoration': true} + input {className} getInitialState: -> {lastChar: ''} @@ -19,11 +17,33 @@ InputComponent = React.createClass node = @getDOMNode() node.addEventListener 'paste', @onPaste node.addEventListener 'compositionupdate', @onCompositionUpdate + node.setAttribute('data-react-skip-selection-restoration', true) + node.style['-webkit-transform'] = 'translateZ(0)' - # Don't let text accumulate in the input forever, but avoid excessive reflows componentDidUpdate: -> + node = @getDOMNode() + @oldState ?= {} + newState = @props.presenter.state.hiddenInput + + if newState.top isnt @oldState.top + node.style.top = newState.top + 'px' + @oldState.top = newState.top + + if newState.left isnt @oldState.left + node.style.left = newState.left + 'px' + @oldState.left = newState.left + + if newState.width isnt @oldState.width + node.style.width = newState.width + 'px' + @oldState.width = newState.width + + if newState.height isnt @oldState.height + node.style.height = newState.height + 'px' + @oldState.height = newState.height + + # Don't let text accumulate in the input forever, but avoid excessive reflows if @lastValueLength > 500 and not @isPressAndHoldCharacter(@state.lastChar) - @getDOMNode().value = '' + node.value = '' @lastValueLength = 0 # This should actually consult the property lists in /System/Library/Input Methods/PressAndHold.app