Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mocking components in render tree #53

Closed
egil opened this issue Feb 4, 2020 · 1 comment · Fixed by #400
Closed

Mocking components in render tree #53

egil opened this issue Feb 4, 2020 · 1 comment · Fixed by #400
Labels
enhancement New feature or request help wanted Extra attention is needed

Comments

@egil
Copy link
Member

egil commented Feb 4, 2020

Hard to arrange tests
The issue #52 and #38 is an example of a test that is hard to "arrange" because a sub-component of the component under test, employs a lot of JSInterop to do its work. It could also be a 3rd party component that is used in the component under test, that has a dependency on a service, that the test would have to provide a mock of to get a test to work as expected.

Describe the solution you'd like
It would be nice to be able to mock out the sub-component that has external dependencies that is not important to the test. That would make the test much easier to arrange, being able to mock or replace a sub-component in a render tree.

It is not clear if it will be possible to mock or replace a component. A few problems I see:

  1. Components are normally regular (partial) classes. Those are not easy to mock by tools such as Moq.
  2. To properly mock a component, it would have to be replaced/mocked before the component is instantiated by the Renderer, through a RenderTreeBuilder.OpenComponent(). It is possible that the same trick we have discussed in Enable shallow rendering mode #17 could be repurposed, iff it is possible to create a mocked instance of the component.

Additional context
This could be related to #17.

@egil egil added enhancement New feature or request help wanted Extra attention is needed labels Feb 4, 2020
@egil egil added the backlog Enhancements which are relevant but not a priority at the moment. label May 6, 2020
@egil
Copy link
Member Author

egil commented Jun 5, 2020

Based on experience from #17, it seems clear that to enable mocking/faking of components, we need to hook into the render pipeline and have a custom RenderTreeBuilder, that when its OpenComponent method is called, does something different.

We can actually replace the component with something completely different, e.g. a dedicated FakeComponent, which will receive any parameters passed to it through the SetParametersAsync method on it. That will allow us to create a component that can capture all parameters passed to the original component, and allow the test user to verify the right parameters are passed, and to even invoke EventCallback or modify the parameters.

The challenge, as noted in #17, seems to be that the parts of the rendering pipeline in Blazor is either sealed or internal, requiring us to copy a lot of source code files from the aspnetcore repo to modify and get the functionality we need.

@egil egil added this to the v1.0.0 milestone Jul 29, 2020
@egil egil added needs .net 5 and removed backlog Enhancements which are relevant but not a priority at the moment. labels Aug 15, 2020
@egil egil removed this from the v1.0.0 milestone Mar 18, 2021
@egil egil linked a pull request May 21, 2021 that will close this issue
9 tasks
@egil egil closed this as completed in #400 May 21, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request help wanted Extra attention is needed
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant