-
-
Notifications
You must be signed in to change notification settings - Fork 2k
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
React.Lazy always returning the Fallback value #2200
Comments
By default, You can get more info by using |
Yeah I was trying to use The suspenseFallback option seems to not be making a difference to what is output. const wrapper = shallow(<ComponentWrapper />, { suspenseFallback: true });
console.log(wrapper.debug());
<Suspense fallback="...">
<lazy />
</Suspense> const wrapper = shallow(<ComponentWrapper />, { suspenseFallback: false });
console.log(wrapper.debug());
<Suspense fallback="...">
<lazy />
</Suspense> I would have expected in the second example to see my |
hmm, that seems like a bug then. |
@philearley does it work to you with |
@skyboyer when I tried to use mount I received warnings saying Mount was not supported. |
Hi there, is there any update on the issue? Thanks. |
Still experiencing this issue. |
@webdevsyd Maybe a little late to the party but I found that I had to dive into my component and then I could find what I was looking for.
|
I created #2328 to resolve this issue and make a note in PR, please read it. |
@lamhieu-vk Has your fix for this issue been released yet? I am on the latest versions of |
@liegeandlief no, the commit that closed the PR shows it's not yet in enzyme-adapter-react-16. i'll cut a release tomorrow. |
v1.15.3 of the adapter has been released. |
Unfortunately this still isn't working for me. My test is as follows: test('it renders as expected', () => {
const wrapper = shallow(<PageSwitch pageData={{ key: 'home' }} />, { suspenseFallback: true })
expect(wrapper.find(PageSwitchFallback)).toHaveLength(1)
expect(wrapper.find(Home)).toHaveLength(0)
const wrapper2 = shallow(<PageSwitch pageData={{ key: 'home' }} />, { suspenseFallback: false })
expect(wrapper2.find(PageSwitchFallback)).toHaveLength(0)
expect(wrapper2.find(Home)).toHaveLength(1) / * FAILS HERE - expected 1 received 0 */
}) My const Home = lazy(() => import('../pages/Home/'))
const PageSwitchFallback = memo(() => {
return <div aria-live='polite' aria-busy />
})
PageSwitchFallback.displayName = 'PageSwitchFallback'
const PageSwitch = memo(({ pageData }) => {
const renderPageComponent = useCallback(() => {
if (pageData === 'NOT_FOUND') return null
switch (pageData.key) {
case 'home':
return <Home />
}
}, [pageData])
return (
<Suspense fallback={<PageSwitchFallback />}>
{renderPageComponent()}
</Suspense>
)
})
PageSwitch.displayName = 'PageSwitch'
export default PageSwitch I have confirmed that it is reaching the Can you see anything I'm doing wrong here? |
What does |
It outputs:
|
@liegeandlief perhaps it's fixed in latest master - your test cases pass for me. I'll add them to make sure it doesn't regress in the future. edit: the tests fail in React v16.6 and v16.7. For now, try updating to v16.8 or newer? |
Well, sadly I have to say that it's still not working for me:
I'm using the latest version of every package: |
@orlandovallejos mind filing a new issue? |
Current behaviour
When writing a test to validate my component is rendered, I am only ever seeing the fallback value.
I am unsure as to what I am doing incorrect or if this is an issue.
Expected behaviour
I've tried exporting the
LazyComponent
and doing:expect(wrapper.find(LazyComponent).length).toEqual(1);
But my issue is flipped on its head and
wrapper.find(LazyComponent).length
is always 1.Your environment
API
Version
Adapter
The text was updated successfully, but these errors were encountered: