Bunit.JSRuntimeUnhandledInvocationException : The invocation of 'blazorise.button.initialize' with arguments ... was not expected.

[jjones-ucpm]

Describe the bug or question
First off, thank for this wonderful tool. It's a pleasure to use. That said I am getting an exception that I think may be a result of a bug. I only see this exception in tests written with Razor syntax. When I use the Button component from the Blazorise v0.9.1.2 Nuget package in any of my own components, the tests all throw the exception in the title of this bug report.

Example:
Testing this component:

@* 
 * FakeComponent.razor 
 * Note: It doesn't matter if I add parameter values, the end result is the same.
 *@

@using Blazorise

<Button>A Button</Button>

With this test (In an XUnit test project running .NET 5.0):

<SnapshotTest Description="FakeComponent_SnapshotTest_ShouldRender" Setup="@SnapshotTestSetup">
    <TestInput>
        <FakeComponent />
    </TestInput>

    <ExpectedOutput>
        <button type:ignore class:ignore style:ignore id:ignore>A Button</button>
    </ExpectedOutput>
</SnapshotTest>

<Fixture Test="FakeComponent_FixtureTest_ShouldRender" Setup="@FixtureSetup">
    <ComponentUnderTest>
        <FakeComponent />
    </ComponentUnderTest>
</Fixture>

@code
{
        static void FixtureSetup(Fixture test)
        {
            test.Services
                .AddBlazorise(options =>
                {
                    options.ChangeTextOnKeyPress = true;
                })
                .AddBootstrapProviders()
                .AddFontAwesomeIcons();

            test.Services
                .UseBootstrapProviders()
                .UseFontAwesomeIcons();
        }

        static void SnapshotTestSetup(SnapshotTest test)
        {
            test.Services
                .AddBlazorise(options =>
                {
                    options.ChangeTextOnKeyPress = true;
                })
                .AddBootstrapProviders()
                .AddFontAwesomeIcons();

            test.Services
                .UseBootstrapProviders()
                .UseFontAwesomeIcons();
        }

        static void FakeComponent_FixtureTest_ShouldRender(Fixture test)
        {
            var cut = test.GetComponentUnderTest<FakeComponent>();
            cut.MarkupMatches("<button type:ignore class:ignore style:ignore id:ignore>A Button</button>");
        }
}

