Files
calendar/apps/web/modules/users/lib/UserListTableUtils.test.ts
T
Bailey PumfleetGitHubPedro CastroDevin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
7c66f33de2 chore: UX Fixes (#26643)
* Copy changes

* Move search bar inline with new button

* Get rid of no more results message

* Change hidden badge to (hidden)

* Remove Cal.ai badge from sidebar

* Add dropdown to create button when there is multiple options

* Fix delete dialog

* Saved filters updates

* More string fixes

* Switch members table to use names

* Fix member spacing

* Fix routing form identifier field

* Fix routing forms stuff

* Only show SMS hint on SMS options

* Make workflow delete button minimal

* Fix padding on workflow steps

* Remove min width on workflow title

* Fix delete workflow PR

* Fix org profile buttons

* Fix org profile screen partially scrolled down

* Improve logos & banner uploads

* Personal profile fixes

* Fix settings general view stuff

* Sentence case consistency

* Fix stuff I broke

* Fix fab

* Fix hidden translation string

* Fix text fields

* Make button small for solo users too

* fix: update E2E tests to match sentence case labels in routing forms

* fix: update tests to match sentence case label changes

- insights.e2e.ts: chart titles (14 strings)
- event-types.e2e.ts: Organizer phone number location
- EditLocationDialog.test.tsx: phone number labels

* fix: address Cubic AI review feedback (confidence 9+)

- Replace hardcoded text-gray-500 with text-muted in TextField.tsx hint section
- Replace text locator with data-testid in E2E test for location select

Co-Authored-By: unknown <>

* fix: update E2E tests for sentence case label changes

- Use data-testid selectors for location options (more reliable than text)
- Update field identifiers in routing-forms tests to match new labels
- Fix Long text selector in manage-booking-questions test

* fix: replace text locator with data-testid in manage-booking-questions E2E test

Replace fragile text="Long text" locator with resilient
page.getByTestId("select-option-textarea") selector per E2E best practices.

Addresses Cubic AI review feedback (confidence 9/10).

Co-Authored-By: unknown <>

* fix: use .last() for multiple location select items

---------

Co-authored-by: Pedro Castro <pedro@cal.com>
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
2026-01-13 00:56:08 -05:00

287 lines
7.8 KiB
TypeScript

import type { Table } from "@tanstack/react-table";
import { describe, it, expect, vi } from "vitest";
import {
generateCsvRawForMembersTable,
generateHeaderFromReactTable,
} from "@calcom/web/modules/users/lib/UserListTableUtils";
import { MembershipRole } from "@calcom/prisma/enums";
import type { UserTableUser } from "@calcom/web/modules/users/components/UserTable/types";
function createMockTable(data: UserTableUser[]): Table<UserTableUser> {
return {
getHeaderGroups: vi.fn().mockReturnValue([
{
headers: [
{
id: "select",
column: { columnDef: { header: "" } },
getContext: () => ({}),
},
{
id: "member",
column: { columnDef: { header: "Members" } },
getContext: () => ({}),
},
{
id: "role",
column: { columnDef: { header: "Role" } },
getContext: () => ({}),
},
{
id: "teams",
column: { columnDef: { header: "Teams" } },
getContext: () => ({}),
},
{
id: "attr1",
column: { columnDef: { header: () => "Attribute 1" } },
getContext: () => ({}),
},
{
id: "attr2",
column: { columnDef: { header: () => "Attribute 2" } },
getContext: () => ({}),
},
{
id: "actions",
column: { columnDef: { header: "" } },
getContext: () => ({}),
},
],
},
]),
getRowModel: vi.fn().mockReturnValue({ rows: data.map((item) => ({ original: item })) }),
} as unknown as Table<UserTableUser>;
}
describe("generate Csv for Org Users Table", () => {
const orgDomain = "https://acme.cal.com";
const mockAttributeIds = ["attr1", "attr2"];
const mockUser: UserTableUser = {
id: 1,
username: "testuser",
name: "Test User",
email: "test@example.com",
timeZone: "UTC",
role: MembershipRole.MEMBER,
avatarUrl: null,
accepted: true,
disableImpersonation: false,
completedOnboarding: true,
teams: [],
attributes: [],
lastActiveAt: new Date().toISOString(),
createdAt: null,
updatedAt: null,
customRole: {
type: "SYSTEM",
id: "member_role",
name: "Member",
description: "Default member role",
teamId: null,
createdAt: new Date(),
updatedAt: new Date(),
color: null,
},
};
it("should throw if no headers", () => {
expect(() => generateCsvRawForMembersTable([], [], mockAttributeIds, orgDomain)).toThrow();
});
it("should generate correct CSV headers", () => {
const mockTable = createMockTable([]);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
[],
mockAttributeIds,
orgDomain
);
const headers = csv?.split("\n")[0];
expect(headers).toBe("Members,Link,Role,Teams,Attribute 1,Attribute 2");
});
it("should handle user with single attribute value", () => {
const mockData: UserTableUser[] = [
{
...mockUser,
teams: [{ id: 1, name: "Team1", slug: "team1" }],
attributes: [
{
id: "1",
attributeId: "attr1",
value: "value1",
slug: "slug1",
contains: [],
weight: 0,
isGroup: false,
},
],
},
];
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
test@example.com,https://acme.cal.com/testuser,MEMBER,Team1,value1,"
`);
});
it("should handle user with multiple attribute values for same attribute", () => {
const mockData: UserTableUser[] = [
{
...mockUser,
teams: [{ id: 1, name: "Team1", slug: "team1" }],
attributes: [
{
id: "1",
attributeId: "attr1",
value: "value1",
slug: "slug1",
contains: [],
weight: 0,
isGroup: false,
},
{
id: "2",
attributeId: "attr1",
value: "value2",
slug: "slug1",
contains: [],
weight: 0,
isGroup: false,
},
],
},
];
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
test@example.com,https://acme.cal.com/testuser,MEMBER,Team1,"value1,value2","
`);
});
it("should handle user with multiple teams", () => {
const mockData: UserTableUser[] = [
{
...mockUser,
teams: [
{ id: 1, name: "Team1", slug: "team1" },
{ id: 2, name: "Team2", slug: "team2" },
],
attributes: [],
},
];
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
test@example.com,https://acme.cal.com/testuser,MEMBER,"Team1,Team2",,"
`);
});
it("should handle values that need sanitization", () => {
const mockData: UserTableUser[] = [
{
...mockUser,
teams: [{ id: 1, name: "Team,1", slug: "team1" }],
attributes: [
{
id: "1",
attributeId: "attr1",
value: "value,1",
slug: "slug1",
contains: [],
weight: 0,
isGroup: false,
},
],
},
];
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
test@example.com,https://acme.cal.com/testuser,MEMBER,"Team,1","value,1","
`);
});
it("should handle all membership roles", () => {
const roles: MembershipRole[] = ["OWNER", "ADMIN", "MEMBER"];
const mockData: UserTableUser[] = roles.map((role) => ({
...mockUser,
username: role.toLowerCase(),
role,
email: `${role.toLowerCase()}@example.com`,
}));
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
owner@example.com,https://acme.cal.com/owner,OWNER,,,
admin@example.com,https://acme.cal.com/admin,ADMIN,,,
member@example.com,https://acme.cal.com/member,MEMBER,,,"
`);
});
it("should handle users without teams and attributes", () => {
const mockData: UserTableUser[] = [
{
...mockUser,
username: "testuser",
avatarUrl: null,
},
];
const mockTable = createMockTable(mockData);
const csv = generateCsvRawForMembersTable(
generateHeaderFromReactTable(mockTable) ?? [],
mockData,
mockAttributeIds,
orgDomain
);
expect(csv).toMatchInlineSnapshot(`
"Members,Link,Role,Teams,Attribute 1,Attribute 2
test@example.com,https://acme.cal.com/testuser,MEMBER,,,"
`);
});
});