95 lines
3.4 KiB
TypeScript
95 lines
3.4 KiB
TypeScript
import { MemoryRouter } from 'react-router-dom';
|
|
import { render, screen, within } from '@testing-library/react';
|
|
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
|
import { PickListsScreen } from './PickListsScreen';
|
|
|
|
let areasMock = [
|
|
{ id: 'area-1', name: 'Front Counter', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-2', name: 'back room', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-3', name: 'Cafe', created_at: 0, updated_at: 0 },
|
|
];
|
|
|
|
let pickListsMock = [
|
|
{ id: 'list-2', area_id: 'area-2', created_at: 3, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-3', area_id: 'area-3', created_at: 4, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-1', area_id: 'area-1', created_at: 5, categories: [], auto_add_new_products: false },
|
|
];
|
|
|
|
vi.mock('../hooks/dataHooks', () => ({
|
|
usePickLists: () => pickListsMock,
|
|
useAreas: () => areasMock,
|
|
}));
|
|
|
|
vi.mock('../context/DBProvider', () => ({
|
|
useDatabase: () => ({
|
|
pickItems: {
|
|
where: () => ({
|
|
equals: () => ({ delete: vi.fn() }),
|
|
}),
|
|
},
|
|
pickLists: {
|
|
update: vi.fn(),
|
|
delete: vi.fn(),
|
|
where: () => ({
|
|
equals: () => ({ delete: vi.fn() }),
|
|
}),
|
|
},
|
|
}),
|
|
}));
|
|
|
|
describe('PickListsScreen sorting', () => {
|
|
beforeEach(() => {
|
|
areasMock = [
|
|
{ id: 'area-1', name: 'Front Counter', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-2', name: 'back room', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-3', name: 'Cafe', created_at: 0, updated_at: 0 },
|
|
];
|
|
|
|
pickListsMock = [
|
|
{ id: 'list-2', area_id: 'area-2', created_at: 3, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-3', area_id: 'area-3', created_at: 4, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-1', area_id: 'area-1', created_at: 5, categories: [], auto_add_new_products: false },
|
|
];
|
|
});
|
|
|
|
it('sorts pick lists alphabetically by area name', () => {
|
|
render(
|
|
<MemoryRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
|
|
<PickListsScreen />
|
|
</MemoryRouter>,
|
|
);
|
|
|
|
const listItems = screen.getAllByRole('listitem');
|
|
|
|
expect(within(listItems[0]).getByText('back room')).toBeVisible();
|
|
expect(within(listItems[1]).getByText('Cafe')).toBeVisible();
|
|
expect(within(listItems[2]).getByText('Front Counter')).toBeVisible();
|
|
});
|
|
|
|
it('ignores casing and whitespace when ordering pick lists', () => {
|
|
areasMock = [
|
|
{ id: 'area-1', name: ' front counter', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-2', name: ' Cafe ', created_at: 0, updated_at: 0 },
|
|
{ id: 'area-3', name: 'Back room', created_at: 0, updated_at: 0 },
|
|
];
|
|
|
|
pickListsMock = [
|
|
{ id: 'list-1', area_id: 'area-1', created_at: 5, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-2', area_id: 'area-2', created_at: 3, categories: [], auto_add_new_products: false },
|
|
{ id: 'list-3', area_id: 'area-3', created_at: 4, categories: [], auto_add_new_products: false },
|
|
];
|
|
|
|
render(
|
|
<MemoryRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
|
|
<PickListsScreen />
|
|
</MemoryRouter>,
|
|
);
|
|
|
|
const listItems = screen.getAllByRole('listitem');
|
|
|
|
expect(within(listItems[0]).getByText(/back room/i)).toBeVisible();
|
|
expect(within(listItems[1]).getByText(/cafe/i)).toBeVisible();
|
|
expect(within(listItems[2]).getByText(/front counter/i)).toBeVisible();
|
|
});
|
|
});
|