SelectExtendedTests.cs

#pragma warning disable CS1998 // async without await
#pragma warning disable IDE1006 // leading underscore
#pragma warning disable BL0005 // Set parameter outside component

using Bunit;
using MudExtensions.UnitTests.TestComponents;
using AwesomeAssertions;
using Microsoft.AspNetCore.Components.Web;
using MudExtensions;
using NUnit.Framework;
using static MudExtensions.UnitTests.TestComponents.SelectWithEnumTest;
using MudBlazor;
using MudExtensions.UnitTests.Extensions;
using MudBlazor.Extensions;

namespace MudExtensions.UnitTests.Components
{
    [TestFixture]
    public class SelectExtendedTests : BunitTest
    {
        /// <summary>
        /// Select id should propagate to label for attribute
        /// </summary>
        [Test]
        public void SelectLabelFor()
        {
            var comp = Context.Render<SelectRequiredTest>();
            var label = comp.FindAll(".mud-input-label");
            label[0].Attributes.GetNamedItem("for")?.Value.Should().Be("selectLabelTest");
        }

        // Note: MudSelect doesn't guaranteed the consequences of changing Value if MultiSelection is true for now.
        // When this feature will add, just uncomment the testcase to test it. No need to write new test.
        [Test]
        [TestCase(false)]
        //[TestCase(true)]
        public void Select_InitialValueTest(bool multiSelection)
        {
            var comp = Context.Render<SelectInitialValueTest>(x =>
            {
                x.Add(c => c.SelectedValue, "1");
                x.Add(c => c.MultiSelection, multiSelection);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();

            select.Instance.GetState(x => x.Value).Should().Be("1");
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "1" });
            select.Instance.GetState(x => x.Text).Should().Be("1");
        }

        // Note: MudSelect doesn't guaranteed the consequences of changing SelectedValues if MultiSelection is false for now.
        // When this feature will add, just uncomment the testcase to test it. No need to write new test.
        [Test]
        //[TestCase(false)]
        [TestCase(true)]
        public void Select_InitialValuesTest(bool multiSelection)
        {
            var comp = Context.Render<SelectInitialValueTest>(x =>
            {
                x.Add(c => c.SelectedValues, new HashSet<string>() { "1" });
                x.Add(c => c.MultiSelection, multiSelection);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();

            select.Instance.GetState(x => x.Value).Should().Be("1");
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "1" });
            select.Instance.GetState(x => x.Text).Should().Be("1");
        }

        [Test]
        public async Task Select_ValueBubblingTest()
        {
            var comp = Context.Render<SelectInitialValueTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>();

            select.Instance.GetState(x => x.Value).Should().BeNull();
            select.Instance.GetState(x => x.Text).Should().BeNull();

            comp.Render(p => p.Add(x => x.SelectedValue, "1"));
            await comp.InvokeAsync(() => select.Instance.ForceUpdate());
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "1" });
            select.Instance.GetState(x => x.Text).Should().Be("1");

