Skip to content

Add the new Theme infrastructure for the BitDateRangePicker component (#4068) #4087

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
msynk merged 2 commits into from
Mar 16, 2023
Merged

Add the new Theme infrastructure for the BitDateRangePicker component (#4068) #4087

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
4548128
Add the new Theme infrastructure for the BitDateRangePicker component…
Cyrus-Sushiant Mar 15, 2023
c66ae84
Fix issue
Cyrus-Sushiant Mar 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 0 additions & 50 deletions src/BlazorUI/Bit.BlazorUI.Tests/DateRangePicker/BitDateRangePickerTest.razor
View file
Open in desktop

This file was deleted.

134 changes: 65 additions & 69 deletions src/BlazorUI/Bit.BlazorUI.Tests/DateRangePicker/BitDateRangePickerTests.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,53 +8,49 @@ namespace Bit.BlazorUI.Tests.DateRangePicker;
[TestClass]
public class BitDateRangePickerTests : BunitTestContext
{
[DataTestMethod, DataRow("<div>This is labelFragment</div>")]
public void BitDateRangePickerShouldRenderLabelFragment(string labelFragment)
[DataTestMethod,
DataRow(true),
DataRow(false),
]
public void BitDateRangePickerTest(bool isEnabled)
{
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.LabelFragment, labelFragment);
parameters.Add(p => p.IsEnabled, isEnabled);
});

var bitDateRangePickerLabelChild = component.Find(".bit-dtrp > label").ChildNodes;
bitDateRangePickerLabelChild.MarkupMatches(labelFragment);
}

[DataTestMethod,
DataRow(Visual.Fluent, true),
DataRow(Visual.Fluent, false),
var bitDatePicker = component.Find(".bit-dtrp");

DataRow(Visual.Cupertino, true),
DataRow(Visual.Cupertino, false),
if (isEnabled)
{
Assert.IsFalse(bitDatePicker.ClassList.Contains("disabled"));
}
else
{
Assert.IsTrue(bitDatePicker.ClassList.Contains("disabled"));
}
}

DataRow(Visual.Material, true),
DataRow(Visual.Material, false)
]
public void BitDateRangePickerShouldTakeCorrectVisual(Visual visual, bool isEnabled)
[DataTestMethod, DataRow("<div>This is labelFragment</div>")]
public void BitDateRangePickerShouldRenderLabelFragment(string labelTemplate)
{
var component = RenderComponent<BitDateRangePickerTest>(
parameters =>
{
parameters.Add(p => p.Visual, visual);
parameters.Add(p => p.IsEnabled, isEnabled);
});

var bitDateRangePicker = component.Find(".bit-dtrp");
var dateRangePickerIsEnabledClass = isEnabled ? "enabled" : "disabled";
var visualClass = visual == Visual.Cupertino ? "cupertino" : visual == Visual.Material ? "material" : "fluent";

Assert.IsTrue(bitDateRangePicker.ClassList.Contains($"bit-dtrp-{dateRangePickerIsEnabledClass}-{visualClass}"));
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.LabelTemplate, labelTemplate);
});

var bitDateRangePickerLabelChild = component.Find(".bit-dtrp > label.label").ChildNodes;
bitDateRangePickerLabelChild.MarkupMatches(labelTemplate);
}

[DataTestMethod, DataRow("go to today text")]
public void BitDateRangePickerShouldGiveValueToGoToToday(string goToToday)
{
var component = RenderComponent<BitDateRangePickerTest>(
parameters =>
{
parameters.Add(p => p.GoToToday, goToToday);
parameters.Add(p => p.IsOpen, true);
});
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.GoToToday, goToToday);
parameters.Add(p => p.IsOpen, true);
});

var goToTodayButton = component.Find(".go-today-btn");

Expand All @@ -68,16 +64,17 @@ public void BitDateRangePickerShouldGiveValueToGoToToday(string goToToday)
public void BitDateRangePickerShouldHandleOnClickEvent(bool isEnabled, int count)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(
parameters =>
{
parameters.Add(p => p.IsEnabled, isEnabled);
});
var clickedValue = 0;
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.IsEnabled, isEnabled);
parameters.Add(p => p.OnClick, () => clickedValue++);
});

var bitDateRangePickerInput = component.Find(".dtrp-wrapper");
var bitDateRangePickerInput = component.Find(".wrapper");
bitDateRangePickerInput.Click();

Assert.AreEqual(component.Instance.ClickedValue, count);
Assert.AreEqual(count, clickedValue);
}

[DataTestMethod,
Expand All @@ -87,31 +84,31 @@ public void BitDateRangePickerShouldHandleOnClickEvent(bool isEnabled, int count
public void BitDateRangePickerCalendarItemsShouldRespectIsEnabled(bool isEnabled, int count)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(
parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.IsEnabled, isEnabled);
});
var selectedDateValue = 0;
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.IsEnabled, isEnabled);
parameters.Add(p => p.OnSelectDate, () => selectedDateValue++);
});

var dateItems = component.FindAll(".day-btn");

Random random = new();
int randomNumber = random.Next(0, dateItems.Count - 1);
dateItems[randomNumber].Click();
Assert.AreEqual(component.Instance.SelectedDateValue, count);
Assert.AreEqual(count, selectedDateValue);
}

[DataTestMethod]
public void BitDateRangePickerCalendarSelectTodayDate()
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDatePicker>(
parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.IsEnabled, true);
});
var component = RenderComponent<BitDatePicker>(parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.IsEnabled, true);
});

Assert.IsNull(component.Instance.Value);

Expand All @@ -127,12 +124,11 @@ public void BitDateRangePickerCalendarSelectTodayDate()
public void BitDateRangePickerCalendarWithCustomCultureInfo()
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(
parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.Culture, CultureInfoHelper.GetFaIrCultureByFingilishNames());
});
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.IsOpen, true);
parameters.Add(p => p.Culture, CultureInfoHelper.GetFaIrCultureByFingilishNames());
});

var monthButtons = component.FindAll(".month-picker-wrapper .grid-container .btn-row button");

Expand All @@ -149,12 +145,12 @@ public void BitDateRangePickerCalendarWithCustomCultureInfo()
public void BitDateRangePickerAriaLabelTest(string pickerAriaLabel)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.PickerAriaLabel, pickerAriaLabel);
});

var bitDateRangePickerCallout = component.Find(".dtrp-callout-main");
var bitDateRangePickerCallout = component.Find(".callout-main");
var calloutAriaLabel = bitDateRangePickerCallout.GetAttribute("aria-label");

Assert.AreEqual(pickerAriaLabel, calloutAriaLabel);
Expand All @@ -167,7 +163,7 @@ public void BitDateRangePickerAriaLabelTest(string pickerAriaLabel)
public void BitDateRangePickerShowGoToTodayTest(bool showGoToToday)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.ShowGoToToday, showGoToToday);
});
Expand All @@ -191,7 +187,7 @@ public void BitDateRangePickerShowGoToTodayTest(bool showGoToToday)
public void BitDateRangePickerShowCloseButtonTest(bool showCloseButton)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.ShowCloseButton, showCloseButton);
});
Expand All @@ -215,7 +211,7 @@ public void BitDateRangePickerShowCloseButtonTest(bool showCloseButton)
public void BitDateRangePickerHighlightCurrentMonthTest(bool highlightCurrentMonth)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.HighlightCurrentMonth, highlightCurrentMonth);
});
Expand All @@ -239,7 +235,7 @@ public void BitDateRangePickerHighlightCurrentMonthTest(bool highlightCurrentMon
public void BitDateRangePickerHighlightSelectedMonthTest(bool highlightSelectedMonth)
{
Context.JSInterop.Mode = JSRuntimeMode.Loose;
var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.HighlightSelectedMonth, highlightSelectedMonth);
});
Expand All @@ -266,12 +262,12 @@ public void BitDateRangePickerCalloutHtmlAttributesTest()
{"style", "color: blue" }
};

var component = RenderComponent<BitDateRangePickerTest>(parameters =>
var component = RenderComponent<BitDateRangePicker>(parameters =>
{
parameters.Add(p => p.CalloutHtmlAttributes, calloutHtmlAttributes);
});

var bitDateRangePickerCallout = component.Find(".dtrp-callout-main");
var bitDateRangePickerCallout = component.Find(".callout-main");
var calloutStyle = bitDateRangePickerCallout.GetAttribute("style");

Assert.AreEqual("color: blue", calloutStyle);
Expand Down
Loading