detect an EventCallback

[drma-tech]

I have the following situation

<EditForm Model="Variable" OnValidSubmit="OnValidSubmit">
</EditForm>

[Parameter]
public Variable Variable { get; set; } = new();
[Parameter]
public EventCallback Updated { get; set; }

protected async Task OnValidSubmit(EditContext context)
{
    try
    {
        //code
        await Updated.InvokeAsync();
    }
    catch (Exception ex)
    {
        ex.ProcessError(Toaster, Logger, context.Model);
    }
}

and the following test

Action UpdatedHandler = () => { };

var model = FakeData.GetVariable().Generate();

var cut = ctx.RenderComponent<VariableData>(parameters => parameters
    .Add(p => p.Updated, UpdatedHandler)
    .Add(p => p.Variable, model)
);

cut.FindByTag("form").Submit();

Assert.AreEqual(true, cut.Instance.Updated.HasDelegate);

I know I can have any attribute and fill it with a value and test it, but if I don't want to go that way.
is there a way to test if an event has fired? in this case Update event.

[egil]

Hi @drma-dev,

I would probably do something like this:

var handlerCalled = false;

var model = FakeData.GetVariable().Generate();

var cut = ctx.RenderComponent<VariableData>(parameters => parameters
    .Add(p => p.Updated, () => handlerCalled  = true)
    .Add(p => p.Variable, model)
);

cut.FindByTag("form").Submit();

Assert.AreEqual(true, handlerCalled);

[drma-tech]

thanks. but I have another question.

I'm trying to use the following code instead of form submit, but it's not working.

cut.FindByAttrValue("type", "submit").Click();

 public static IElement FindByAttrValue<T>(this IRenderedComponent<T> cut, string attr, string value) where T : IComponent
{
    return cut.Find($"[{attr}={value}]");
}

[egil]

What is not working?

[drma-tech]

the button that triggers the submit form does not work.

I saw someone talking about it in another post and they were recognizing that it didn't work anyway. that's when I started calling the form post.

[egil]

So are you getting any exceptions in your tests?

[drma-tech]

no error occurred. and the method is not executed.

[egil]

Please create a minimal example I can try out myself, that makes it much easier to help.

[drma-tech]

@egil

https://github.com/drma-dev/TestSubmit

sorry for the delay.

[egil]

Ahh, I see what's going on now.

The second test produces the following markup:

<span>Executed:</span>False
<form blazor:onsubmit="1">
    <input id="name" class="modified valid" value="ANY" blazor:onchange="5" />
    <button type="submit" blazor:onclick="2">Submit</button>
</form>

The problem is that when you click the button, the event handler for the button is triggered, but the form's submit event handler is not. That is actually how it works in the browser, so that is something I will need to look at if it is possible to do in bUnit as well.

bUnit does "bubble" event triggers, e.g. with <div blazor:onclick="1"><button blazor:onclick="2" /></div>, clicking the button will also trigger the onclick event handler on div.

For now, you need to trigger Submit on the form to get the test to work, as you do in the first test in your sample.

[egil]

Added an issue to add this functionality to bUnit: #563