Skip to content

Commit

Permalink
Fix NodeForm submitting
Browse files Browse the repository at this point in the history
Overlay is now a HOC, so the ref needs to be restored.

See discussion at reduxjs/react-redux#914,
which is a related issue; this is the scenario where forwardRef is described
as not possible from user code. To work around, this manually stores & gets
the Overlay instance.

Note: I wasn't able to assert the needed state with enzyme; hence the
test renderer.
  • Loading branch information
bryfox committed Nov 8, 2018
1 parent 05fce06 commit 8385572
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 4 deletions.
10 changes: 7 additions & 3 deletions src/components/Overlay.js
Expand Up @@ -7,8 +7,8 @@ import { Modal } from '../ui/components';
import { getCSSVariableAsNumber, getCSSVariableAsObject } from '../utils/CSSVariables';

/**
* Renders a modal window.
*/
* Renders a modal window.
*/
class Overlay extends Component {
constructor(props) {
super(props);
Expand Down Expand Up @@ -68,7 +68,11 @@ Overlay.defaultProps = {
children: null,
};

export {
Overlay,
};

const mapStateToProps = state =>
({ useFullScreenForms: state.deviceSettings.useFullScreenForms });

export default connect(mapStateToProps, null)(Overlay);
export default connect(mapStateToProps, null, null, { withRef: true })(Overlay);
23 changes: 23 additions & 0 deletions src/components/__tests__/Overlay.test.js
@@ -0,0 +1,23 @@
/* eslint-env jest */
import React from 'react';
import { createStore } from 'redux';
import TestRenderer from 'react-test-renderer';

import ConnectedOverlay, { Overlay } from '../Overlay';

describe('Connect(Overlay)', () => {
let mockStore;

beforeEach(() => {
mockStore = createStore(() => ({
deviceSettings: {},
}));
});

it('stores a ref to support getWrappedInstance()', () => {
const ref = React.createRef();
TestRenderer.create(<ConnectedOverlay ref={ref} store={mockStore} />);
expect(ref.current.getWrappedInstance).toBeInstanceOf(Function);
expect(ref.current.getWrappedInstance()).toBeInstanceOf(Overlay);
});
});
2 changes: 1 addition & 1 deletion src/containers/NodeForm.js
Expand Up @@ -34,7 +34,7 @@ class NodeForm extends Component {

handleSubmit = (form) => {
this.props.onSubmit({ form, addAnotherNode: this.state.addAnotherNode });
this.overlay.current.scrollContentsToTop();
this.overlay.current.getWrappedInstance().scrollContentsToTop();
this.props.resetValues(reduxFormName);
}

Expand Down

0 comments on commit 8385572

Please sign in to comment.