Merge pull request #33 from dan-lee/new-context-api

Support for new React Context API (16.3)

Author: ctrlplusb

package.json

@@ -60,7 +60,7 @@
     "pretty-bytes": "4.0.2",
     "prop-types": "^15.6.0",
     "ramda": "^0.25.0",
-    "react": "^16.0.0",
+    "react": "^16.4.0",
     "react-addons-test-utils": "^15.6.2",
     "react-dom": "^16.0.0",
     "readline-sync": "1.4.7",

src/__tests__/index.test.js

@@ -339,6 +339,46 @@ describe('reactTreeWalker', () => {
   })
 
   describe('react', () => {
+    it('supports new context API', () => {
+      const { Provider, Consumer } = React.createContext()
+
+      class SomeInstance extends React.Component {
+        render() {
+          return <div>{this.props.text}</div>
+        }
+      }
+
+      const tree = (
+        <Provider
+          value={{
+            message: 'This is a provider message',
+            handler: io => io,
+          }}
+        >
+          <Consumer>
+            {({ message, handler }) => (
+              <strong>
+                <i>{`${message}: ${handler}`}</i>
+              </strong>
+            )}
+          </Consumer>
+          Next
+          <SomeInstance text="Dynamic text" />
+        </Provider>
+      )
+
+      const elements = []
+      reactTreeWalker(tree, element => {
+        elements.push(element)
+      }).then(() => {
+        expect(elements.pop()).toBe('Dynamic text')
+        elements.pop() // Pop the div element
+        elements.pop() // Pop the class instance
+        expect(elements.pop()).toBe('Next')
+        expect(elements.pop()).toBe('This is a provider message: io => io')
+      })
+    })
+
     it('supports portals', () => {
       class Foo extends ReactComponent {
         getData() {

src/index.js

@@ -113,6 +113,20 @@ export default function reactTreeWalker(
         return Promise.resolve()
       }
 
+      if (currentElement.type) {
+        if (currentElement.type._context) {
+          // eslint-disable-next-line no-param-reassign
+          currentElement.type._context._currentValue =
+            currentElement.props.value
+        }
+        if (currentElement.type.Provider && currentElement.type.Consumer) {
+          const el = currentElement.props.children(
+            currentElement.type.Provider._context._currentValue,
+          )
+          return recursive(el)
+        }
+      }
+
       if (isReactElement(currentElement)) {
         return new Promise(innerResolve => {
           const visitCurrentElement = (

yarn.lock

@@ -4197,9 +4197,9 @@ react-dom@^16.0.0:
     object-assign "^4.1.1"
     prop-types "^15.6.0"
 
-react@^16.0.0:
-  version "16.2.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.2.0.tgz#a31bd2dab89bff65d42134fa187f24d054c273ba"
+react@^16.4.0:
+  version "16.4.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.4.0.tgz#402c2db83335336fba1962c08b98c6272617d585"
   dependencies:
     fbjs "^0.8.16"
     loose-envify "^1.1.0"