Blazor自定义单选组件的bUnit测试问题：触发值变更失败

问题背景 #

你用InputRadioGroup和InputRadio实现了模拟复选框的Blazor自定义组件，实际运行正常，但编写bUnit测试时，直接点击单选按钮元素抛出无点击处理器异常，调用.Change()也无法触发值更新。

核心原因 #

Blazor的InputRadio组件搭配Bootstrap的btn-check类时，实际用户交互是点击关联的<label>元素（而非隐藏的<input>本身），且bUnit对InputRadio的事件触发有特定要求，直接操作input元素无法正确触发组件的绑定更新。

解决方法 #

方法1：点击关联的Label元素

如果你的组件代码里有和InputRadio配对的<label>（Bootstrap btn-check必须搭配label才能正常交互），比如：

<InputRadio class="btn-check" Id="@this.NameYes" Name="@fieldIdentifier.FieldName" Value=1 />
<label class="btn btn-secondary" for="@this.NameYes">是</label>

<InputRadio class="btn-check" Id="@this.NameNo" Name="@fieldIdentifier.FieldName" Value=0 />
<label class="btn btn-secondary" for="@this.NameNo">否</label>

测试时直接找到对应的label元素点击即可：

// Act
sut.Find($"label[for='{sut.Instance.NameYes}']").Click();

// Assert
model.IsTrue.Should().BeTrue();

方法2：直接触发InputRadio的Change事件并传入对应值

如果不想依赖label元素，可直接获取InputRadio对应的input元素，触发Change事件并传入匹配类型的Value值：

// Act
var yesRadio = sut.Find($"#{sut.Instance.NameYes}");
yesRadio.Change(new ChangeEventArgs { Value = 1 });

// Assert
model.IsTrue.Should().BeTrue();

注意：传入的Value类型必须和组件中RadioValue的类型一致（比如RadioValue是int就传1，是string就传"1"）。

额外检查：组件绑定逻辑

确保组件内RadioValue和模型属性的双向绑定逻辑正确，比如：

[Parameter]
public bool IsTrue { get; set; }

[Parameter]
public EventCallback<bool> IsTrueChanged { get; set; }

private int RadioValue
{
    get => IsTrue ? 1 : 0;
    set
    {
        var newValue = value == 1;
        if (IsTrue != newValue)
        {
            IsTrue = newValue;
            IsTrueChanged.InvokeAsync(IsTrue);
        }
    }
}

只有正确实现EventCallback，模型值才能在组件更新时同步。

内容的提问来源于stack exchange，提问作者Neil