Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Jan 27 16:26
    SeanFeldman commented #611
  • Jan 27 12:16
    eshangin commented #612
  • Jan 27 09:40
    SeanFeldman closed #611
  • Jan 27 09:40
    SeanFeldman commented #611
  • Jan 27 09:39
    egil commented #612
  • Jan 27 09:37
    SeanFeldman commented #611
  • Jan 27 09:26
    eshangin commented #612
  • Jan 27 09:18
    egil closed #613
  • Jan 27 09:06
    egil commented #612
  • Jan 27 09:04
    dnfadmin commented #613
  • Jan 27 09:04
    bUnitBot review_requested #613
  • Jan 27 09:03
    bUnitBot opened #613
  • Jan 27 09:01
    egil closed #612
  • Jan 27 09:01
    egil commented #612
  • Jan 27 08:42
    egil commented #611
  • Jan 27 07:45
    SeanFeldman commented #611
  • Jan 27 07:34
    eshangin opened #612
  • Jan 27 07:12
    SeanFeldman edited #611
  • Jan 27 06:47
    SeanFeldman opened #611
  • Jan 26 09:27
    egil commented #609
gismofx
@gismofx
here's my component razor
<MudGrid>
    <MudItem xs="12" sm="4">
        <MudAutocomplete T="string" Label="US States" @bind-Value="ActiveStringHolder.StringValue" SearchFunc="@Search1" 
                         ResetValueOnEmptyText="@resetValueOnEmptyText" 
                         CoerceText="@coerceText" CoerceValue="@coerceValue"/>
    </MudItem>
    <MudItem xs="12" sm="4">
        <MudButton OnClick="(()=>ToggleValue())" Variant="Variant.Outlined">Toggle Value</MudButton>
    </MudItem>
    <MudItem xs="12" md="12" class="flex-column">
        <MudSwitch @bind-Checked="resetValueOnEmptyText" Color="Color.Primary">Reset Value on empty Text</MudSwitch>
        <MudSwitch @bind-Checked="coerceText" Color="Color.Secondary">Coerce Text to Value</MudSwitch>
        <MudSwitch @bind-Checked="coerceValue" Color="Color.Tertiary">Coerce Value to Text (if not found)</MudSwitch>
    </MudItem>
</MudGrid>
I'm changing the value of @bind-Value="ActiveStringHolder.StringValue" via the UI
so it should update the object
gismofx
@gismofx
Pressing the toggle button switches ActiveStringHolder's value
The display will update correctly. If the user changes the StringValue, it should update ActiveStringHolder and update the display
Egil Hansen
@egilhansen:matrix.org
[m]
Ok. are you a maintainer of mud blazor?
gismofx
@gismofx
@egilhansen:matrix.org a contributor :)
justin-feist
@justin-feist
Ok all, I am trying to write bUnit tests using razor files. Test Explorer (VS 2019) sees my "MessageCenter_RendersPage" test, but when it goes to actually execute I get a "No test matches the given testcase filter....." error in the Output window. The test is seen...but not really. I'm missing something, just not exactly sure what.
image.png
5 replies
gismofx
@gismofx
@egilhansen:matrix.org I'm trying more Vanilla approach. I am invoking a button click, but it does not seem to re-render as if I was really using the UI
        public async Task Autocomplete_ChangeBoundValue()
        {
            var comp = Context.RenderComponent<AutocompleteChangeBoundObjectTest>();
            Console.WriteLine(comp.Markup);
            var autocompletecomp = comp.FindComponent<MudAutocomplete<string>>();
            var autocomplete = autocompletecomp.Instance;
            autocompletecomp.SetParametersAndRender(parameters => parameters.Add(p=> p.DebounceInterval, 0));
            autocompletecomp.SetParametersAndRender(parameters => parameters.Add(p => p.CoerceText, true));
            // check initial state
            autocomplete.Value.Should().Be("Florida");
            autocomplete.Text.Should().Be("Florida");
            comp.WaitForAssertion(() => autocompletecomp.Find("input").GetAttribute("value").Should().Be("Florida"));//redundant?
            //Get the button to toggle the value
            var buttonElement = comp.Find("button");
            await comp.InvokeAsync(() => buttonElement.Click());
            autocomplete.Value.Should().Be("Georgia");
            autocomplete.Text.Should().Be("Georgia");
            comp.WaitForAssertion(() => autocompletecomp.Find("input").GetAttribute("value").Should().Be("Georgia"));//redundant?
            //Change the value of the current bound value component
            //insert "Calif"
            autocompletecomp.Find("input").Input("Alabam");
            await Task.Delay(100);
            var args = new KeyboardEventArgs();
            args.Key = "Enter";

            //press Enter key
            autocompletecomp.Find("input").KeyUp(args);

            //The value of the input should be California
            comp.WaitForAssertion(() => autocompletecomp.Find("input").GetAttribute("value").Should().Be("Alabama"));

            autocomplete.Value.Should().Be("Alabama");
            autocomplete.Text.Should().Be("Alabama");
            //Change the bound object
            var markup1 = autocompletecomp.Markup;
            await comp.InvokeAsync(()=> buttonElement.Click());
            //await comp.InvokeAsync(() => comp.Render());
            autocomplete.Value.Should().Be("Florida"); //pass
            autocomplete.Text.Should().Be("Florida"); //fail
            comp.WaitForAssertion(() => autocompletecomp.Find("input").GetAttribute("value").Should().Be("Florida"));//breaks here:
            var markup2 = autocompletecomp.Markup;
            autocomplete.Value.Should().Be("Florida");
            //autocomplete.Text.Should().Be("Florida");

            //Change the bound object back and check again.
            //await buttonComp.InvokeAsync(() => button.OnClick.InvokeAsync());
            await comp.InvokeAsync(() => buttonElement.Click());
            var t1 = autocompletecomp.Find("input").GetAttribute("value");
            var t2 = autocompletecomp.Find("input").GetAttribute("text");
            autocomplete.Value.Should().Be("Alabama");
            autocomplete.Text.Should().Be("Alabama");
        }
