Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

A nested ForwardRef is not recognized as a valid component by shallow dive() #1830

Closed
uxtechie opened this issue Sep 21, 2018 · 3 comments
Closed

Comments

@uxtechie
Copy link

uxtechie commented Sep 21, 2018

Describe the bug
A nested ForwardRef is not recognized as a valid component when I do shallow dive() to it.

To Reproduce
Steps to reproduce the behavior:

  1. Sample code:
  import * as React from "react";
  import { shallow } from 'enzyme';

  const Component = () => <div/>
  const HOCOne = (WrappedComponent) => React.forwardRef(() => <WrappedComponent/>)
  const HOCTwo = (WrappedComponent) => React.forwardRef(() => <WrappedComponent/>)
  const WithNestedForwarRefComponent = HOCTwo(HOCOne(Component)))
  
  const vDomWrapper = shallow(<WithNestedForwarRefComponent/>);
  
  1. Then debug() and dive() vDomWrapper:
  vDomWrapper.debug()
  vDomWrapper.dive()
  1. Debug output:
    <ForwardRef(HOCOne(Component)) />
  2. See dive() error:
    TypeError: ShallowWrapper::dive() can only be called on components

Expected behavior
A ForwardRef component must be recognized as such and it must be possible to do dive () on it.

Desktop:

  • OS: Ubuntu 18.04
  • Node: 8.11.3
  • Enzyme: 3.6.0
  • React: 16.5.0
@uxtechie
Copy link
Author

Fixed by this Pull Request

@ljharb ljharb changed the title A nested ForwarRef is not recognized as a valid component by shallow dive() A nested ForwardRef is not recognized as a valid component by shallow dive() Sep 21, 2018
@ljharb
Copy link
Member

ljharb commented Sep 21, 2018

What happens when you directly shallow-wrap React.forwardRef(() => <WrappedComponent/>)?

@uxtechie
Copy link
Author

What happens when you directly shallow-wrap React.forwardRef(() => )?

It works well in that case @ljharb

ljharb added a commit that referenced this issue Oct 2, 2018
 - [fix] `shallow`: A nested ForwardRef is not recognized as a valid component by `dive()`
 - [enzyme-adapter-react-{16,16.3}] [new] add `isCustomComponentElement`

Fixes #1830.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants