Skip to content
This repository has been archived by the owner on Apr 13, 2023. It is now read-only.

use up to date props on state change #70

Merged
merged 1 commit into from
Jun 7, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions Changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

Expect active development and potentially significant breaking changes in the `0.x` track. We'll try to be diligent about releasing a `1.0` version in a timely fashion (ideally within 1 or 2 months), so that we can take advantage of SemVer to signify breaking changes from that point on.

### v.0.3.8

Bug: Don't use old props on store change change

### v.0.3.7

Bug: Reset loading state when a refetched query has returned
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-apollo",
"version": "0.3.7",
"version": "0.3.8",
"description": "React data container for Apollo Client",
"main": "index.js",
"scripts": {
Expand Down
3 changes: 2 additions & 1 deletion src/connect.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -199,10 +199,11 @@ export default function connect(opts?: ConnectOptions) {
}

bindStoreUpdates(): void {
const { store, props } = this;
const { store } = this;
const { reduxRootKey } = this.client;

this.unsubscribeFromStore = store.subscribe(() => {
const { props } = this;
let newState = assign({}, store.getState());
let oldState = assign({}, this.previousState);

Expand Down
70 changes: 70 additions & 0 deletions test/connect/queries.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -469,6 +469,76 @@ describe('queries', () => {

});

// taken from https://gist.github.com/sgoll/8519d638feb9489242f517cf954e4681
it('doesn\'t rebuild the queries on dispatch if nothing has changed', () => {

const demoAction = () => ({
type: 'DEMO_ACTION',
});

const demoReducer = (state = 0, action) => (
action.type === 'DEMO_ACTION' ? state + 1 : state
);

const DemoComponent = () => null;

// whenever mapQueriesToProps is called, we extract ownProps for test
let gotProps;

const mapQueriesToProps = ({ ownProps }) => {
gotProps = ownProps;
// not necessary to actually set up any queries
return {};
};


// wrap dummy component into connect'd container
const DemoContainer = connect({ mapQueriesToProps })(
DemoComponent
);


// initialize Apollo client and integrate into Redux store
const client = new ApolloClient();

// Typscript workaround
const apolloReducer = client.reducer() as () => any;

const store = createStore(
combineReducers({
demo: demoReducer,
apollo: apolloReducer,
}),
applyMiddleware(client.middleware())
);


// simple root container that forwards props (changed with setProps
// below) to demo component
const Root = (props) => (
<ProviderMock client={client} store={store}>
<DemoContainer {...props} />
</ProviderMock>
);


// on initial render, we expect mapQueriesToProps to be called with
// passed prop value "foo"
const wrapper = mount(<Root value='foo' />);
expect(gotProps.value).to.equal('foo');

// now we change prop value to "bar", expect mapQueriesToProps call
// with updated prop value "bar"
wrapper.setProps({ value: 'bar' });
expect(gotProps.value).to.equal('bar');

// running an arbitrary action that changes the store state should
// not update the prop value passed to mapQueriesToProps
client.store.dispatch(demoAction() as any);
expect(gotProps.value).to.equal('bar');

});

it('rebuilds the queries on prop change', (done) => {
const query = gql`
query people {
Expand Down