Arnike/duty-teller
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 14 Wiki Activity

refactor: update DayIndicators component and tests for improved clarity and accuracy

Browse Source 
- Revised comments in DayIndicators component and test files to better describe the functionality of colored segments and rounding behavior.
- Updated test descriptions to reflect changes in rendering logic for single and multiple segments.
- Adjusted class names in the component and tests to ensure correct application of rounded styles based on segment positions.
This commit is contained in:
Nikolay Tatarinov
2026-03-03 18:19:52 +03:00
parent 68a153e4a7
commit 8bf92bd4a1
2 changed files with 15 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
webapp-next/src/components/calendar/DayIndicators.test.tsx
View File

@@ -1,6 +1,6 @@
/**
* Unit tests for DayIndicators: rounding is position-based (first / last / only child),
* not by indicator type, so multiple segments form one pill.
* Unit tests for DayIndicators: rounding is position-based (first / last segment),
* not by indicator type, so one or multiple segments form one pill.
*/
import { describe, it, expect } from "vitest";
@@ -20,13 +20,14 @@ describe("DayIndicators", () => {
expect(container.firstChild).toBeNull();
});
it("renders one segment with only-child rounding (e.g. vacation only)", () => {
it("renders one segment as pill (e.g. vacation only)", () => {
const { container } = render(
<DayIndicators {...baseProps} vacationCount={1} />
);
const wrapper = container.querySelector("[aria-hidden]");
expect(wrapper).toBeInTheDocument();
expect(wrapper?.className).toContain("[&>:only-child]:rounded-full");
expect(wrapper?.className).toContain("[&>:first-child]:rounded-l-[3px]");
expect(wrapper?.className).toContain("[&>:last-child]:rounded-r-[3px]");
const spans = wrapper?.querySelectorAll("span");
expect(spans).toHaveLength(1);
});
@@ -38,10 +39,10 @@ describe("DayIndicators", () => {
const wrapper = container.querySelector("[aria-hidden]");
expect(wrapper).toBeInTheDocument();
expect(wrapper?.className).toContain(
"[&>:first-child:not(:only-child)]:rounded-l-[3px]"
"[&>:first-child]:rounded-l-[3px]"
);
expect(wrapper?.className).toContain(
"[&>:last-child:not(:only-child)]:rounded-r-[3px]"
"[&>:last-child]:rounded-r-[3px]"
);
const spans = wrapper?.querySelectorAll("span");
expect(spans).toHaveLength(2);
@@ -59,10 +60,10 @@ describe("DayIndicators", () => {
const wrapper = container.querySelector("[aria-hidden]");
expect(wrapper).toBeInTheDocument();
expect(wrapper?.className).toContain(
"[&>:first-child:not(:only-child)]:rounded-l-[3px]"
"[&>:first-child]:rounded-l-[3px]"
);
expect(wrapper?.className).toContain(
"[&>:last-child:not(:only-child)]:rounded-r-[3px]"
"[&>:last-child]:rounded-r-[3px]"
);
const spans = wrapper?.querySelectorAll("span");
expect(spans).toHaveLength(3);