Merge pull request styled-components#764 from MatthieuLemoine/v2

[v2] Restore setNativeProps

CHANGELOG.md

@@ -25,6 +25,7 @@ All notable changes to this project will be documented in this file. If a contri
 - Switch to babel-preset-env. (see [#717](https://github.com/styled-components/styled-components/pull/717))
 - Update StyledNativeComponent to match StyledComponent implementation.
 - Fix Theme context for StyledComponent for IE <10. (see [#807](https://github.com/styled-components/styled-components/pull/807))
+- Restore `setNativeProps` in StyledNativeComponent, thanks to [@MatthieuLemoine](https://github.com/MatthieuLemoine). (see [#764](https://github.com/styled-components/styled-components/pull/764))
 
 ## [v1.4.6] - 2017-05-02
 

src/models/StyledNativeComponent.js

@@ -18,6 +18,7 @@ export default (constructWithOptions: Function) => {
     static styledComponentId: string
     static attrs: Object
     static inlineStyle: Object
+    root: Object
 
     attrs = {}
     state = {
@@ -95,8 +96,21 @@ export default (constructWithOptions: Function) => {
       }
     }
 
+    setNativeProps(nativeProps: Object) {
+      this.root.setNativeProps(nativeProps)
+    }
+
+    onRef = (node: any) => {
+      const { innerRef } = this.props
+      this.root = node
+
+      if (typeof innerRef === 'function') {
+        innerRef(node)
+      }
+    }
+
     render() {
-      const { children, style, innerRef } = this.props
+      const { children, style } = this.props
       const { generatedStyles } = this.state
       const { target } = this.constructor
 
@@ -107,8 +121,10 @@ export default (constructWithOptions: Function) => {
       }
 
       if (!isStyledComponent(target)) {
-        propsForElement.ref = innerRef
+        propsForElement.ref = this.onRef
         delete propsForElement.innerRef
+      } else {
+        propsForElement.innerRef = this.onRef
       }
 
       return createElement(target, propsForElement, children)

src/native/test/native.test.js

@@ -199,7 +199,6 @@ describe('native', () => {
 
       // $FlowFixMe
       expect(ref).toHaveBeenCalledWith(view.node)
-      expect(innerComponent.prop('innerRef')).toBe(ref)
     })
   })
 })