Downshift: Downshift is not compatible with preact/debug

[ramzes81]

• downshift version: 3.4.1
• preact version: 10.0.4

Reproduction repository:

https://codesandbox.io/s/downshift-preact-debug-issue-qth9r?fontsize=14

Problem description:

Downshift is not compatible with preact/debug, because it throws errors when derpecated fields are used.

Suggested solution:

Check element.type and element.props first in isDOMElementand getElementProps in file utils.js

I'll submit PR soon which will fix this.

[Crushford]

I am getting a similar issue but am not using preact/debug.
I tried to change my local instance of downshift to match your PR, but still go the error in the console of getting vnode.nodeName is deprecated, use vnode.type
I tried deleting the element.nodeName and then got the error of getting vnode.attributes is deprecated, use vnode.props
deleted that too and no more errors in the console.

I also got errors when building as the hooks were being imported from 'preact' instead of 'preact/hooks', did you also have this problem?
Once I separated the following in downshift.esm.js everyone worked as expected
import { useCallback, useReducer, useState, useEffect, useRef } from 'preact/hooks'; import { cloneElement, Component } from 'preact';

[ramzes81]

Yeap, I'm also getting these warnings about hooks.... Gonna update PR to resolve this issue too

[ramzes81]

As for errors, I'm pretty sure that my PR should fix them, because it fixed them for me. I'll double check my fix to ensure everything is fine
Thanks @Crushford

[ramzes81]

Hey @Crushford
I've updated the sandbox to play with this fix
fixedDownshift.js is just a copy from preact\dist\downshift.esm.js after I run build with my fix

What version of preact do you use? Maybe we are missing something here

[ramzes81]

Found this #808 PR. It contains conversation about preact hooks

[silviuaavram]

So where does this leave us? Sorry I did not follow the whole discussion.

[silviuaavram]

:tada: This issue has been resolved in version 5.2.7 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: