Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • May 08 17:08
    egil synchronize #391
  • May 08 17:08
    egil edited #391
  • May 08 17:08
    egil edited #391
  • May 08 17:08
    egil edited #391
  • May 08 17:08
    egil edited #391
  • May 08 17:08
    egil edited #391
  • May 08 17:08
    egil edited #391
  • May 08 17:07
    egil edited #391
  • May 08 17:07
    egil edited #391
  • May 08 17:07
    egil edited #391
  • May 08 17:07
    egil opened #391
  • May 08 17:02
    egil edited #388
  • May 08 17:01
    egil edited #388
  • May 07 11:33
    egil commented #388
  • May 07 08:29
    mrpmorris commented #388
  • May 06 19:34
    egil commented #388
  • May 06 18:48
    mrpmorris commented #388
  • May 06 12:19
    egil edited #388
  • May 05 20:15
    KristofferStrube commented #388
  • May 05 20:07
    egil commented #388
Egil Hansen
@egil
Thanks @alecrisan, appreciate the effort.
I wonder, do you prefer that way of passing parameters?
I am actually thinking about deprecating it just supporting the builder method.
E.g.:
        IRenderedComponent<Dialog> cut = RenderComponent<Dialog>(ps => ps.Add(p => p.HeaderTitle, headerName));
Its not as visual, but its type safe and refactor safe by default
Alexandra Bianca Crisan
@alecrisan
Honestly I don't have a preference, if the second way feels more safe I say you go for it
Egil Hansen
@egil
The second is more safe, since it force you to pass in something that you can assign to the property you have selected using the parameter selector, and will give you a compiler error if you change the parameter type and forget to update the test.
That said, the tuple passing approach, ("HeaderTitle", headerName), can be more terse.
kp577
@kp577
Hi @egil
I want to cover a scenario in test cases, it can be like to validate that 2 way data binding is working perfectly
Say I have a Model class with a property FirstName. (It is not a parameter type) and i have used InputText to to bind data in razor component.
For this i want to write a test case. When i load component it loads as expected, but i am struck on a point on how to update this FirstName text type value inside test the case.
Do we have a option to change the value of the input type based on the id in the test cases?
Egil Hansen
@egil
Hi @kp577, Im not sure I follow exactly what you are saying. Can you share a minimal example of the component under test and your test method?
kp577
@kp577
@egil Actually I am not so sure to how to start my test case
I have a add employee page with some input text fields, save and cancel buttons
when I render this component in test case all the input fields will be empty, I want to check save button functionality. so ideally before calling on click for save button in the test case I want to fill those input fields.. but I don't understand how to change the values of input fields inside test cases
Egil Hansen
@egil
ok.
So @kp577 there are helpers for that. A good guess is that cut.Find("input-field css selector").Change("NEW VALUE"); works
kp577
@kp577
Tq that helped
Patrick Swayc
@therubble_twitter
Hi, Does anyone have an example for testing a component that's inside an EditForm?
I've tried .AddCascadingValue("EditContext", new EditContext(model)) but it never seems to be set
Patrick Swayc
@therubble_twitter
I'm current getting
System.InvalidOperationException
Microsoft.AspNetCore.Components.Forms.InputNumber`1[System.Decimal] requires a cascading parameter of type EditContext
Egil Hansen
@egil

hi @therubble_twitter, I cant remember, but I think the EditForm provides a context, so you just need to give it a model. Something like thus (warning, untested code):

// using the new RenderTree option in beta 11 (https://bunit.egilhansen.com/docs/providing-input/root-render-tree.html)
using var ctx = new TestContext();
ctx.RenderTree.Add<EditForm>(ps => ps.Add(p => p.Model, myModel));
var cut  = ctx.RenderComponent<MyComponent>();

or

using var ctx = new TestContext();
var cut = ctx.RenderComponent<EditForm>(ps => ps
    .Add(p => p.Model, myModel)
    .AddChildContent<MyComponent>()
);
Patrick Swayc
@therubble_twitter
Hi @egil - I'd already tried the 2 example you'd given me and get the following exception
Unable to set property 'ChildContent' on object of type 'Microsoft.AspNetCore.Components.Forms.EditForm'.
The component I'm trying to test looks like :
@{
    if (ChildContent != null)
    {
        @ChildContent(Model)
    }
    else
    {
        <!-- Output a placeholder -->        
        <div>
            <InputNumber @bind-Value="Model.BindableValue" disabled="@Model.ReadOnly"></InputNumber>
            <ValidationMessage For="@(() => Model.BindableValue)"></ValidationMessage>
            <SourceSystemMessages Model="Model.SourceSystemMessages"></SourceSystemMessages>
        </div>
    }
}

@code{

    [Parameter]
    public virtual RenderFragment<Core.DecimalValue> ChildContent { get; set; }

    [Parameter]
    public virtual Core.DecimalValue Model { get; set; }
}
Egil Hansen
@egil
Ahh @therubble_twitter, I think its because ChildContent of EditForm is of type RenderFragment<T>
In that case, I think the easiest approach is to use razor based testing (if you are using xUnit) ... https://bunit.egilhansen.com/docs/getting-started/writing-razor-tests.html
Egil Hansen
@egil
@therubble_twitter Otherwise, this might work, although we are getting to the limit of what the c# only builder syntax can do:
            var cut = RenderComponent<EditForm>(ps => ps
                .Add<MyForm, EditContext>(p => p.ChildContent, ctx => myformParams => myformParams.Add(x => x.Model, ctx.Model))
            );
Havent testet, but it should work.
Patrick Swayc
@therubble_twitter
I'll give it a whirl
You happy for me to update the bunit docs with this info if it works?
I want to build up a set of how-to guides at some point in the docs, but for now it would be awesome if you could add your example to https://github.com/egil/bUnit/discussions?discussions_q=category%3A%22Show+and+tell%22
E.g. with a title such as "How to render component inside an EditForm".
Egil Hansen
@egil
Or whatever you thing :)
Patrick Swayc
@therubble_twitter
Will do, let me get this up and running first
Egil Hansen
@egil
Forgot to add that you also have to pass a model to the EditForm's parameters, e.g.:
var cut = RenderComponent<EditForm>(ps => ps
    .Add(p => p.Model, myModelInstance)
    .Add<MyForm, EditContext>(p => p.ChildContent, ctx => myformParams => myformParams.Add(x => x.Model, ctx.Model))
);
Jochem de Kruijf
@jochem4207
Hi all, hows it going :)?
Egil Hansen
@egil
busy busy, how are you?
Jochem de Kruijf
@jochem4207
Lost my touch and energy for a few days but picking up soon! Energy is back. Busy as always with work. Just started reading trailblazer (book from the Salesforce CEO)
Egil Hansen
@egil
Good, my energi level is more or less controlled by how my kids sleep these days :)
Jochem de Kruijf
@jochem4207
Haha i see, ive many fathers as coworkers. You know a little bit of alcohol or sleep medicine hahah #shitty tips
Egil Hansen
@egil
for the kids or the parents?
What I've learned is the small kids dont care about your hangovers, they wake up at 6am anyway, so I prefer not to have them any more :)
Jochem de Kruijf
@jochem4207
Hahah for the kids
Oof. 6 am on a hangover. Idk if the hangover already started by then or its still the drunk phase
Egil Hansen
@egil
:)
paevans87
@paevans87

Hey all - hoping someone is able to help out with an issue I'm having writing some tests. I have a cascading parameter that takes some services from DI. I'm trying to create tests for my child component and pass in the CascadingValue which from what I've read seems like it should be as simple as:

var cut = ctx.RenderComponent<Toast>(ComponentParameter.CreateCascadingValue("ParameterName", myValue)

In my situation here myValue is a `Mock<ParentComponent>' but whenever I debug the test the value is null so it's not picking it up

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?