Results in this output:

  Failed FakeComponent_SnapshotTest_ShouldRender [271 ms]
  Error Message:
   Bunit.JSRuntimeUnhandledInvocationException : The invocation of 'blazorise.button.initialize' with arguments [Microsoft.AspNetCore.Components.ElementReference, 0HM5V41PGNN39, False] was not expected.
  Stack Trace:
     at Bunit.JSInterop.BunitJSRuntime.TryHandlePlannedInvocation[TValue](JSRuntimeInvocation invocation) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 50
   at Bunit.JSInterop.BunitJSRuntime.InvokeAsync[TValue](String identifier, CancellationToken cancellationToken, Object[] args) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 31
   at Bunit.JSInterop.BunitJSRuntime.InvokeAsync[TValue](String identifier, Object[] args) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 22
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync[TValue](IJSRuntime jsRuntime, String identifier, Object[] args)
   at Blazorise.JSRunner.InitializeButton(ElementReference elementRef, String elementId, Boolean preventDefaultSubmit)
   at Blazorise.Button.<OnInitialized>b__9_0()
   at Blazorise.BaseComponent.OnAfterRenderAsync(Boolean firstRender)
   at Bunit.Rendering.TestRenderer.AssertNoUnhandledExceptions() in /_/src/bunit.core/Rendering/TestRenderer.cs:line 276
   at Bunit.Rendering.TestRenderer.Render[TResult](RenderFragment renderFragment, Func`2 activator) in /_/src/bunit.core/Rendering/TestRenderer.cs:line 164
   at Bunit.Rendering.TestRenderer.RenderFragment(RenderFragment renderFragment) in /_/src/bunit.core/Rendering/TestRenderer.cs:line 38
   at Bunit.Extensions.TestContextExtensions.RenderInsideRenderTree(TestContextBase testContext, RenderFragment renderFragment) in /_/src/bunit.web/Extensions/TestContextExtensions.cs:line 45
   at Bunit.SnapshotTest.Run() in /_/src/bunit.web/RazorTesting/SnapshotTest.cs:line 68
   at Bunit.RazorTesting.RazorTestBase.RunTest() in /_/src/bunit.core/RazorTesting/RazorTestBase.cs:line 51
--- End of stack trace from previous location ---
  Failed FakeComponent_FixtureTest_ShouldRender [2 ms]
  Error Message:
   Bunit.JSRuntimeUnhandledInvocationException : The invocation of 'blazorise.button.initialize' with arguments [Microsoft.AspNetCore.Components.ElementReference, 0HM5V41PGNN3B, False] was not expected.
  Stack Trace:
     at Bunit.JSInterop.BunitJSRuntime.TryHandlePlannedInvocation[TValue](JSRuntimeInvocation invocation) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 50
   at Bunit.JSInterop.BunitJSRuntime.InvokeAsync[TValue](String identifier, CancellationToken cancellationToken, Object[] args) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 31
   at Bunit.JSInterop.BunitJSRuntime.InvokeAsync[TValue](String identifier, Object[] args) in /_/src/bunit.web/JSInterop/Implementation/BunitJSRuntime.cs:line 22
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeAsync[TValue](IJSRuntime jsRuntime, String identifier, Object[] args)
   at Blazorise.JSRunner.InitializeButton(ElementReference elementRef, String elementId, Boolean preventDefaultSubmit)
   at Blazorise.Button.<OnInitialized>b__9_0()
   at Blazorise.BaseComponent.OnAfterRenderAsync(Boolean firstRender)
   at Bunit.Rendering.TestRenderer.AssertNoUnhandledExceptions() in /_/src/bunit.core/Rendering/TestRenderer.cs:line 276
   at Bunit.Rendering.TestRenderer.Render[TResult](RenderFragment renderFragment, Func`2 activator) in /_/src/bunit.core/Rendering/TestRenderer.cs:line 164
   at Bunit.Rendering.TestRenderer.RenderFragment(RenderFragment renderFragment) in /_/src/bunit.core/Rendering/TestRenderer.cs:line 38
   at Bunit.Extensions.TestContextExtensions.RenderInsideRenderTree[TComponent](TestContextBase testContext, RenderFragment renderFragment) in /_/src/bunit.web/Extensions/TestContextExtensions.cs:line 20
   at Bunit.Fixture.Factory[TComponent](RenderFragment fragment) in /_/src/bunit.web/RazorTesting/Fixture.cs:line 141
   at Bunit.Fixture.GetOrRenderFragment(String id, Func`2 fragmentSelector, Func`2 renderedFragmentFactory) in /_/src/bunit.web/RazorTesting/Fixture.cs:line 118
   at Bunit.Fixture.GetComponentUnderTest[TComponent]() in /_/src/bunit.web/RazorTesting/Fixture.cs:line 64
   at WebClientTestX.Components.FakeComponentTestsBase.FakeComponent_FixtureTest_ShouldRender(Fixture test) in C:\path\to\FakeComponentTests.razor.cs:line ##
   at Bunit.RazorTesting.RazorTestBase.TryRun[T](Action`1 action, T input) in /_/src/bunit.core/RazorTesting/RazorTestBase.cs:line 93
   at Bunit.RazorTesting.FixtureBase`1.Run(TFixture self) in /_/src/bunit.core/RazorTesting/FixtureBase.cs:line 83
   at Bunit.RazorTesting.RazorTestBase.RunTest() in /_/src/bunit.core/RazorTesting/RazorTestBase.cs:line 51
--- End of stack trace from previous location ---

Whereas this test (In an MSTest project running .NET Core 3.1):

using Bunit;
using Microsoft.VisualStudio.TestTools.UnitTesting;

namespace EcoSystem.WebClientTest.Components
{
    [TestClass]
    public class FakeComponentTests : BunitTestContext
    {
        [TestMethod]
        public void FakeComponent_CSharpTest_ShouldRender()
        {
            // This is using the BunitTestContext class specified here: https://bunit.egilhansen.com/docs/getting-started/writing-csharp-tests.html#remove-boilerplate-code-from-tests
            var cut = RenderComponent<FakeComponent>();
            cut.MarkupMatches("<button type:ignore class:ignore style:ignore id:ignore>Change Password</button>");
        }
    }
}

Results in this output:

Passed!  - Failed:     0, Passed:     1, Skipped:     0, Total:     1, Duration: 418 ms

Expected behavior:
It would be nice to get a passing test when using Razor Syntax, just as I do when using C# syntax for the same component and an equivalent test.

Version info:

• Library version for tests written in Razor Syntax: bunit.web v1.0.0-preview-01
• TargetFramework for tests written in Razor Syntax: net5.0
• Library version for tests written in C#: bunit.web v1.0.0-beta-11
• TargetFramework for tests written in C#: netcoreapp3.1

[egil]

Hi @jjones-ucpm

Ill just give a quick answer before heading to bed, excuse the brevity on this one.

The short answer is, that it is not a bug. Preview 1 has JSinterop enabled by default and set to strict mode. See https://github.com/egil/bUnit/releases/tag/v1.0.0-preview-01 for details.

To fix it. try setting test.JSInterop.Mode = JSRuntimeMode.Loose in your setup methods.

Ps. preview 01 is also compatible with netcoreapp3.1, so feel free to use the same version everywhere.

[jjones-ucpm]

That did indeed do the trick! Thank you, @egil!