Open bennettwork opened 4 years ago
render
produces a cheerio wrapper, which is exceedingly different from a mount/shallow wrapper, so inconsistencies are expected.
This change was actually an expected breaking change in v3, because cheerio doesn't provide any way i'm aware of to achieve the result you're looking for. A PR to make that happen would definitely be considered!
Yes, that was explained well in the docs. It is unfortunate that the Cheerio wrapper has an html()
method that has the same name as the Enzyme wrapper method but a different result (inner vs. outer HTML).
It's useful for render to return a Cheerio object as that allows us to utilise all of Cheerio's functionality. If I get time I will investigate wrapping this and adding an outerHtml()
method, something like:
outerHtml: function() { return this.wrap('<div></div>').parent().html(); }
Note that to add anything to a render
wrapper, it would have to be added to cheerio itself, not to enzyme.
Current behavior
render(...).html()
behaves counterintuitively and inconsistently with the otherhtml()
functions.mount(node).html()
andshallow(node).html()
will output the node's outer HTML (including root node), butrender(node).html()
will output only the inner HTML.Expected behavior
This could be resolved by doing one of the following:
Alter
render(node).html()
to output the node's outer HTML. (This would be a breaking change.render
could return a wrapper around the CheerioWrapper that wraps the node in a div before calling Cheerio'shtml()
)Add a method
render(node).outerHtml()
that outputs the node's outer HTML. (Again could be done with a wrapper.)Add a new static method, something like
outerHTML(wrapper)
, that would take a ReactWrapper, ShallowWrapper or CheerioWrapper and output the outer HTML consistently in all three cases.Your environment
API
Version
Adapter