            comp.Render(p => p.Add(x => x.SelectedValue, "2"));
            await comp.InvokeAsync(() => select.Instance.ForceUpdate());
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "2" });
            select.Instance.GetState(x => x.Text).Should().Be("2");
        }

        [Test]
        public void Select_ValueBubblingTest_MultiSelection()
        {
            var comp = Context.Render<SelectInitialValueTest>(x =>
            {
                x.Add(c => c.MultiSelection, true);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();

            select.Instance.GetState(x => x.Value).Should().BeNull();
            select.Instance.GetState(x => x.Text).Should().BeNullOrEmpty();

            comp.Render(p => p.Add(x => x.SelectedValues, new HashSet<string>() { "1" }));
            select.Instance.GetState(x => x.Value).Should().Be("1");
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "1" });
            select.Instance.GetState(x => x.Text).Should().Be("1");

            comp.Render(p => p.Add(x => x.SelectedValues, new HashSet<string>() { "2", "1" }));
            select.Instance.GetState(x => x.Value).Should().Be("1");
            select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "2", "1" });
            select.Instance.GetState(x => x.Text).Should().Be("2, 1");
        }

        [Test]
        public async Task Select_ValueChangeEventCountTest()
        {
            var comp = Context.Render<SelectEventCountTest>(x =>
            {
                x.Add(c => c.MultiSelection, false);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var input = comp.Find("div.mud-input-control");

            comp.Instance.ValueChangeCount.Should().Be(0);
            comp.Instance.ValuesChangeCount.Should().Be(0);

            await comp.InvokeAsync(() => select.Render(p => p.Add(x => x.Value, "1")));
            await comp.InvokeAsync(() => select.Instance.ForceUpdate());
            comp.WaitForAssertion(() => comp.Instance.ValueChangeCount.Should().Be(1));
            comp.Instance.ValuesChangeCount.Should().Be(1);
            select.Instance.GetState(x => x.Value).Should().Be("1");

            // Changing value programmatically without ForceUpdate should change value, but should not fire change events
            // Its by design, so this part can be change if design changes
            await comp.InvokeAsync(() => select.Render(p => p.Add(x => x.Value, "2")));
            comp.WaitForAssertion(() => comp.Instance.ValueChangeCount.Should().Be(1));
            comp.Instance.ValuesChangeCount.Should().Be(1);
            select.Instance.GetState(x => x.Value).Should().Be("2");
        }

        [Test]
        public async Task Select_ValueChangeEventCountTest_MultiSelection()
        {
            var comp = Context.Render<SelectEventCountTest>(x =>
            {
                x.Add(c => c.MultiSelection, true);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();

            comp.Instance.ValueChangeCount.Should().Be(0);
            comp.Instance.ValuesChangeCount.Should().Be(0);
            comp.Instance.ItemChangeCount.Should().Be(0);
            comp.Instance.ItemsChangeCount.Should().Be(0);

            await comp.InvokeAsync(() => select.Render(p => p.Add(x => x.SelectedValues, new HashSet<string>() { "1" })));
            comp.WaitForAssertion(() => comp.Instance.ValueChangeCount.Should().Be(1));
            comp.Instance.ValuesChangeCount.Should().Be(1);

            // Setting same value should not fire events
            await comp.InvokeAsync(() => select.Render(p => p.Add(x => x.SelectedValues, new HashSet<string>() { "1" })));
            comp.WaitForAssertion(() => comp.Instance.ValueChangeCount.Should().Be(1));
            comp.Instance.ValuesChangeCount.Should().Be(1);
        }

        /// <summary>
        /// Click should open the Menu and selecting a value should update the bindable value.
        /// </summary>
        [Test]
        public async Task SelectTest1()
        {
            var comp = Context.Render<SelectTest1>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check popover class
            menu.ClassList.Should().Contain("select-popover-class");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            input.Click();
            menu.ClassList.Should().Contain("mud-popover-open");
            // now click an item and see the value change
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            // menu should be closed now
            comp.WaitForAssertion(() => menu.ClassList.Should().NotContain("mud-popover-open"));
            select.Instance.GetState(x => x.Value).Should().Be("2");
            // now we cheat and click the list without opening the menu ;)

            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            items = comp.FindAll("div.mud-list-item-extended").ToArray();

            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            //Check user on blur implementation works
            var @switch = comp.FindComponent<MudSwitch<bool>>();
            @switch.Instance.Value = true;
            await comp.InvokeAsync(() => select.Instance.OnLostFocus(new FocusEventArgs()));
            comp.WaitForAssertion(() => @switch.Instance.GetState(x => x.Value).Should().Be(false));
        }

        /// <summary>
        /// Click should not close the menu and selecting multiple values should update the bindable value with a comma separated list.
        /// </summary>
        [Test]
        public async Task MultiSelectTest1()
        {
            //await ImproveChanceOfSuccess(async () =>
            //{
            var comp = Context.Render<MultiSelectTest1>();
            // print the generated html
            Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.WaitForAssertion(() =>
                comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            await comp.InvokeAsync(() => input.Click());
            comp.WaitForAssertion(() => menu.ClassList.Should().Contain("mud-popover-open"));
            // now click an item and see the value change
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            // menu should still be open now!!
            menu.ClassList.Should().Contain("mud-popover-open");
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2"));
            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 1"));
            items[2].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 1, 3"));
            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 3"));
            select.Instance.SelectedValues?.Count().Should().Be(2);
            select.Instance.SelectedValues.Should().Contain("2");
            select.Instance.SelectedValues.Should().Contain("3");
            //Console.WriteLine(comp.Markup);
            const string @unchecked =
                "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z";
            const string @checked =
                "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z";
            // check that the correct items are checked
            comp.WaitForAssertion(() =>
                comp.FindAll("div.mud-list-item-extended path")[1]?.Attributes["d"]?.Value.Should().Be(@unchecked));
            comp.FindAll("div.mud-list-item-extended path")[3]?.Attributes["d"]?.Value.Should().Be(@checked);
            comp.FindAll("div.mud-list-item-extended path")[5]?.Attributes["d"]?.Value.Should().Be(@checked);
            // now check how setting the SelectedValues makes items checked or unchecked
            // Note: If popover is open, selecting values programmatically doesn't work for now.
            await comp.InvokeAsync(() => select.Instance.CloseMenu());
            await comp.InvokeAsync(() =>
            {
                select.Instance.SelectedValues = new HashSet<string>() { "1", "2" };
            });
            await comp.InvokeAsync(() => input.Click());
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended path")[1]?.Attributes["d"]?.Value.Should().Be(@checked));
            comp.FindAll("div.mud-list-item-extended path")[3]?.Attributes["d"]?.Value.Should().Be(@checked);
            select.Instance.SelectedValues.Should().NotContain("3");
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended path")[5]?.Attributes["d"]?.Value.Should().Be(@unchecked));
            //Console.WriteLine(comp.Markup);
            //});
        }

        /// <summary>
        /// Initial Text should be enums default value
        /// Initial render fragment in input should be the pre-selected value's items's render fragment.
        /// After clicking the second item, the render fragment should update
        /// </summary>
        [Test]
        public async Task SelectWithEnumTest()
        {
            var comp = Context.Render<SelectWithEnumTest>();
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<MyEnum>>();
            var input = comp.Find("div.mud-input-control");

            select.Instance.GetState(x => x.Value).Should().Be(default(MyEnum));
            select.Instance.GetState(x => x.Text).Should().Be(default(MyEnum).ToString());

            comp.Find("input").Attributes["value"]?.Value.Should().Be("First");
            //comp.RenderCount.Should().Be(1);

            //Console.WriteLine(comp.Markup);
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            comp.WaitForAssertion(() => comp.Find("input").Attributes["value"]?.Value.Should().Be("Second"));
        }

        /// <summary>
        /// Initially we have a value of 17 which is not in the list. So we render it as text via MudInput
        /// </summary>
        [Test]
        public void SelectUnrepresentableValueTest()
        {
            var comp = Context.Render<SelectUnrepresentableValueTest>();
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<int>>();
            var input = comp.Find("div.mud-input-control");
            select.Instance.GetState(x => x.Value).Should().Be(17);
            select.Instance.GetState(x => x.Text).Should().Be("17");
            comp.Find("input").Attributes["value"]?.Value.Should().Be("17");
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].TextContent.Should().Be("Two");
            items[1].Click();
            //Console.WriteLine(comp.Markup);
            //comp.WaitForAssertion(() => comp.Find("div.mud-input-slot").TextContent.Trim().Should().Be("Two"));
            select.Instance.GetState(x => x.Value).Should().Be(2);
            select.Instance.GetState(x => x.Text).Should().Be("2");
        }

        /// <summary>
        /// Don't show initial value which is not in list because of Strict=true.
        /// </summary>
        [Test]
        public void SelectUnrepresentableValueTest2()
        {
            var comp = Context.Render<SelectUnrepresentableValueTest2>();
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<int>>();
            var input = comp.Find("div.mud-input-control");

            select.Instance.GetState(x => x.Value).Should().Be(17);
            select.Instance.GetState(x => x.Text).Should().Be("17");
            //await Task.Delay(100);
            // BUT: we have a select with Strict="true" so the Text will not be shown because it is not in the list of selectable values
            comp.FindComponent<MudInputExtended<string>>().Instance.GetState(x => x.Value).Should().Be(null);
            comp.FindComponent<MudInputExtended<string>>().Instance.InputType.Should().Be(InputType.Hidden);
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be(2));
            select.Instance.GetState(x => x.Text).Should().Be("2");
            //Console.WriteLine(comp.Markup);
            comp.FindComponent<MudInputExtended<string>>().Instance.GetState(x => x.Value).Should().Be("2");
            comp.FindComponent<MudInputExtended<string>>().Instance.InputType.Should().Be(InputType.Hidden); // because list item has no render fragment, so we show it as text
        }

        /// <summary>
        /// The items have no render fragments, so instead of RF the select must display the converted string value
        /// </summary>
        [Test]
        public void SelectWithoutItemPresentersTest()
        {
            var comp = Context.Render<SelectTextValueTest>();
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<bool?>>();
            var input = comp.Find("div.mud-input-control");

            select.Instance.GetState(x => x.Value).Should().BeTrue();
            select.Instance.GetState(x => x.Text).Should().Be("Open");
            //comp.Find("div.mud-input-slot").Attributes["style"].Value.Should().Contain("display:none");
            //comp.RenderCount.Should().Be(1);
            ////Console.WriteLine(comp.Markup);

            //Last item doesn't have text, so it should show value as text.
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[2].Click();
            //comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            //comp.WaitForAssertion(() => comp.Find("div.mud-input-slot").Attributes["style"].Value.Should().Contain("display:none"));
            select.Instance.GetState(x => x.Value).Should().BeFalse();
            select.Instance.GetState(x => x.Text).Should().Be("False");

            input.Click();
            items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[0].Click();
            select.Instance.GetState(x => x.Value).Should().BeNull();
            select.Instance.GetState(x => x.Text).Should().Be("Open and Closed");
        }

        [Test]
        public void Select_Should_FireTextChangedWithNewValue()
        {
            var comp = Context.Render<SelectTest1>();
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            string? text = null;
            select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.TextChanged, (Action<string>)(x => text = x)));
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            menu.ClassList.Should().Contain("mud-popover-open");
            // now click an item and see the value change
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            // menu should be closed now
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            select.Instance.GetState(x => x.Text).Should().Be("2");
            text.Should().Be("2");

            //open the menu again
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            items = comp.FindAll("div.mud-list-item-extended").ToArray();

            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            select.Instance.GetState(x => x.Text).Should().Be("1");
            text.Should().Be("1");
        }

        /// <summary>
        /// SingleSelect: SelectedValuesChanged should be fired before TextChanged
        /// We test this by checking the counter. The event which should be fired first must always
        /// find an even counter value, the second must always find an odd value.
        /// </summary>
        [Test]
        public void SingleSelect_Should_FireTextChangedBeforeSelectedValuesChanged()
        {
            var comp = Context.Render<SelectTest1>();
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            string? text = null;
            IEnumerable<string?>? selectedValues = null;
            var eventCounter = 0;
            var textChangedCount = 0;
            var selectedValuesChangedCount = 0;
            select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.TextChanged, (Action<string>)(x =>
            {
                textChangedCount = eventCounter++;
                text = x;
            })));
            select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.SelectedValuesChanged, (Action<IEnumerable<string>>)(x =>
            {
                selectedValuesChangedCount = eventCounter++;
                selectedValues = x;
            })));
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            menu.ClassList.Should().Contain("mud-popover-open");
            // now click an item and see the value change
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            // menu should be closed now
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            select.Instance.GetState(x => x.Text).Should().Be("2");
            text.Should().Be("2");
            selectedValuesChangedCount.Should().Be(1);
            textChangedCount.Should().Be(0);
            string.Join(",", selectedValues ?? new List<string>()).Should().Be("2");

            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            items = comp.FindAll("div.mud-list-item-extended").ToArray();

            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            select.Instance.GetState(x => x.Text).Should().Be("1");
            text.Should().Be("1");
            string.Join(",", selectedValues ?? new List<string>()).Should().Be("1");
            comp.WaitForAssertion(() => selectedValuesChangedCount.Should().Be(3));
            comp.WaitForAssertion(() => textChangedCount.Should().Be(2));
        }

        /// <summary>
        /// MultiSelect: SelectedValuesChanged should be fired before TextChanged
        /// We test this by checking the counter. The event which should be fired first must always
        /// find an even counter value, the second must always find an odd value.
        /// </summary>
        [Test]
        public void MultiSelect_Should_FireTextChangedBeforeSelectedValuesChanged()
        {
            var comp = Context.Render<SelectTest1>();
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            string? text = null;
            IEnumerable<string?>? selectedValues = null;
            var eventCounter = 0;
            var textChangedCount = 0;
            var selectedValuesChangedCount = 0;
            select.Render(p => p.Add(x => x.MultiSelection, true));
            select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.TextChanged, (Action<string>)(x =>
            {
                textChangedCount = eventCounter++;
                text = x;
            })));
            select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.SelectedValuesChanged, (Action<IEnumerable<string>>)(x =>
            {
                selectedValuesChangedCount = eventCounter++;
                selectedValues = x;
            })));

            var selectElement = comp.Find("div.mud-input-control");
            selectElement.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            // click list item
            items[1].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            select.Instance.GetState(x => x.Text).Should().Be("2");
            text.Should().Be("2");
            selectedValuesChangedCount.Should().Be(1);
            textChangedCount.Should().Be(0);
            string.Join(",", selectedValues ?? new List<string>()).Should().Be("2");
            // click another list item
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().BeEquivalentTo(new HashSet<string>() { "2", "1" }));
            select.Instance.GetState(x => x.Text).Should().Be("2, 1");
            text.Should().Be("2, 1");
            string.Join(",", selectedValues ?? new List<string>()).Should().Be("2,1");
            selectedValuesChangedCount.Should().Be(3);
            textChangedCount.Should().Be(2);
        }

        [Test]
        public async Task Select_Should_Not_FireOnBlur()
        {
            var comp = Context.Render<SelectTest1>();
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var eventCounter = 0;
            await select.SetParametersAndRenderAsync(parameters => parameters.Add(s => s.OnBlur, () => eventCounter++));
            await comp.InvokeAsync(async () =>
            {
                await select.Instance.OpenMenu();
                await select.Instance.CloseMenu();
            });
            eventCounter.Should().Be(0);
        }

        [Test]
        public void Disabled_SelectItem_Should_Be_Respected()
        {
            var comp = Context.Render<SelectTest1>();
            var select = comp.FindComponent<MudSelectExtended<string>>();
            //Console.WriteLine(comp.Markup);

            var selectElement = comp.Find("div.mud-input-control");
            selectElement.Click();

            // Disabled item found twice because we have 2 shadow lists. Need to be discussed later
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-disabled-extended").Count.Should().Be(2));
            comp.FindAll("div.mud-list-item-disabled-extended")[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().BeNull());
        }

        [Test]
        public async Task MultiSelect_ShouldCallValidationFunc()
        {
            //await ImproveChanceOfSuccess(async () =>
            //{
            var comp = Context.Render<MultiSelectTest1>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            IEnumerable<string?>? validatedValue = null;
            select.Render(p => p.Add(x => x.Validation,
                new Func<string, bool>(value =>
                {
                    validatedValue = select.Instance.SelectedValues;
                    return true;
                })));
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            select.Instance.SelectedValues.Should().BeNullOrEmpty();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            comp.WaitForAssertion(() => menu.ClassList.Should().Contain("mud-popover-open"));
            // now click an item and see the value change
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            await comp.InvokeAsync(() => items[1].Click());
            // menu should still be open now!!
            comp.WaitForAssertion(() => menu.ClassList.Should().Contain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2"));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().Contain("2"));
            validatedValue.Should().BeEquivalentTo(new HashSet<string>() { "2" });
            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 1"));
            validatedValue.Should().BeEquivalentTo(new HashSet<string>() { "2", "1" });
            items[2].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 1, 3"));
            validatedValue.Should().BeEquivalentTo(new HashSet<string>() { "2", "1", "3" });
            items[0].Click();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("2, 3"));
            validatedValue.Should().BeEquivalentTo(new HashSet<string>() { "2", "3" });
            //});
        }

        [Test]
        public void MultiSelect_SelectAll()
        {
            var comp = Context.Render<MultiSelectTest2>();
            // select element needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            IEnumerable<string?>? validatedValue = null;
            select.Render(p => p.Add(x => x.Validation,
                (object)new Func<string, bool>(value =>
                {
                    validatedValue = select.Instance.SelectedValues; // NOTE: select does only update the value for T string
                    return true;
                })));
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // Open the menu
            input.Click();
            menu.ClassList.Should().Contain("mud-popover-open");

            comp.FindAll("div.mud-list-item-extended")[0].Click();
            // validate the result. all items should be selected
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("FirstA^SecondA^ThirdA"));
            validatedValue.Should().BeEquivalentTo(new HashSet<string>() { "FirstA", "SecondA", "ThirdA"});
        }

        [Test]
        public void MultiSelect_SelectAll2()
        {
            var comp = Context.Render<MultiSelectTest3>();
            // select element needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // Open the menu
            input.Click();
            menu.ClassList.Should().Contain("mud-popover-open");

            // get the first (select all item) and check if it is indeterminate
            var selectAllItem = comp.FindComponent<MudListItemExtended<string>>();
            selectAllItem.Instance.Icon.Should().Be(Icons.Material.Filled.IndeterminateCheckBox);

            // Check that all normal select items are actually selected
            //var items = comp.FindComponents<MudSelectItem<string>>().Where(x=>x.Instance.HideContent==false).ToArray();

            //items.Should().HaveCount(7);
            //foreach (var item in items)
            //{
            //    item.Instance.IsSelected.Should().BeTrue();
            //    item.FindComponent<MudListItem<string>>().Instance.Icon.Should().Be("<path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/>");
            //}

            //// Check shadow items
            //var shadowItems = comp.FindComponents<MudSelectItem<string>>().Where(x => x.Instance.HideContent == true).ToArray();
            //foreach (var item in shadowItems)
            //{
            //    // shadow items don't render, their state is irrelevant, all they do is provide render fragments to the select
            //    Assert.Throws<Bunit.Rendering.ComponentNotFoundException>(() => item.FindComponent<MudListItem<string>>());
            //}
        }

        [Test]
        public void MultiSelect_SelectAll3()
        {
            var comp = Context.Render<MultiSelectTest4>();
            // select element needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // Open the menu
            input.Click();
            menu.ClassList.Should().Contain("mud-popover-open");
            // Check that the icon corresponds to an unchecked checkbox
            var mudListItem = comp.FindComponent<MudListItemExtended<string>>();
            mudListItem.Instance.Icon.Should().Be("<path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\"/>");
        }

        [Test]
        public void SingleSelect_Should_CallValidationFunc()
        {
            var comp = Context.Render<SelectTest1>();
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            string? validatedValue = null;
            select.Render(p => p.Add(x => x.Validation,
                (object)new Func<string, bool>(value =>
                {
                    validatedValue = value; // NOTE: select does only update the value for T string
                    return true;
                })));
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");
            // check initial state
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            // click and check if it has toggled the menu
            input.Click();
            menu.ClassList.Should().Contain("mud-popover-open");
            // now click an item and see the value change
            comp.WaitForAssertion(()=> comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));

            comp.FindAll("div.mud-list-item-extended")[1].Click();
            // menu should be closed now
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            select.Instance.GetState(x => x.Text).Should().Be("2");
            validatedValue.Should().Be("2");

            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            comp.FindAll("div.mud-list-item-extended")[0].Click();

            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            select.Instance.GetState(x => x.Text).Should().Be("1");
            validatedValue.Should().Be("1");
        }

        /// <summary>
        /// We filled the multiselect with initial selected values, that must
        /// show in the value of the input as a comma separated list of strings
        /// </summary>
        /// <returns></returns>
        [Test]
        public async Task MultiSelect_Initial_Values()
        {
            var comp = Context.Render<MultiSelectWithInitialValues>();
            // print the generated html
            //Console.WriteLine(comp.Markup);

            // select the input of the select
            var input = comp.Find("input");
            //the value of the input
            var value = input.Attributes.Where(a => a.LocalName == "value").First().Value;
            value.Should().Be("FirstA, SecondA");
        }

        [Test]
        public async Task MultiSelectTextTest()
        {
            var comp = Context.Render<MultiSelectTextTest>();
            var select = comp.FindComponent<MudSelectExtended<int?>>();

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter" }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            var selectItems = comp.FindAll("div.mud-list-item-extended");
            foreach (var item in selectItems)
            {
                item.Click();
            }

            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("Empty, One, 2, 3"));
        }

        /// <summary>
        /// We filled the multiselect with initial selected values.
        /// Then the returned text in the selection is customized.
        /// </summary>
        /// <returns></returns>
        [Test]
        public async Task MultiSelectCustomizedTextTest()
        {
            var comp = Context.Render<MultiSelectCustomizedTextTest>();

            // Select the input of the select
            var input = comp.Find("input");

            // The value of the input
            var value = input.Attributes.Where(a => a.LocalName == "value").First().Value;

            // Value is equal to the customized values returned by the method
            value.Should().Be("Selected values: FirstA, SecondA");
        }

        [Test]
        public async Task SelectClearableTest()
        {
            var comp = Context.Render<SelectClearableTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var input = comp.Find("div.mud-input-control");

            // No button when initialized
            comp.FindAll("button").Should().BeEmpty();

            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            // Button shows after selecting item
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            comp.Find("button").Should().NotBeNull();
            // Selection cleared and button removed after clicking clear button
            comp.Find("button").MouseDown();
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty());
            comp.FindAll("button").Should().BeEmpty();
            // Clear button click handler should have been invoked
            comp.Instance.ClearButtonClicked.Should().BeTrue();
        }

        /// <summary>
        /// Reselect an already selected value should not call SelectedValuesChanged event.
        /// </summary>
        [Test]
        public void SelectReselectTest()
        {
            var comp = Context.Render<ReselectValueTest>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var menu = comp.Find("div.mud-popover");
            var input = comp.Find("div.mud-input-control");

            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            select.Instance.GetState(x => x.Value).Should().Be("Apple");
            comp.Instance.ChangeCount.Should().Be(0);

            // now click an item and see the value change
            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();

            // menu should be closed now
            comp.WaitForAssertion(() => menu.ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Orange"));
            comp.Instance.ChangeCount.Should().Be(1);

            // now click an item and see the value change
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));
            items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();

            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Orange"));
            comp.Instance.ChangeCount.Should().Be(1);

        }

        #region DataAttribute validation
        //[Test]
        //public async Task TextField_Should_Validate_Data_Attribute_Fail()
        //{
        //    var comp = Context.Render<SelectValidationDataAttrTest>();
        //    //Console.WriteLine(comp.Markup);
        //    var selectcomp = comp.FindComponent<MudSelectExtended<string>>();
        //    var select = selectcomp.Instance;
        //    // Select invalid option
        //    await comp.InvokeAsync(() => select.SelectOption("Quux"));
        //    // check initial state
        //    select.GetState(x => x.Value).Should().Be("Quux");
        //    select.GetState(x => x.Text).Should().Be("Quux");
        //    // check validity
        //    await comp.InvokeAsync(() => select.ValidateAsync());
        //    select.ValidationErrors.Should().NotBeEmpty();
        //    select.ValidationErrors.Should().HaveCount(1);
        //    select.ValidationErrors[0].Should().Be("Should not be longer than 3");
        //}

        [Test]
        public async Task TextField_Should_Validate_Data_Attribute_Success()
        {
            var comp = Context.Render<SelectValidationDataAttrTest>();
            //Console.WriteLine(comp.Markup);
            var selectcomp = comp.FindComponent<MudSelectExtended<string>>();
            var select = selectcomp.Instance;
            // Select valid option
            await comp.InvokeAsync(() => select.SelectOption("Qux"));
            // check initial state
            select.GetState(x => x.Value).Should().Be("Qux");
            select.GetState(x => x.Text).Should().Be("Qux");
            // check validity
            await comp.InvokeAsync(() => select.ValidateAsync());
            select.ValidationErrors.Should().BeEmpty();
        }
        #endregion

        /// <summary>
        /// Tests the required property.
        /// </summary>
        [Test]
        public async Task Select_Should_SetRequiredTrue()
        {
            var comp = Context.Render<SelectRequiredTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>().Instance;
            select.Required.Should().BeTrue();
            await comp.InvokeAsync(() => select.ValidateAsync());
            select.ValidationErrors.First().Should().Be("Required");
        }

        /// <summary>
        /// Selected option should be hilighted when drop-down opens
        /// </summary>
        [Test]
        public async Task Select_Should_HilightSelectedValue()
        {
            var comp = Context.Render<SelectTest1>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string?>>();
            var input = comp.Find("div.mud-input-control");

            comp.Find("div.mud-popover").ClassList.Should().Contain("select-popover-class");
            select.Instance.GetState(x => x.Value).Should().BeNullOrEmpty();
            comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open");
            // open the select
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            // no option should be hilited
            comp.WaitForAssertion(() => comp.FindAll("div.mud-selected-item").Count.Should().Be(0));
            // now click an item and see the value change
            comp.FindAll("div.mud-list-item-extended")[1].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("2"));
            // open again and check hilited option
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            // Nr 2 should be hilited
            comp.WaitForAssertion(() => comp.FindAll("div.mud-selected-item").Count.Should().Be(1));
            comp.FindAll("div.mud-list-item-extended")[1].ToMarkup().Should().Contain("mud-selected-item");
            await comp.InvokeAsync(() => select.Instance.CloseMenu());
            //select.SetParam(nameof(MudSelectExtended<string?>.Value), null);
            select.Render(p => p.Add(x => x.Value, null));
            await comp.InvokeAsync(() => select.Instance.OpenMenu());
            // no option should be hilited
            comp.WaitForAssertion(() => comp.FindAll("div.mud-selected-item").Count.Should().Be(0));
        }

        /// <summary>
        /// Initially selected option should be hilighted when drop-down opens
        /// </summary>
        [Test]
        public void Select_Should_HilightInitiallySelectedValue()
        {
            var comp = Context.Render<SelectTest2>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            var select = comp.FindComponent<MudSelectExtended<string>>();
            comp.Find("div.mud-popover").ClassList.Should().Contain("select-popover-class");
            select.Instance.GetState(x => x.Value).Should().Be("2");
            comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open");
            // open the select
            comp.Find("div.mud-input-control").Click();
            //Console.WriteLine(comp.Markup);
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            // Nr 2 should be hilited
            comp.WaitForAssertion(() => comp.FindAll("div.mud-selected-item").Count.Should().Be(2));
            comp.FindAll("div.mud-list-item-extended")[1].ToMarkup().Should().Contain("mud-selected-item");
            // now click an item and see the value change
            comp.FindAll("div.mud-list-item-extended")[0].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("1"));
            // open again and check hilited option
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            // Nr 1 should be hilited
            comp.WaitForAssertion(() => comp.FindAll("div.mud-selected-item").Count.Should().Be(2));
            comp.FindAll("div.mud-list-item-extended")[0].ToMarkup().Should().Contain("mud-selected-item");
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
        }

        [Test]
        public async Task Select_Should_AllowReloadingItems()
        {
            var comp = Context.Render<ReloadSelectItemsTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>();
            // normal, without reloading
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[0].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("American Samoa"));
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[1].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Arizona"));
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[2].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Arkansas"));
            // reloading!
            comp.Find(".reload").Click();
            // check again, different values expected now
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[0].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Alabama"));
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[1].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("Alaska"));
            comp.Find("div.mud-input-control").Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.FindAll("div.mud-list-item-extended")[2].Click();
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Value).Should().Be("American Samoa"));
        }

        [Test]
        public async Task SelectTest_ToggleOpenCloseMenuMethods()
        {
            var comp = Context.Render<SelectTest1>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test

            var select = comp.FindComponent<MudSelectExtended<string>>();

            await comp.InvokeAsync(() => select.Instance.ToggleMenu());
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            select.Render(p => p.Add(x => x.Disabled, true));
            await comp.InvokeAsync(() => select.Instance.ToggleMenu());
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            //Try to add null item and check the value should not changed.
            await comp.InvokeAsync(() => select.Instance.Add(null));
            comp.WaitForAssertion(() => select.Instance._items.Count.Should().Be(4));

            select.Render(p => p.Add(x => x.Disabled, false));
            await comp.InvokeAsync(() => select.Instance.ToggleMenu());
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));

            select.Render(p => p.Add(x => x.Disabled, true));
            await comp.InvokeAsync(() => select.Instance.ToggleMenu());
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));

            await comp.InvokeAsync(() => select.Instance.OpenMenu());
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
        }

        [Test]
        public async Task SelectTest_KeyboardNavigation_SingleSelect()
        {
            var comp = Context.Render<SelectTest1>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>().Instance;

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Escape", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = " ", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            //If we didn't select an item with mouse or arrow keys yet, value should remains null.
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be(null));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", AltKey = true, Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowUp", AltKey = true, Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            //If dropdown is closed, arrow key should not set a value.
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be(null));
            // If no item is hiligted, enter should only close popover, not select any item and value
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "NumpadEnter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be(null));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowUp", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().BeNull());

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("2"));
            //End key should not select the last disabled item
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "End", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("3"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("3"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("3"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Home", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("1"));
            //Arrow up should select still the first item
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowUp", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("1"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "End", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("3"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "2", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("3"));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.GetState(x => x.Value).Should().Be("2"));
            comp.WaitForAssertion(() => select.SelectedValues.Should().HaveCount(1));

            await comp.InvokeAsync(() => select.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            //comp.Render(); // <-- this is necessary for reliable passing of the test
            // TODO: Look at this line why working manually and not working on test run.
            //comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
        }

        [Test]
        public async Task SelectTest_KeyboardNavigation_MultiSelect()
        {
            var comp = Context.Render<MultiSelectTest3>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // select elements needed for the test
            var select = comp.FindComponent<MudSelectExtended<string>>();

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = " ", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "a", CtrlKey = true, Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("7 felines have been selected"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "A", CtrlKey = true, Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("0 feline has been selected"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.GetState(x => x.Text).Should().Be("1 feline has been selected"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "A", CtrlKey = true, Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.GetState<string>("Text").Should().Be("7 felines have been selected"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Escape", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().NotContain("Tiger"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Home", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "NumpadEnter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().NotContain("Jaguar"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().NotContain("Leopard"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "End", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().Contain("Tiger"));

            select.Render(p => p.Add(x => x.Disabled, true));
            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().Contain("Tiger"));

            select.Render(p => p.Add(x => x.Disabled, false));
            //Test the keyup event
            await comp.InvokeAsync(() => select.Instance.HandleKeyUpAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keyup", }));
            comp.WaitForAssertion(() => select.Instance.SelectedValues.Should().Contain("Tiger"));

            await comp.InvokeAsync(() => select.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Tab", Type = "keydown", }));
            await comp.InvokeAsync(() => select.Instance.OnKeyUp.InvokeAsync(new KeyboardEventArgs() { Key = "Tab" }));
            comp.Render(); // <-- this is necessary for reliable passing of the test
            comp.WaitForAssertion(() => comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open"));
        }

        [Test]
        public async Task SelectTest_ItemlessSelect()
        {
            var comp = Context.Render<MudSelectExtended<string>>();

            // print the generated html
            //Console.WriteLine(comp.Markup);

            await comp.InvokeAsync(() => comp.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = " ", Type = "keydown", }));
            await comp.InvokeAsync(() => comp.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "ArrowDown", Type = "keydown", }));
            await comp.InvokeAsync(() => comp.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Home", Type = "keydown", }));
            await comp.InvokeAsync(() => comp.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "End", Type = "keydown", }));
            await comp.InvokeAsync(() => comp.Instance.HandleKeyDownAsync(new KeyboardEventArgs() { Key = "Enter", Type = "keydown", }));
            comp.WaitForAssertion(() => comp.Instance.SelectedValues.Should().HaveCount(0));
            comp.WaitForAssertion(() => comp.Instance.GetState(x => x.Value).Should().Be(null));
        }

        [Test]
        public void Select_OnCloseValueTest()
        {
            var comp = Context.Render<SelectOnCloseTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>();

            comp.Find("input").Click();
            comp.Find("div.mud-popover").ClassList.Should().Contain("mud-popover-open");

            var items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[1].Click();

            comp.Instance.Selected.Should().Be("Cafe Latte");
            comp.Instance.SelectedWhenOnClose.Should().Be("Cafe Latte");

            comp.Find("input").Click();
            items = comp.FindAll("div.mud-list-item-extended").ToArray();
            items[0].Click();
            comp.Instance.Selected.Should().Be("Cappuccino");
            comp.Instance.SelectedWhenOnClose.Should().Be("Cappuccino");
        }

        [Test]
        public void MultiSelectWithCustomComparerTest()
        {
            var comp = Context.Render<MultiSelectWithCustomComparerTest>();
            // print the generated html
            //Console.WriteLine(comp.Markup);
            // Click select button
            comp.Find("button").Click();
            // Check input text
            comp.Find("input").GetAttribute("value").Should().Be("Selected Cafe Latte, Selected Espresso");
            // Click to render the menu
            comp.Find("div.mud-input-control").Click();
            // Check check marks
            const string @unchecked =
                "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z";
            const string @checked =
                "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z";
            var icons = comp.FindAll("div.mud-list-item-extended path").ToArray();
            icons[1]?.Attributes["d"]?.Value.Should().Be(@unchecked);
            icons[3]?.Attributes["d"]?.Value.Should().Be(@checked);
            icons[5]?.Attributes["d"]?.Value.Should().Be(@checked);
            icons[7]?.Attributes["d"]?.Value.Should().Be(@unchecked);
        }

        [Test]
        public void Select_Item_Collection_Should_Match_Number_Of_Select_Options()
        {
            var comp = Context.Render<SelectTest1>();
            var sut = comp.FindComponent<MudSelectExtended<string>>();

            var input = comp.Find("div.mud-input-control");
            input.Click();
            comp.WaitForAssertion(() => comp.FindAll("div.mud-list-item-extended").Count.Should().BeGreaterThan(0));

            sut.Instance.Items.Should().HaveCountGreaterThanOrEqualTo(4);
        }

        // TODO: look at this test that failed after #164
        /// <summary>
        /// When MultiSelection and Required are True with no selected values, required validation should fail.
        /// </summary>
        //[Test]
        //public async Task MultiSelectWithRequiredValue()
        //{
        //    //1a. Check When SelectedItems is empty - Validation Should Fail
        //    //Check on String type
        //    var comp = Context.RenderComponent<MultiSelectTestRequiredValue>();
        //    var select = comp.FindComponent<MudSelectExtended<string>>().Instance;
        //    select.Required.Should().BeTrue();
        //    await comp.InvokeAsync(() => select.Validate());
        //    select.ValidationErrors.First().Should().Be("Required");

        //    //1b. Check on T type - MultiSelect of T(e.g. class object) 
        //    var selectWithT = comp.FindComponent<MudSelectExtended<MultiSelectTestRequiredValue.TestClass>>().Instance;
        //    selectWithT.Required.Should().BeTrue();
        //    await comp.InvokeAsync(() => selectWithT.Validate());
        //    selectWithT.ValidationErrors.First().Should().Be("Required");

        //    //2a. Now check when SelectedItems is greater than one - Validation Should Pass
        //    var inputs = comp.FindAll("div.mud-input-control");
        //    Console.WriteLine(comp.Markup);
        //    inputs[0].Click();//The 2nd one is the 
        //    var items = comp.FindAll("div.mud-list-item-extended").ToArray();
        //    items[1].Click();
        //    await comp.InvokeAsync(() => select.Validate());
        //    select.ValidationErrors.Count.Should().Be(0);
            
        //    //2b.
        //    inputs[1].Click();//selectWithT 
        //    //wait for render and it will find 5 items from the component (5 also with shadow list)
        //    comp.FindAll("div.mud-list-item-extended").Count.Should().Be(10);
        //    //comp.WaitForState(() => comp.FindAll("div.mud-list-item").Count == 5);
        //    items = comp.FindAll("div.mud-list-item-extended").ToArray();
        //    items[3].Click();
        //    await comp.InvokeAsync(() => selectWithT.Validate());
        //    selectWithT.ValidationErrors.Count.Should().Be(0);
        //}

        /// <summary>
        /// When MultiSelect attribute goes after SelectedValues, text should contain all selected values.
        /// </summary>
        [Test]
        public async Task MultiSelectAttributesOrder()
        {
            var comp = Context.Render<MultiSelectTest5>();
            var select = comp.FindComponent<MudSelectExtended<string>>().Instance;
            select.SelectedValues?.Count().Should().Be(2);
            select.GetState(x => x.Text).Should().Be("Programista, test");
            await comp.InvokeAsync(() =>
            {
                select.SelectedValues = new List<string> { "test" };
            });
            select.SelectedValues?.Count().Should().Be(1);
            select.GetState(x => x.Text).Should().Be("test");
        }

        [Test]
        public void Select_Should_NotOpen_WhenDisabled()
        {
            var comp = Context.Render<SelectTest1>(parameters =>
            {
                parameters.Add(p => p.Disabled, true);
            });
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var input = comp.Find("div.mud-input-control");

            // Try to open the select
            input.Click();
            // The menu should not open
            comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open");
        }

        [Test]
        public void Select_Should_NotOpen_WhenParentDisabled()
        {
            // Use a test component that wraps the select in a disabled parent
            var comp = Context.Render<DisabledParentSelectTest>();
            var select = comp.FindComponent<MudSelectExtended<string>>();
            var input = comp.Find("div.mud-input-control");

            // Try to open the select
            input.Click();
            // The menu should not open
            comp.Find("div.mud-popover").ClassList.Should().NotContain("mud-popover-open");
        }
    }
}