how-to-bunit.gif
gismofx
@gismofx
After the string value is changed via the UI and then toggled via the button, the value and text should change. Seems to work via the UI, but not via the test.
(Side note, it would be really cool if you could "record" a test. like the user interacts with the UI, then out spits some bunit api code to write a test with)
Egil Hansen
@egilhansen:matrix.org
[m]
@gismofx: I dont mind helping, but I need a minimal reproducable example that I can download and play with to help. If you can, create a QA in the dicsussion forum on GitHub.
gismofx
@gismofx
@egilhansen:matrix.org thanks! I'll put one together.
Egil Hansen
@egilhansen:matrix.org
[m]
🙂
Brett McDonald
@bfmsoft
[Fact]
public void RendersCorrectly() {
    using var ctx = new TestContext();

    var rc = ctx.RenderComponent<EditForm>(
        @<EditForm Model="TestData" >
            <DataAnnotationsValidator />
            <EnumInputSelect Id="TestCountryId"
                @bind-Value="TestData.TestCountry" @bind-Value:event="ValueChanged" />
            <ValidationSummary></ValidationSummary>
        </EditForm>
    );

    rc.MarkupMatches(
        @<form >
            <select id="TestCountryId" class="valid" value="0" >
                <option value="128">Default</option>
                <option value="129">UnitedStates</option>
            </select>
        </form>
    );

    rc.Find("#TestCountryId").Change("129");
    rc.Render();
    rc.MarkupMatches(
        @<form >
            <select id="TestCountryId" class="valid" value="129" >
                <option value="128">Default</option>
                <option value="129">UnitedStates</option>
            </select>
        </form>
    );
}
I am trying to test a component that basically is a fancy Select. I want to test the returned (for default). Then select on option and then test that is has changed. I feel I am close but The RenderComponent doesn't work? Is there a sample to look at?
SQL-MisterMagoo
@SQL-MisterMagoo
@bfmsoft I don't think RenderComponent<T> takes a RenderFragment like that - you probably just want Render(@<...your markup>)
Egil Hansen
@egilhansen:matrix.org
[m]
@SQL-MisterMagoo is correct :)
I choose to just call that method Render since you simple pass in a RenderFragment that you want if to render.
Egil Hansen
@egilhansen:matrix.org
[m]
I admit that Render<TCom>(RenderFragment) might confuse things. That is added as a shorthand for Render(@<MyComp...). FindComponent<MyComp>(). You use it when you need an IRenderedComponent instead of an IRenderedFragment that Render gives you. RenderComponent always return an IRenderedComponent.
Ps. An IRenderedComponent inherit from IRenderedFragment.
Brett McDonald
@bfmsoft
OK, my problem is if I used Render it returns RenderedFragment. I want to call Render later to rerender the component to reflect the Change (if you look at the fragment). Am I doing the process wrong? I would love a sample or something.
Egil Hansen
@egilhansen:matrix.org
[m]
See my comment above Brett
SQL-MisterMagoo
@SQL-MisterMagoo
oh that's nice! there's so much I have to learn still about bUnit, but I like to learn, so that's good
gismofx
@gismofx
@egilhansen:matrix.org I'm having trouble making a minimal example, but the complete example is on my repo https://github.com/gismofx/MudBlazor/blob/77dd2c1d2ee12d868982a20795f59754f4eecfa4/src/MudBlazor.UnitTests/Components/AutocompleteTests.cs#L607
4 replies
Egil Hansen
@egilhansen:matrix.org
[m]
Ok, I'll see if I can get some time to look at this tomorrow. Mind just creating a QA in the bunit discussion forum so i don't forget. It's almost midnight here in Iceland so I'm off to bed
gismofx
@gismofx
ah! get sleep :) Thanks! I actually made a few changes in my local copy that I just pushed to my repo. I will make a post in bunit repo.
goodnight
Egil Hansen
@egilhansen:matrix.org
[m]
Great. And thank!
Egil Hansen
@egilhansen:matrix.org
[m]
hey friends, i'm live streaming some bUnit enhancement work right now. Come join at twitch.tv/egilhansen if you want to help out :)
Manuel Zelenka
@dev-in-disguise
Hey everyone!
Quick question regarding the nuget packages. Right now bunit and bunit.web are basically the same. Therefore the question in one of my projects arose: which of those nuget packages should we use when? Or rather: what was the reasoning behind having a bunit and a bunit.web package?
1 reply
Andrzej Bakun
@Andrzej2_gitlab
Hi guys! I think I have a weird problem. When I test a component that has await element.FocusAsync(), the code never continues. I am not really interested in catching focus event, but I don't understand why it gets stuck there and never continues. For net3.1 I have a JSInterop.SetupVoid("myfocusevent", _ => true).SetVoidResult() but I cannot find anywhere how to handle FocusAsync().
2 replies
Egil Hansen
@egilhansen:matrix.org
[m]
Ok, there should be focusasync support builtin, but it does require you are using bunit's JSInterop and not injecting your own IJSRuntime
Andrzej Bakun
@Andrzej2_gitlab
I am using built in JSInterop. I also saw the link you posted. From what I can tell, this will help me to evaluate if FocusAsync() was called, but this is not what interests me. Unless the fact that I add the validation will also cause bUnit to register that js call?
Egil Hansen
@egilhansen:matrix.org
[m]
If you just want the focus async call to work, just don't set anything up.
Andrzej Bakun
@Andrzej2_gitlab

