Hi, I wondered how you would test an event handler from the Presenter. Suppose there is an handleClick in Presenter that has some logic inside of it, and the result is a modified state.
I would avoid having the presenter provide DOM event handlers, or state modifiers.
The reason for the first case is that you would essentially make the DOM a dependency of the presenter, and it shouldn't be; it's just a function that transforms props and serves as a facade pattern over the components it's composing.
For the second, even if you provide a new set of photos, the state of those photos is kept outside of this presenter and the presenter is only given the list of photos, therefore it cannot meaningfully affect the photos being passed to the component without risking it going out of sync with the rest of the application.
In this case, you might want to look into Hooks, as the presenter isn't meant to be stateful, just a pure transformation function over the props being passed to it.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hi, I wondered how you would test an event handler from the Presenter. Suppose there is an handleClick in Presenter that has some logic inside of it, and the result is a modified state.
export const photoListPresenter = ({ photos = [] }) => ({
photos,
isListEmpty: photos.length == 0,
Empty: EmptyList,
List: PhotoList,
handleClick: (e, oldPhotos) => {...do some logics and return newPhotos}
});
How can I test the logic of the handleClick method properly?
I would avoid having the presenter provide DOM event handlers, or state modifiers.
The reason for the first case is that you would essentially make the DOM a dependency of the presenter, and it shouldn't be; it's just a function that transforms props and serves as a facade pattern over the components it's composing.
For the second, even if you provide a new set of photos, the state of those photos is kept outside of this presenter and the presenter is only given the list of photos, therefore it cannot meaningfully affect the
photos
being passed to the component without risking it going out of sync with the rest of the application.In this case, you might want to look into Hooks, as the presenter isn't meant to be stateful, just a pure transformation function over the props being passed to it.