Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Jan 15 11:27
    egil labeled #303
  • Jan 15 11:27
    egil assigned #303
  • Jan 15 11:27
    egil review_requested #303
  • Jan 15 10:30
    ventigrande synchronize #303
  • Jan 15 10:30
    ventigrande opened #303
  • Jan 13 16:57
    egil closed #302
  • Jan 13 16:57
    egil commented #302
  • Jan 13 09:26
    sattyamkishormishra opened #302
  • Jan 09 12:08
    egil edited #300
  • Jan 09 12:08
    egil labeled #300
  • Jan 09 12:08
    egil labeled #300
  • Jan 09 12:08
    egil opened #300
  • Jan 08 10:02
    egil closed #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
  • Jan 08 10:01
    egil edited #299
Egil Hansen
@egil
Hi @paevans87, is your cascading parameter named or unnamed?
The easiest, if you dont want to think about it, is to use the builder pattern to pass parameters, e.g.:
ctx.RenderComponent<Toast>(ps => ps.Add(p => p.ParameterName, myValue));
paevans87
@paevans87

Hi @paevans87, is your cascading parameter named or unnamed?

I haven't come across this post! I suspect that'll have all the info to get me up & running, thanks!

Egil Hansen
@egil
Hopefully, there is lots of documentation on that site :)
Forex Ray
@forex.ray.v1_gitlab
hello everyone, I'm new here... Let me start by saying Hello from England :)
is there a good working example of bUnit using Async web pages? I have a simple project which loads data base from database. when i test it with bUnit all is see is "loading"... and it is completing testing before data is loaded. so its a sync call. how can i make it async call... so bUnit waits for the page to completely load the data and then triggers test?
or a link to youtube video demoing the async funtionality for bUnit?
would like a working example and i will be able to figure it out from there
any such link available?
Egil Hansen
@egil
Welcome @forex.ray.v1_gitlab to the community
Its a common scenario. You can look at https://bunit.egilhansen.com/docs/interaction/awaiting-async-state.html and https://bunit.egilhansen.com/docs/verification/async-assertion.html for general input on handling async/delayed rendering of the component under test
Are you loading data from a real data source in your tests, or are you mocking your data source?
Forex Ray
@forex.ray.v1_gitlab
hello @egil , we are loading the real data from the APIs and it's not a mock. That's why there is time delay in the data load.
Egil Hansen
@egil
Then you can use WaitForState(() => cut.FindAll("css selector for element that should show up").Count > 1)
Forex Ray
@forex.ray.v1_gitlab
ah ok. let me try that. Thanks @egil
Egil Hansen
@egil
Ohh forgot to mention, if you need more than 1 second of wait time, you can change that by passing a second parameter to WaitForState, e.g. WaitForState(() => ...., TimeSpan.FromSeconds(xx))
camelCaseSharp
@camelCaseSharp
I am thinking about using bunit to write BDD style tests, these typically involve writing longer UI scenarios than a TDD style unit test. Is is possible for a single bunit cut to navigate between two routable Blazor components (also known as pages)?
Egil Hansen
@egil
Hi @camelCaseSharp
I think so, but I am not sure I exactly understand what you are trying to do.
bUnit doesnt look at the @page directive in components though, so the navigation step will have to be manual.
That said, there is nothing preventing you from calling var page1 = RenderCompoent<Page1>() and var page2 = RenderComponent<Page2>() in the same test class.
And you can pass in the same state to both components. You can even pre-register a cascading value that both should receive through the TestContext.RenderTree, if that is how you share state.
Egil Hansen
@egil

That said, there is nothing preventing you from calling var page1 = RenderCompoent<Page1>() and var page2 = RenderComponent<Page2>() in the same test class.

Correction, IN THE SAME TEST METHOD. You can call RenderComponent as many times as you want within the same test.

camelCaseSharp
@camelCaseSharp
Thanks for the feedback Egil. I was thinking about creating some BDD business test scenarios such as "When I want to pay out approved insurance claims, I first click on 'Pending Claims' in the application dashboard, then select the first approved claim listed then on the summary claim screen click the 'Issue Payment' button.". In a typical LOB Blazor app that scenario might traverse across 3 top level routable components. I gather from your first response that the Blazor navigation manager and location changed events are not hooked into the scope of a CUT?
Egil Hansen
@egil
not by default
But if you want to use navigation manager, you simply register one through the Services collection
I havent tried writing tests where the default blazor router is included, but that might work. you are certainly the first to ask though :)
camelCaseSharp
@camelCaseSharp
Ok thanks @egil I will start using bunit more simply to begin with then experiment with unit tests that navigate across pages.
Egil Hansen
@egil
I recommend starting with just testing individual components. Thats where bUnit execelles. But I am very interested in learning more about your scenario. Feel free to create a QA in the https://github.com/egil/bUnit/discussions. Its a much better place to share code samples and keep track of a discussion.
camelCaseSharp
@camelCaseSharp
Is it possible to create a bunit test that checks for an expected UI update that should occur in response to a data update applied to a Fluxor state store? In this scenario I assume my Blazor component under test is bound to data in the Fluxor state store created as part of the test.
Egil Hansen
@egil
I dont see a problem with that. The only challange might be that the data arrives asynchronously, and thus you might need to use cut.WaitForAssertion(() => /* assertion goes here */) since the test code runs in one thread and the component and renderer in another, to avoid deadlocks.
How is the Fluxor state store made available to the component?
camelCaseSharp
@camelCaseSharp
According to the Fluxor docs the state store is injected as a private property. Yes I was anticipating the need to use cut.WaitForAssertion after reading your replies 13th Nov to @forex.ray.v1_gitlab and how to handle the delay when a unit test makes a live async remote request for data. Your recent presentation with Microsoft available on YouTube was very helpful particularly that bunit architectural slide, now I can picture where the threads run during a unit test.
Egil Hansen
@egil
great, never got to demo waitforassertion though
but glad it helped
Is it injected with DI or is it a cascading value?
Eitherway, you will want a way to control that in your tests. If you can set the data in the store before your render your component, then its likely that the renderer will render the component synchronously and you wont need to use waitforxxx
control it, as have a way to set data in it.
Anyway, when you get it working, do post a sample in the discussions forum under the show and tell category. Will likely be very useful to others.
camelCaseSharp
@camelCaseSharp
The injection is through DI.
[Inject]
private IState<CounterState> CounterState { get; set; }  https://github.com/mrpmorris/Fluxor/blob/master/Tutorials/02-Blazor/02A-StateActionsReducersTutorial/README.md
Egil Hansen
@egil
Ahh its @mrpmorris thats behind that.
Anyway, it does seem like you can just mock or even better, create fake of IState, and then in your test, write Services.AddSingleton<IState<CounterState>>(new FakeState(....))
Peter Morris
@mrpmorris
Yes, and yes :)
PS: @camelCaseSharp -> https://gitter.im/mrpmorris/fluxor
If you are interested
aschaefer94
@aschaefer94
Hi Egil. I'm writing some tests and running into an issue with context menus. Our solution is using a nuget package (Blazor.ContextMenu v.1.8.0) for context menus in our app. It seems like they may be using the HTML 'oncontextmenu' event rather than the blazor '@oncontextmenu' event, would that make it so that the Element.ContextMenu() call in BUnit can't find the event?
Egil Hansen
@egil
hi @aschaefer94, it sounds as if they are listening to that event through javascript. Since bUnit doesnt run javascript, you cannot trigger their javascript code.