-
-
Notifications
You must be signed in to change notification settings - Fork 96
Add support for mixed rendering #50
New issue
Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? # to your account
base: main
Are you sure you want to change the base?
Conversation
Mixed rendering is a mode that works like shallow rendering, but where you can specify a list of components you want to render even tho they are deeply nested.
src/index.js
Outdated
nodeName = getComponentName(nodeName); | ||
if (opts.shallow && | ||
(inner || opts.renderRootComponent===false) && | ||
!opts.alwaysRenderedComponents.includes(componentName)) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Needs to use indexOf()!==-1
because this lib supports IE9+.
src/index.js
Outdated
* @param {Array} alwaysRenderedComponents List of components that should be rendered with shallow rendering | ||
* @param {Object} [context={}] Optionally pass an initial context object through the render path. | ||
*/ | ||
let mixedRender = (vnode, alwaysRenderedComponents = [], context) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This file is size-constrained - would it be alright to add the alwaysRenderedComponents
option, but not export another method (mixedRender
)? That would keep things reasonably minimal.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Sure! I'll update the PR.
@developit I've updated the PR, but kept the unit tests in a separate file. Do you want me to move them as well? |
Hi @Saegrov! Sorry for the delay - happy to have the unit tests in their own file. I think this should be good to merge, just need to check the file size. |
Mixed rendering is a mode that works like shallow rendering, but where
you can specify a list of components you want to render even tho they
are deeply nested.
We have a use case where we are using shallow rendering and Cheerio for unit testing our Preact components. We are using a redux-connect like higher order component to connect some components to our global state.
When testing a component, that uses another component that is wrapped in a HOC, the shallow renderer stops at the HOC.
With mixed rendering we can white list components we want to render and test that the wrapped components are used correctly.