old4ever/local-cal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: isolate EventCard tests and clean compose refs hook

Browse Source
This commit is contained in:
Dmytro Stanchiev
2026-05-25 11:01:01 -04:00
parent 3c3ba7cb33
commit 1af9ee02df
2 changed files with 68 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/lib/compose-refs.ts
View File

@@ -54,9 +54,12 @@ function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {
* A custom hook that composes multiple refs
* Accepts callback refs and RefObject(s)
*/
function useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {
// biome-ignore lint/correctness/useExhaustiveDependencies: we want to memoize by all values
return React.useCallback(composeRefs(...refs), refs);
function useComposedRefs<T>(
ref1: PossibleRef<T>,
ref2: PossibleRef<T>,
ref3?: PossibleRef<T>,
): React.RefCallback<T> {
return React.useMemo(() => composeRefs(ref1, ref2, ref3), [ref1, ref2, ref3]);
}
export { composeRefs, useComposedRefs };

113
tests/event-card.test.ts
View File

@@ -1,65 +1,76 @@
import { describe, expect, test } from "bun:test";
import { afterEach, beforeEach, describe, expect, test } from "bun:test";
import { renderToStaticMarkup } from "react-dom/server";
import { EventCard } from "@/components/event-card";
import type { CalendarEvent } from "@/lib/types";
const sampleEvent: CalendarEvent = {
id: "evt_1",
title: "Design Review",
start: "2026-04-09T10:00:00+00:00",
end: "2026-04-09T11:00:00+00:00",
description: "Review the updated event list UI.",
location: "Studio A",
url: "https://example.com/event",
allDay: false,
id: "evt_1",
title: "Design Review",
start: "2026-04-09T10:00:00+00:00",
end: "2026-04-09T11:00:00+00:00",
description: "Review the updated event list UI.",
location: "Studio A",
url: "https://example.com/event",
allDay: false,
};
describe("EventCard actions trigger", () => {
test("shows the triple-dots trigger without requiring hover and exposes an aria-label for the icon-only button", () => {
const markup = renderToStaticMarkup(
EventCard({
event: sampleEvent,
onEdit: () => {},
onDelete: () => {},
}),
);
beforeEach(() => {
globalThis.document = {
addEventListener: () => {},
removeEventListener: () => {},
} as unknown as Document;
});
expect(markup).toContain('aria-label="Event actions"');
expect(markup).not.toContain("opacity-0");
expect(markup).not.toContain("group-hover:opacity-100");
});
afterEach(() => {
delete (globalThis as { document?: Document }).document;
});
test("renders friendly shared date formatting instead of native locale strings", () => {
const markup = renderToStaticMarkup(
EventCard({
event: sampleEvent,
onEdit: () => {},
onDelete: () => {},
}),
);
test("shows the triple-dots trigger without requiring hover and exposes an aria-label for the icon-only button", () => {
const markup = renderToStaticMarkup(
EventCard({
event: sampleEvent,
onEdit: () => {},
onDelete: () => {},
}),
);
expect(markup).toContain("10:00–11:00");
expect(markup).not.toContain("AM");
});
expect(markup).toContain('aria-label="Event actions"');
expect(markup).not.toContain("opacity-0");
expect(markup).not.toContain("group-hover:opacity-100");
});
test("renders inline warning copy for invalid event ranges", () => {
const markup = renderToStaticMarkup(
EventCard({
event: {
id: "evt_invalid",
title: "Broken Event",
start: "2026-04-09T11:00:00+00:00",
end: "2026-04-09T10:00:00+00:00",
allDay: false,
},
onEdit: () => {},
onDelete: () => {},
}),
);
test("renders friendly shared date formatting instead of native locale strings", () => {
const markup = renderToStaticMarkup(
EventCard({
event: sampleEvent,
onEdit: () => {},
onDelete: () => {},
}),
);
expect(markup).toContain("Warning:");
expect(markup).toContain("end time is before start time");
expect(markup).not.toContain("Preview");
expect(markup).not.toContain("Ship");
});
expect(markup).toContain("10:00–11:00");
expect(markup).not.toContain("AM");
});
test("renders inline warning copy for invalid event ranges", () => {
const markup = renderToStaticMarkup(
EventCard({
event: {
id: "evt_invalid",
title: "Broken Event",
start: "2026-04-09T11:00:00+00:00",
end: "2026-04-09T10:00:00+00:00",
allDay: false,
},
onEdit: () => {},
onDelete: () => {},
}),
);
expect(markup).toContain("Warning:");
expect(markup).toContain("end time is before start time");
expect(markup).not.toContain("Preview");
expect(markup).not.toContain("Ship");
});
});