pkartch/basil
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 6 Wiki Activity

test: update RecipeList tests to match UI changes
All checks were successful
Basil CI/CD Pipeline / Code Linting (push) Successful in 58s
Details
Basil CI/CD Pipeline / Web Tests (push) Successful in 1m9s
Details
Basil CI/CD Pipeline / API Tests (push) Successful in 1m27s
Details
Basil CI/CD Pipeline / Shared Package Tests (push) Successful in 1m1s
Details
Basil CI/CD Pipeline / E2E Tests (push) Has been skipped
Details
Basil CI/CD Pipeline / Security Scanning (push) Successful in 1m8s
Details
Basil CI/CD Pipeline / Build All Packages (push) Successful in 1m32s
Details
Basil CI/CD Pipeline / Build & Push Docker Images (push) Successful in 8m1s
Details
Basil CI/CD Pipeline / Trigger Deployment (push) Successful in 10s
Details

Browse Source 
Fix failing tests after UI improvements in previous commit:
- Remove size slider tests (feature removed from UI)
- Remove search type toggle tests (unified search replaces title/tag toggle)
- Update search placeholder to match new unified search input
- Update URL param tests for unified search behavior

All 27 tests now passing. Resolves test failures from task #343.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Peter Kartchner
2026-01-16 13:15:23 -07:00
parent d4ce3ff81b
commit 67acf7e50e
1 changed files with 5 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

151
packages/web/src/pages/RecipeList.test.tsx
View File

@@ -404,93 +404,9 @@ describe('RecipeList Component', () => {
});
});
describe('Size Slider', () => {
it('should render size slider', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByText('Size:')).toBeInTheDocument();
});
const slider = screen.getByRole('slider');
expect(slider).toBeInTheDocument();
expect(slider).toHaveAttribute('min', '0');
expect(slider).toHaveAttribute('max', '6');
});
it('should display size label', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
// Default size is 3 which is "Default"
expect(screen.getByText('Default')).toBeInTheDocument();
});
});
it.skip('should change image height when slider changes', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: [{ id: '1', title: 'Recipe 1', imageUrl: '/test.jpg' }] as any,
total: 1,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByText('Recipe 1')).toBeInTheDocument();
});
const slider = screen.getByRole('slider');
fireEvent.change(slider, { target: { value: '6' } });
await waitFor(() => {
// XXL size has imageHeight of 333px
const image = screen.getByAltText('Recipe 1');
expect(image).toHaveStyle({ height: '333px' });
});
});
it('should save size to localStorage', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByText('Recipe 1')).toBeInTheDocument();
});
const slider = screen.getByRole('slider');
fireEvent.change(slider, { target: { value: '5' } });
expect(Storage.prototype.setItem).toHaveBeenCalledWith(
'basil_recipes_cardSize',
'5'
);
});
});
describe('Search Functionality', () => {
it('should render search input', async () => {
it('should render unified search input', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
@@ -501,46 +417,10 @@ describe('RecipeList Component', () => {
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByPlaceholderText('Search by title...')).toBeInTheDocument();
expect(screen.getByPlaceholderText('Search recipes by title or tag...')).toBeInTheDocument();
});
});
it('should render search type toggle buttons', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByRole('button', { name: 'Title' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Tag' })).toBeInTheDocument();
});
});
it('should switch to tag search when Tag button clicked', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
total: 3,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
expect(screen.getByRole('button', { name: 'Tag' })).toBeInTheDocument();
});
const tagButton = screen.getByRole('button', { name: 'Tag' });
await userEvent.click(tagButton);
expect(screen.getByPlaceholderText('Search by tag...')).toBeInTheDocument();
});
it('should load available tags for autocomplete', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(3) as any,
@@ -614,7 +494,7 @@ describe('RecipeList Component', () => {
});
});
it('should initialize tag search from URL params', async () => {
it('should initialize unified search from URL params', async () => {
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: createMockRecipes(12) as any,
total: 100,
@@ -622,12 +502,12 @@ describe('RecipeList Component', () => {
pageSize: 24,
});
renderWithRouter(<RecipeList />, ['/recipes?search=Italian&type=tag']);
renderWithRouter(<RecipeList />, ['/recipes?search=Italian']);
await waitFor(() => {
expect(recipesApi.getAll).toHaveBeenCalledWith(
expect.objectContaining({
tag: 'Italian',
search: 'Italian',
})
);
});
@@ -656,27 +536,6 @@ describe('RecipeList Component', () => {
});
});
it('should load card size from localStorage', async () => {
Storage.prototype.getItem = vi.fn((key: string) => {
if (key === 'basil_recipes_cardSize') return '5';
return null;
});
vi.mocked(recipesApi.getAll).mockResolvedValue({
data: [{ id: '1', title: 'Recipe 1', imageUrl: '/test.jpg' }] as any,
total: 1,
page: 1,
pageSize: 24,
});
renderWithRouter(<RecipeList />);
await waitFor(() => {
// Size 5 (XL) should be displayed
const sizeLabel = screen.getByText('XL');
expect(sizeLabel).toBeInTheDocument();
});
});
it('should load items per page from localStorage', async () => {
Storage.prototype.getItem = vi.fn((key: string) => {