Skip to content

Commit

Permalink
fix(uiview): Fix uiCanExit when routing to a React.forwardRef()
Browse files Browse the repository at this point in the history
  • Loading branch information
christopherthielen committed Aug 7, 2018
1 parent e314bbb commit cf5c668
Show file tree
Hide file tree
Showing 2 changed files with 38 additions and 1 deletion.
5 changes: 4 additions & 1 deletion src/components/UIView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,10 @@ class View extends Component<UIViewProps, UIViewState> {
// only class components can implement the
// uiCanExit hook and ref doesn't work on
// stateless function components
if (typeof component !== 'string' && !!component.prototype.render) {
if (
typeof component !== 'string' &&
(!!component.render || (component.prototype && !!component.prototype.render))
) {
props.ref = c => {
this.componentInstance = c;
this.registerUiCanExitHook(stateName);
Expand Down
34 changes: 34 additions & 0 deletions src/components/__tests__/UIView.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -245,6 +245,40 @@ describe('<UIView>', () => {
expect(uiCanExitSpy).toBeCalled();
});

it('calls uiCanExit function of a React.forwardRef() State Component when unmounting', async () => {
let uiCanExitSpy = jest.fn();
class Comp extends React.Component<any, any> {
uiCanExit = uiCanExitSpy;
render() {
return <span>UiCanExitHookComponent</span>;
}
}
const ForwardRef = React.forwardRef((props, ref) => <Comp {...props} ref={ref} />);
const Exit = () => <span>exit</span>;
router = new UIRouterReact();
router.plugin(servicesPlugin);
router.plugin(memoryLocationPlugin);
router.stateRegistry.register({
name: '__state',
component: ForwardRef,
} as ReactStateDeclaration);
router.stateRegistry.register({
name: 'exit',
component: Exit,
} as ReactStateDeclaration);
const wrapper = mount(
<UIRouter router={router}>
<UIView />
</UIRouter>
);
await router.stateService.go('__state');
console.log(wrapper.html());
expect(wrapper.html()).toEqual('<span>UiCanExitHookComponent</span>');
await router.stateService.go('exit');
expect(wrapper.html()).toEqual('<span>exit</span>');
expect(uiCanExitSpy).toBeCalled();
});

it('deregisters the UIView when unmounted', () => {
const Component = props => <UIRouter router={router}>{props.show ? <UIView /> : <div />}</UIRouter>;
const wrapper = mount(<Component show={true} />);
Expand Down

0 comments on commit cf5c668

Please sign in to comment.