Add support for passing context about enzyme

[lelandrichardson]

@laurakelly context support is now available on enzyme v1.2.0

[bscherminator]

@lelandrichardson How does one mock getBoundingClientRect using the options?

[lelandrichardson]

I think this would be a great addition! The only remaining question is what the right API is.

I propose that we add a second argument to mount, shallow, and render which is simply an object named options in order to be most flexible with future changes.

options could have a context property that, if defined, would be passed in as context to the parent component.

const context = { router: mockReactRouter() };
const wrapper = shallow(<MyComponent />, { context });
// ...

cc @ljharb @goatslacker thoughts?

[blainekasten]

That is the same API, TestUtils.shallowRenderer().render uses. So I would second that and stay consist when possible. 👍

[lelandrichardson]

@blainekasten to be clear, I'm recommending that on object hash with a context prop be passed in as a second argument to shallow and the like, NOT that the context object itself be the second argument. The latter, I believe, is the current API for the shallowRenderer

[blainekasten]

My bad. Why that approach? What other keys would be used and why?
On Sun, Dec 6, 2015 at 3:04 PM Leland Richardson [email protected]
wrote:

@blainekasten https://github.com/blainekasten to be clear, I'm
recommending that on object hash with a context prop be passed in as a
second argument to shallow and the like, NOT that the context object
itself be the second argument. The latter, I believe, is the current API
for the shallowRenderer

—
Reply to this email directly or view it on GitHub
#49 (comment).

[lelandrichardson]

My thinking is that it allows other "options" be passed in as well in the future, rather than just having a bunch of arguments at random slots of the function signature.

One such thing we discussed internally was the ability to have an option for mount which indicated the node it mounts onto actually be attached to the document body:

const wrapper = mount(<Foo />, { attach: true });

Which could come in handy if you're wanting to test a component that uses DOM api's such as elem.getBoundingClientRect(); that require the DOM nodes be attached to a document.

[laurakelly]

@lelandrichardson Great, thank you! I'll try it out

[havenchyk]

@lelandrichardson well, it looks like {attach: true} doesn't work for me with getBoundingClientRect

[lelandrichardson]

@bscherminator what environment are you using getBoundingClientRect in?

getBoundingClientRect will always return a zero'd out rectangle if you're using jsdom. This will only work in something like karma with a browser runner