Add enableReducers and renderProp option to TestContext to help with integration testing

docs/UnitTesting.md

@@ -46,3 +46,39 @@ You can then provide additional props, as needed, to your component (such as the
 
 At this point, your component should `mount` without errors and you can unit test your component.
 
+
+## Enabling reducers to ensure actions are dispatched
+
+If you component relies on a a reducer, e.g. redux-form submission, you can enable reducers using the `enableReducers` prop:
+
+```jsx harmony
+    myCustomEditView = mount(
+        <TestContext enableReducers>
+            <MyCustomEditView />
+        </TestContext>
+    );
+```
+
+This means that reducers will work as they will within the app.  For example, you can now submit a form and redux-form will cause a re-render of your component.
+
+
+## Spying on the store 'dispatch'
+
+If you are using `mapDispatch` within connected components, it is likely you will want to test that actions have been dispatched with the correct arguments.  You can return the `store` being used within the tests using a `renderProp`. 
+
+```jsx harmony
+    let dispatchSpy;
+    myCustomEditView = mount(
+        <TestContext>
+            {({ store }) => {
+                dispatchSpy = jest.spyOn(store, 'dispatch');
+                return <MyCustomEditView />
+            }}
+        </TestContext>,
+    );
+
+    it('should send the user to another url', () => {
+        myCustomEditView.find('.next-button').simulate('click');
+        expect(dispatchSpy).toHaveBeenCalledWith(`/next-url`);
+    });
+```

packages/ra-core/src/util/TestContext.js

@@ -1,19 +1,21 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { createStore } from 'redux';
+import { createStore, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
 import { reducer as formReducer } from 'redux-form';
 import { TranslationProvider } from 'ra-core';
 import merge from 'lodash/merge';
 
-const defaultStore = {
-    admin: {
-        resources: {},
-        references: { possibleValues: {} },
-        ui: { viewVersion: 1 },
-    },
-    form: formReducer(),
-    i18n: { locale: 'en', messages: {} },
+import createAdminStore from '../createAdminStore';
+
+export const defaultStore = {
+  admin: {
+    resources: {},
+    references: { possibleValues: {} },
+    ui: { viewVersion: 1 },
+  },
+  form: formReducer(),
+  i18n: { locale: 'en', messages: {} },
 };
 
 /**
@@ -28,23 +30,41 @@ const defaultStore = {
  *         <Show {...defaultShowProps} />
  *     </AdminContext>
  * );
+ *
+ * @example
+ * // in an enzyme test, using jest.
+ * const wrapper = render(
+ *     <AdminContext store={{ admin: { resources: { post: { data: { 1: {id: 1, title: 'foo' } } } } } }}>
+ *         {({ store }) => {
+ *              dispatchSpy = jest.spyOn(store, 'dispatch');
+ *              return <Show {...defaultShowProps} />
+ *         }}
+ *     </AdminContext>
+ * );
  */
-const TestContext = ({ store, children }) => {
-    const storeWithDefault = createStore(() => merge(store, defaultStore));
-    return (
-        <Provider store={storeWithDefault}>
-            <TranslationProvider>{children}</TranslationProvider>
-        </Provider>
-    );
+const TestContext = ({ store, enableReducers, children }) => {
+  const storeWithDefault = enableReducers
+    ? createAdminStore({ initialState: merge(defaultStore, store) })
+    : createStore(() => merge(defaultStore, store));
+
+  const renderChildren = () => (typeof children === 'function' ? children({ store: storeWithDefault }) : children);
+
+  return (
+    <Provider store={storeWithDefault}>
+      <TranslationProvider>{renderChildren()}</TranslationProvider>
+    </Provider>
+  );
 };
 
 TestContext.propTypes = {
-    store: PropTypes.object,
-    children: PropTypes.node,
+  store: PropTypes.object.isRequired,
+  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
+  enableReducers: PropTypes.bool,
 };
 
 TestContext.defaultProps = {
-    store: {},
+  store: {},
+  enableReducers: false,
 };
 
 export default TestContext;

packages/ra-core/src/util/TestContext.spec.js

@@ -0,0 +1,100 @@
+import assert from 'assert';
+import { shallow, mount } from 'enzyme';
+import React from 'react';
+import { submit } from 'redux-form';
+
+import TestContext, { defaultStore } from './TestContext';
+
+const primedStore = {
+  "admin": {
+    "auth": {
+      "isLoggedIn": false,
+    },
+    "loading": 0,
+    "notifications": [],
+    "record": {},
+    "references": {
+      "oneToMany": {},
+      "possibleValues": {},
+    },
+    "resources": {},
+    "saving": false,
+    "ui": {
+      "viewVersion": 1,
+    },
+  },
+  "form": {},
+  "i18n": {
+    "loading": false,
+    "locale": "en",
+    "messages": {},
+  },
+  "router": {
+    "location": null,
+  },
+}
+
+describe('TestContext.js', () => {
+  let testStore;
+
+  it('should render the given children', () => {
+    const component = shallow(<TestContext><span>foo</span></TestContext>);
+    assert.equal(component.html(), '<span>foo</span>');
+  });
+
+  it('should return a default store as a renderProp', () => {
+    let component = shallow(
+      <TestContext>
+        {({ store }) => {
+          testStore = store;
+          return <span>foo</span>;
+        }}
+      </TestContext>
+    );
+    assert.equal(component.html(), '<span>foo</span>');
+    assert.equal(typeof testStore, 'object');
+    assert.equal(typeof testStore.dispatch, 'function');
+    assert.deepStrictEqual(testStore.getState(), defaultStore);
+  });
+
+  describe('enableReducers options', () => {
+    it('should update the state when set to TRUE', () => {
+      shallow(
+        <TestContext enableReducers={true}>
+          {({ store }) => {
+            testStore = store;
+            return <span>foo</span>;
+          }}
+        </TestContext>
+      );
+      assert.deepStrictEqual(testStore.getState(), primedStore);
+
+      testStore.dispatch(submit('foo'));
+
+      assert.deepStrictEqual(testStore.getState(), {
+        ...primedStore,
+        "form": {
+          "foo": {
+            "triggerSubmit": true,
+          },
+        },
+      });
+    });
+
+    it('should NOT update the state when set to FALSE (default)', () => {
+      shallow(
+        <TestContext >
+          {({ store }) => {
+            testStore = store;
+            return <span>foo</span>;
+          }}
+        </TestContext>
+      );
+      assert.deepStrictEqual(testStore.getState(), defaultStore);
+
+      testStore.dispatch(submit('foo'));
+
+      assert.deepStrictEqual(testStore.getState(), defaultStore);
+    });
+  });
+});