Anyway, I tried. It didn't work. But informed me that Bunit.JSInvokeCountExpectedException : VerifyInvoke failed: "Blazor._internal.domWrapper.focus" was not called the expected number of times.. So I added this line:

JSInterop.SetupVoid("Blazor._internal.domWrapper.focus", _ => true).SetVoidResult();

Solved my problem. But this is not intended, right?

Egil Hansen
@egilhansen:matrix.org
[m]
What blazor version?
Andrzej Bakun
@Andrzej2_gitlab
net6 rc1
Egil Hansen
@egilhansen:matrix.org
[m]
Hmm so that setupvoid call should already be added by default, so you should not need to do so. Only reason I can see it not working is if MS has changed the JS function being called
Can you share your entire test?
Andrzej Bakun
@Andrzej2_gitlab
Sure. Mind that this is work in progress, I hope to get rid of some of the await Task.Delay.
@using AntDesign.Core.JsInterop.Modules.Components
@inherits AntDesignTestBase
@code {
    public Select_Tags_Tests()
    {
        JSInterop.Setup<AntDesign.JsInterop.DomRect>(JSInteropConstants.GetBoundingClientRect, _ => true)
            .SetResult(new AntDesign.JsInterop.DomRect());                     
        JSInterop.Setup<HtmlElement>(JSInteropConstants.GetDomInfo, _ => true)
            .SetResult(new HtmlElement());
        JSInterop.SetupVoid(JSInteropConstants.AddPreventKeys, _ => true);        
        JSInterop.SetupVoid(JSInteropConstants.AddElementTo, _ => true);        
        #if !NET6_0_OR_GREATER
        JSInterop.SetupVoid(JSInteropConstants.Focus, _ => true).SetVoidResult();
        #else
        JSInterop.SetupVoid("Blazor._internal.domWrapper.focus", _ => true).SetVoidResult();
        #endif        
    }

    [Fact]
    public async Task Single_tag_creation() //issue #1645
    {
        //Arrange

        JSInterop.Setup<OverlayPosition>(JSInteropConstants.OverlayComponentHelper.AddOverlayToContainer, _ => true)
            .SetResult(new OverlayPosition() { Top = 0, Left = 0, ZIndex = 5000, Placement = Placement.BottomLeft });               


        var cut = Render<AntDesign.Select<string, string>>(
        @<AntDesign.Select Mode="tags"
            TItemValue="string"
            TItem="string"        
            EnableSearch>
            <SelectOptions>                        
                <SelectOption TItemValue="string" TItem="string" Value="@("1")" Label="1" />            
            </SelectOptions>
    </AntDesign.Select>
    );
        //Act
        //overlay.
        var input = cut.Find("input.ant-select-selection-search-input");        

        input.Input("A"); //await element.FocusAsync() is called by Select here
        cut.WaitForState(() => cut.Instance.ActiveOption is not null);        


        await Task.Delay(100);
        input.KeyUp("ENTER");
        await Task.Delay(1);
        input.Input("B");
        await Task.Delay(1);
        input.KeyUp("ENTER");
        await Task.Delay(1);
        input.Input("C");
        await Task.Delay(1);
        input.KeyUp("ENTER");
        await Task.Delay(1);
        var addedTags = cut.FindAll("span.ant-select-selection-item-content")
            .Where(d => d.TextContent.Trim() == "B");
        //Assert
        addedTags.Should().HaveCount(1);
    }
}
input.Input("A") - await element.FocusAsync() is called by Select here
this test is passing in net5 & in net6 if I manually do the JSInterop.SetupVoid("Blazor._internal.domWrapper.focus", _ => true).SetVoidResult()
Egil Hansen
@egilhansen:matrix.org
[m]
Hmm that weird. You should not need that for .net 6
Andrzej Bakun
@Andrzej2_gitlab
Yeah, I thought so. I am being a bit of a nuisance today :smirk: