search

bvaughn / react-devtools-experimental

Experimental rewrite of the React DevTools extension
https://react-devtools-experimental.now.sh
MIT License
965 stars 55 forks source link

feat: match HOC display names during search #360

Closed SavePointSam closed 5 years ago

SavePointSam commented 5 years ago

closes #299

Enables the user to use the component search capability against HOC display names.

SavePointSam commented 5 years ago

This feature seems like it would benefit from a couple of new tests 😄

I was wanting to add tests anyway. I’ll get on them. :D

After trying the feature, I also think that maybe some form of visual results highlighting is going to be important after all, to avoid confusion

Yeah, I felt the same about this. It’s certainly not clear why an element is being returned as a match.

Maybe something like below?

I like this a lot! Solves the problem I was hitting with trying to show the user the match is from a tag that was being truncated. I’d be happy to look into adding this as well.

SavePointSam commented 5 years ago

I've simplified the match logic and added/updated related tests. I can add the highlighting tonight or I can add it as a follow-up PR if you like.

bvaughn commented 5 years ago

One thing I notice now is that maybe we should special case HOCs like forward ref and memo so the search matches them too, because it seems a little weird that you can search for e.g. "withFoo" but not "Memo" when they look the same.

bvaughn commented 5 years ago

Thanks for contributing by the way! 😁

SavePointSam commented 5 years ago

it's going to need a little thought on how to most efficiently determine which part of the element (name, visible HOC name, or +number) to highlight

I would image there is just a preference system where the preferred match is the one that is surfaced. I would also suggest that we match on all so that the behavior of the system is very explicit, however that approach is slightly misleading as the actual match algorithm is preference based for quick matching. This is probably worth a ticket you can assign to me, if you like.

you can search for e.g. "withFoo" but not "Memo" when they look the same

Oh! This is a very good idea, probably worth a ticket if you want to assign it to me.

Thanks for contributing by the way!

My pleasure! I'm a big fan of this project. :D

bvaughn commented 5 years ago

Follow up work briefly detailed in #365