Visit React elements of all types while walking the tree

[beauroberts]

Hello! Firstly, thanks so much for writing and maintaining such an awesome tool. It's been a great help to me.

I've been using this library outside of the context of SSR to walk the React tree while working on some Storybook and documentation utilities. I was wondering if you'd be willing to consider allowing the visitor function to be executed on all types of React nodes, rather than just those with type UserElement.

In my scenario I have a number of React.forwardRef-wrapped components and I'd like to be able to identify them when walking the tree. For example:

import React from 'react';
import ssrPrepass from 'react-ssr-prepass';

const ForwardRefComponent = React.forwardRef((props, ref) => <div {...props} ref={ref} />);
const App = () => <ForwardRefComponent />;

let foundElement;
ssrPrepass(<App />, elem => {
  if (elem.type === ForwardRefComponent) {
    foundElement = elem;
  }
});

console.log(foundElement)
// undefined

In the case above, react-ssr-prepass's visitElement walks over the React.forwardRef-wrapped element and visits some internal React element, whose type is unknown to me.

My proposal would be able to pass some options as a third argument to ssrPrepass that would allow it to be able to visit all elements, not just those of type UserElement.

I'm planning to submit a PR and would be grateful for any feedback you have!

[kitten]

Hiya, sorry for the late reply! 👋

I don't think we'd want to merge this, because the current scope of the project is very server-side rendering focused. I'd advise you to maybe maintain a fork for now, but since this library is very much optimised for server-side (yields to avoid main-thread hogging, optimised for speed instead of size) it probably doesn't lend itself well right now to making a nice walker/visitor API.

[beauroberts]

Thanks for the response!