Skip to content

Commit d93d0fb

Browse files
majorimimajorimi
authored
Merge pull request #106 from majorimi/fix/typeahead-events
Comment out double events
2 parents e480b08 + 223ce03 commit d93d0fb

File tree

7 files changed

+203
-54
lines changed

7 files changed

+203
-54
lines changed

‎src/Majorsoft.Blazor.Components.TestApps.Common/Components/Typeahead.razor‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -486,7 +486,15 @@ textarea {
486486
{
487487
_testData = JsonSerializer.Deserialize<StatesWithFlags[]>(jsonData);
488488
}
489-
489+
490+
//protected override async Task OnAfterRenderAsync(bool firstRender)
491+
//{
492+
// if(firstRender)
493+
// {
494+
// _input.SelectedItem = "Texas";
495+
// }
496+
//}
497+
490498
//TypeaheadInput
491499
private string _typeaheadInputValue = "";
492500
private string _selectedItem;
@@ -507,7 +515,7 @@ textarea {
507515
private async Task SelectedItemChanged(string text)
508516
{
509517
_selectedItem = text;
510-
await WriteEventLog("TypeaheadInput: Selected item changed");
518+
await WriteEventLog($"TypeaheadInput: Selected item changed, value: {text}");
511519
}
512520
private async Task WriteEventLog(string message)
513521
{

‎src/Majorsoft.Blazor.Components.Typeahead.Tests/TypeaheadInputTest.cs‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
using Majorsoft.Blazor.Components.Common.JsInterop.Click;
2+
using Majorsoft.Blazor.Components.Debounce;
3+
4+
using Microsoft.Extensions.DependencyInjection;
5+
using Microsoft.Extensions.Logging;
6+
using Microsoft.VisualStudio.TestTools.UnitTesting;
7+
8+
using Moq;
9+
using Majorsoft.Blazor.Components.CommonTestsBase;
10+
using Bunit;
11+
using Majorsoft.Blazor.Components.Timer;
12+
using Majorsoft.Blazor.Components.Common.JsInterop.ElementInfo;
13+
using System.Text.Json;
14+
using System.Linq;
15+
using System.Threading.Tasks;
16+
using Microsoft.AspNetCore.Components.Web;
17+
18+
namespace Majorsoft.Blazor.Components.Typeahead.Tests
19+
{
20+
[TestClass]
21+
public class TypeaheadInputTest : ComponentsTestBase<TypeaheadInput<string>>
22+
{
23+
private Mock<IClickBoundariesHandler> _clickBoundariesMock;
24+
private BunitJSModuleInterop _jsInteropModul;
25+
26+
private class StatesWithFlags
27+
{
28+
public string Name { get; set; }
29+
public string Flag { get; set; }
30+
}
31+
private static StatesWithFlags[] _testData = null;
32+
private const string JsonData = "[{\"Name\":\"Alabama\",\"Flag\":\"5/5c/Flag_of_Alabama.svg/45px-Flag_of_Alabama.svg.png\"},{\"Name\":\"Alaska\",\"Flag\":\"e/e6/Flag_of_Alaska.svg/43px-Flag_of_Alaska.svg.png\"},{\"Name\":\"Arizona\",\"Flag\":\"9/9d/Flag_of_Arizona.svg/45px-Flag_of_Arizona.svg.png\"},{\"Name\":\"Arkansas\",\"Flag\":\"9/9d/Flag_of_Arkansas.svg/45px-Flag_of_Arkansas.svg.png\"},{\"Name\":\"California\",\"Flag\":\"0/01/Flag_of_California.svg/45px-Flag_of_California.svg.png\"},{\"Name\":\"Colorado\",\"Flag\":\"4/46/Flag_of_Colorado.svg/45px-Flag_of_Colorado.svg.png\"},{\"Name\":\"Connecticut\",\"Flag\":\"9/96/Flag_of_Connecticut.svg/39px-Flag_of_Connecticut.svg.png\"},{\"Name\":\"Delaware\",\"Flag\":\"c/c6/Flag_of_Delaware.svg/45px-Flag_of_Delaware.svg.png\"},{\"Name\":\"Florida\",\"Flag\":\"f/f7/Flag_of_Florida.svg/45px-Flag_of_Florida.svg.png\"},{\"Name\":\"Georgia\",\"Flag\":\"5/54/Flag_of_Georgia_%28U.S._state%29.svg/46px-Flag_of_Georgia_%28U.S._state%29.svg.png\"},{\"Name\":\"Hawaii\",\"Flag\":\"e/ef/Flag_of_Hawaii.svg/46px-Flag_of_Hawaii.svg.png\"},{\"Name\":\"Idaho\",\"Flag\":\"a/a4/Flag_of_Idaho.svg/38px-Flag_of_Idaho.svg.png\"},{\"Name\":\"Illinois\",\"Flag\":\"0/01/Flag_of_Illinois.svg/46px-Flag_of_Illinois.svg.png\"},{\"Name\":\"Indiana\",\"Flag\":\"a/ac/Flag_of_Indiana.svg/45px-Flag_of_Indiana.svg.png\"},{\"Name\":\"Iowa\",\"Flag\":\"a/aa/Flag_of_Iowa.svg/44px-Flag_of_Iowa.svg.png\"},{\"Name\":\"Kansas\",\"Flag\":\"d/da/Flag_of_Kansas.svg/46px-Flag_of_Kansas.svg.png\"},{\"Name\":\"Kentucky\",\"Flag\":\"8/8d/Flag_of_Kentucky.svg/46px-Flag_of_Kentucky.svg.png\"},{\"Name\":\"Louisiana\",\"Flag\":\"e/e0/Flag_of_Louisiana.svg/46px-Flag_of_Louisiana.svg.png\"},{\"Name\":\"Maine\",\"Flag\":\"3/35/Flag_of_Maine.svg/45px-Flag_of_Maine.svg.png\"},{\"Name\":\"Maryland\",\"Flag\":\"a/a0/Flag_of_Maryland.svg/45px-Flag_of_Maryland.svg.png\"},{\"Name\":\"Massachusetts\",\"Flag\":\"f/f2/Flag_of_Massachusetts.svg/46px-Flag_of_Massachusetts.svg.png\"},{\"Name\":\"Michigan\",\"Flag\":\"b/b5/Flag_of_Michigan.svg/45px-Flag_of_Michigan.svg.png\"},{\"Name\":\"Minnesota\",\"Flag\":\"b/b9/Flag_of_Minnesota.svg/46px-Flag_of_Minnesota.svg.png\"},{\"Name\":\"Mississippi\",\"Flag\":\"4/42/Flag_of_Mississippi.svg/45px-Flag_of_Mississippi.svg.png\"},{\"Name\":\"Missouri\",\"Flag\":\"5/5a/Flag_of_Missouri.svg/46px-Flag_of_Missouri.svg.png\"},{\"Name\":\"Montana\",\"Flag\":\"c/cb/Flag_of_Montana.svg/45px-Flag_of_Montana.svg.png\"},{\"Name\":\"Nebraska\",\"Flag\":\"4/4d/Flag_of_Nebraska.svg/46px-Flag_of_Nebraska.svg.png\"},{\"Name\":\"Nevada\",\"Flag\":\"f/f1/Flag_of_Nevada.svg/45px-Flag_of_Nevada.svg.png\"},{\"Name\":\"New Hampshire\",\"Flag\":\"2/28/Flag_of_New_Hampshire.svg/45px-Flag_of_New_Hampshire.svg.png\"},{\"Name\":\"New Jersey\",\"Flag\":\"9/92/Flag_of_New_Jersey.svg/45px-Flag_of_New_Jersey.svg.png\"},{\"Name\":\"New Mexico\",\"Flag\":\"c/c3/Flag_of_New_Mexico.svg/45px-Flag_of_New_Mexico.svg.png\"},{\"Name\":\"New York\",\"Flag\":\"1/1a/Flag_of_New_York.svg/46px-Flag_of_New_York.svg.png\"},{\"Name\":\"North Carolina\",\"Flag\":\"b/bb/Flag_of_North_Carolina.svg/45px-Flag_of_North_Carolina.svg.png\"},{\"Name\":\"North Dakota\",\"Flag\":\"e/ee/Flag_of_North_Dakota.svg/38px-Flag_of_North_Dakota.svg.png\"},{\"Name\":\"Ohio\",\"Flag\":\"4/4c/Flag_of_Ohio.svg/46px-Flag_of_Ohio.svg.png\"},{\"Name\":\"Oklahoma\",\"Flag\":\"6/6e/Flag_of_Oklahoma.svg/45px-Flag_of_Oklahoma.svg.png\"},{\"Name\":\"Oregon\",\"Flag\":\"b/b9/Flag_of_Oregon.svg/46px-Flag_of_Oregon.svg.png\"},{\"Name\":\"Pennsylvania\",\"Flag\":\"f/f7/Flag_of_Pennsylvania.svg/45px-Flag_of_Pennsylvania.svg.png\"},{\"Name\":\"Rhode Island\",\"Flag\":\"f/f3/Flag_of_Rhode_Island.svg/32px-Flag_of_Rhode_Island.svg.png\"},{\"Name\":\"South Carolina\",\"Flag\":\"6/69/Flag_of_South_Carolina.svg/45px-Flag_of_South_Carolina.svg.png\"},{\"Name\":\"South Dakota\",\"Flag\":\"1/1a/Flag_of_South_Dakota.svg/46px-Flag_of_South_Dakota.svg.png\"},{\"Name\":\"Tennessee\",\"Flag\":\"9/9e/Flag_of_Tennessee.svg/46px-Flag_of_Tennessee.svg.png\"},{\"Name\":\"Texas\",\"Flag\":\"f/f7/Flag_of_Texas.svg/45px-Flag_of_Texas.svg.png\"},{\"Name\":\"Utah\",\"Flag\":\"f/f6/Flag_of_Utah.svg/45px-Flag_of_Utah.svg.png\"},{\"Name\":\"Vermont\",\"Flag\":\"4/49/Flag_of_Vermont.svg/46px-Flag_of_Vermont.svg.png\"},{\"Name\":\"Virginia\",\"Flag\":\"4/47/Flag_of_Virginia.svg/44px-Flag_of_Virginia.svg.png\"},{\"Name\":\"Washington\",\"Flag\":\"5/54/Flag_of_Washington.svg/46px-Flag_of_Washington.svg.png\"},{\"Name\":\"West Virginia\",\"Flag\":\"2/22/Flag_of_West_Virginia.svg/46px-Flag_of_West_Virginia.svg.png\"},{\"Name\":\"Wisconsin\",\"Flag\":\"2/22/Flag_of_Wisconsin.svg/45px-Flag_of_Wisconsin.svg.png\"},{\"Name\":\"Wyoming\",\"Flag\":\"b/bc/Flag_of_Wyoming.svg/43px-Flag_of_Wyoming.svg.png\"}]";
33+
34+
[ClassInitialize]
35+
public static void TestInitForAll(Microsoft.VisualStudio.TestTools.UnitTesting.TestContext context)
36+
{
37+
_testData = JsonSerializer.Deserialize<StatesWithFlags[]>(JsonData);
38+
}
39+
40+
[TestInitialize]
41+
public void Init()
42+
{
43+
var logger = new Mock<ILogger<DebounceInput>>();
44+
var logger2 = new Mock<ILogger<AdvancedTimer>>();
45+
_clickBoundariesMock = new Mock<IClickBoundariesHandler>();
46+
47+
_testContext.Services.Add(new ServiceDescriptor(typeof(ILogger<DebounceInput>), logger.Object));
48+
_testContext.Services.Add(new ServiceDescriptor(typeof(ILogger<AdvancedTimer>), logger2.Object));
49+
_testContext.Services.Add(new ServiceDescriptor(typeof(IClickBoundariesHandler), _clickBoundariesMock.Object));
50+
51+
_testContext.JSInterop.Mode = JSRuntimeMode.Strict;
52+
#if DEBUG
53+
_jsInteropModul = _testContext.JSInterop.SetupModule("./_content/Majorsoft.Blazor.Components.Common.JsInterop/elementInfo.js");
54+
#else
55+
_jsInteropModul = _testContext.JSInterop.SetupModule("./_content/Majorsoft.Blazor.Components.Common.JsInterop/elementInfo.min.js");
56+
#endif
57+
_jsInteropModul.Setup<DomRect>("getBoundingClientRect", _ => true).SetResult(new DomRect());
58+
}
59+
60+
[TestMethod]
61+
public void TypeaheadInput_should_rendered_correctly_html_attributes()
62+
{
63+
var rendered = _testContext.RenderComponent<TypeaheadInput<string>>(
64+
("id", "id1"), //HTML attributes
65+
("class", "form-control w-100") //HTML attributes
66+
);
67+
68+
var input = rendered.Find("input");
69+
70+
Assert.IsNotNull(input);
71+
input.MarkupMatches(@"<input autocomplete=""off"" id=""id1"" class=""form-control w-100"" />");
72+
}
73+
74+
[TestMethod]
75+
public void TypeaheadInput_should_rendered_correctly()
76+
{
77+
var rendered = _testContext.RenderComponent<TypeaheadInput<string>>(parameters => parameters
78+
.Add(p => p.InProgressContent, "<strong>Searching...</strong>")
79+
.Add(p => p.Data, _testData.Select(x => x.Name))
80+
.Add(p => p.MinLength, 5));
81+
82+
var input = rendered.Find("input");
83+
84+
Assert.IsNotNull(input);
85+
input.MarkupMatches(@"<input autocomplete=""off"" class=""typeahead"" />");
86+
}
87+
88+
[TestMethod]
89+
public async Task TypeaheadInput_should_rendered_correctly_DropdownHeight()
90+
{
91+
//TODO: it should open dropdown....
92+
var rendered = _testContext.RenderComponent<TypeaheadInput<string>>(parameters => parameters
93+
.Add(p => p.InProgressContent, "<strong>Searching...</strong>")
94+
.Add(p => p.NoResultContent, "<strong>Not found...</strong>")
95+
.Add(p => p.Data, _testData.Select(x => x.Name))
96+
.Add(p => p.ShowAllOnEmptyInput, true)
97+
.Add(p => p.FitDropdownWidth, false)
98+
.Add(p => p.DropdownHeight, 50)
99+
.Add(p => p.DropdownWidth, 500));
100+
101+
var input = rendered.Find("input");
102+
103+
//input.Focus();
104+
//await input.TriggerEventAsync("onmouseenter", new MouseEventArgs());
105+
input.Input("t");
106+
rendered.SetParametersAndRender();
107+
108+
Assert.IsNotNull(input);
109+
rendered.WaitForAssertion(() => input.MarkupMatches(@"<input value=""t"" autocomplete=""off"" class=""typeahead"" />"));
110+
}
111+
112+
[TestMethod]
113+
public void TypeaheadInput_should_set_SelectedItem_with_OnSelectedItemChanged_event_triggered()
114+
{
115+
string selectedItem = "";
116+
int eventCounter = 0;
117+
var rendered = _testContext.RenderComponent<TypeaheadInput<string>>(parameters => parameters
118+
.Add(p => p.InProgressContent, "<strong>Searching...</strong>")
119+
.Add(p => p.Data, _testData.Select(x => x.Name))
120+
.Add(p => p.OnSelectedItemChanged, x => { selectedItem = x; eventCounter++; })
121+
.Add(p => p.SelectedItem, "Texas"));
122+
123+
var input = rendered.Find("input");
124+
125+
Assert.IsNotNull(input);
126+
Assert.AreEqual(rendered.Instance.Value, "Texas");
127+
Assert.AreEqual(rendered.Instance.SelectedItem, selectedItem);
128+
Assert.AreEqual(1, eventCounter);
129+
130+
input.MarkupMatches(@"<input value=""Texas"" autocomplete=""off"" class=""typeahead"" />");
131+
}
132+
}
133+
}

‎src/Majorsoft.Blazor.Components.Typeahead.Tests/TypeaheadInputText.cs‎

Lines changed: 0 additions & 45 deletions
This file was deleted.

‎src/Majorsoft.Blazor.Components.Typeahead.Tests/TypeaheadInputTextTest.cs‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
using Majorsoft.Blazor.Components.Common.JsInterop.Click;
2+
using Majorsoft.Blazor.Components.Debounce;
3+
4+
using Microsoft.Extensions.DependencyInjection;
5+
using Microsoft.Extensions.Logging;
6+
using Microsoft.VisualStudio.TestTools.UnitTesting;
7+
8+
using Moq;
9+
using Majorsoft.Blazor.Components.CommonTestsBase;
10+
using Bunit;
11+
using Majorsoft.Blazor.Components.Timer;
12+
using Majorsoft.Blazor.Components.Common.JsInterop.ElementInfo;
13+
14+
namespace Majorsoft.Blazor.Components.Typeahead.Tests
15+
{
16+
[TestClass]
17+
public class TypeaheadInputTextTest : ComponentsTestBase<TypeaheadInput<string>>
18+
{
19+
private Mock<IClickBoundariesHandler> _clickBoundariesMock;
20+
private BunitJSModuleInterop _jsInteropModul;
21+
22+
[TestInitialize]
23+
public void Init()
24+
{
25+
var logger = new Mock<ILogger<DebounceInputText>>();
26+
var logger2 = new Mock<ILogger<TypeaheadInputText<string>>>();
27+
_clickBoundariesMock = new Mock<IClickBoundariesHandler>();
28+
29+
_testContext.Services.Add(new ServiceDescriptor(typeof(ILogger<DebounceInputText>), logger.Object));
30+
_testContext.Services.Add(new ServiceDescriptor(typeof(ILogger<TypeaheadInputText<string>>), logger2.Object));
31+
_testContext.Services.Add(new ServiceDescriptor(typeof(IClickBoundariesHandler), _clickBoundariesMock.Object));
32+
33+
_testContext.JSInterop.Mode = JSRuntimeMode.Strict;
34+
#if DEBUG
35+
_jsInteropModul = _testContext.JSInterop.SetupModule("./_content/Majorsoft.Blazor.Components.Common.JsInterop/elementInfo.js");
36+
#else
37+
_jsInteropModul = _testContext.JSInterop.SetupModule("./_content/Majorsoft.Blazor.Components.Common.JsInterop/elementInfo.min.js");
38+
#endif
39+
_jsInteropModul.Setup<DomRect>("getBoundingClientRect", _ => true).SetResult(new DomRect());
40+
}
41+
42+
[TestMethod]
43+
public void TypeaheadInputText_should_rendered_correctly_html_attributes()
44+
{
45+
////TODO: needs EditContext
46+
///
47+
//var rendered = _testContext.RenderComponent<TypeaheadInputText<string>>(
48+
// ("id", "id1"), //HTML attributes
49+
// ("class", "form-control w-100") //HTML attributes
50+
// );
51+
52+
//var input = rendered.Find("input");
53+
54+
//Assert.IsNotNull(input);
55+
//input.MarkupMatches(@"<input autocomplete=""off"" id=""id1"" class=""form-control w-100"" />");
56+
}
57+
}
58+
}

‎src/Majorsoft.Blazor.Components.Typeahead/TypeaheadInput.razor.cs‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
using System.Text.RegularExpressions;
66
using System.Threading.Tasks;
77

8-
using Majorsoft.Blazor.Components.Common.JsInterop.Click;
98
using Majorsoft.Blazor.Components.Common.JsInterop.ElementInfo;
109
using Majorsoft.Blazor.Components.Common.JsInterop.Scroll;
1110
using Majorsoft.Blazor.Components.Core.HtmlColors;
@@ -375,7 +374,7 @@ private async Task Activate()
375374
}
376375
private async Task SelectItem(TItem item)
377376
{
378-
SelectedItem = item;
377+
_selectedItem = item;
379378
Value = GetItemText(item);
380379
IsOpen = false;
381380
try

‎src/Majorsoft.Blazor.Components.Typeahead/TypeaheadInputText.razor.cs‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
using System.Text.RegularExpressions;
66
using System.Threading.Tasks;
77

8-
using Majorsoft.Blazor.Components.Common.JsInterop.Click;
98
using Majorsoft.Blazor.Components.Common.JsInterop.ElementInfo;
109
using Majorsoft.Blazor.Components.Common.JsInterop.Scroll;
1110
using Majorsoft.Blazor.Components.Core.HtmlColors;
@@ -376,7 +375,7 @@ private async Task Activate()
376375
}
377376
private async Task SelectItem(TItem item)
378377
{
379-
SelectedItem = item;
378+
_selectedItem = item;
380379
Value = GetItemText(item);
381380
IsOpen = false;
382381
try

‎src/Majorsoft.Blazor.Components.Typeahead/TypeaheadInputText.razor.css‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,6 @@
2020
/*-ms-overflow-style: none;*/ /* Internet Explorer 10+ */
2121
/*scrollbar-width: none;*/ /* Firefox */
2222
}
23-
/*.dropdown-menu::-webkit-scrollbar {
24-
display: none;*/ /* Safari and Chrome */
25-
/*}*/
2623

2724
.dropdown-menu .list {
2825
list-style: none;

0 commit comments

Comments
 (0)