Add test for ProductRow read-only display
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import { ProductRow } from './ProductRow';
|
||||
import { Product } from '../models/Product';
|
||||
|
||||
const product: Product = {
|
||||
id: 'prod-1',
|
||||
name: 'Sparkling Water',
|
||||
category: 'Drinks',
|
||||
unit_type: 'bottle',
|
||||
barcode: '123456',
|
||||
archived: false,
|
||||
created_at: 0,
|
||||
updated_at: 0,
|
||||
};
|
||||
|
||||
const categories = ['Drinks', 'Snacks'];
|
||||
|
||||
describe('ProductRow', () => {
|
||||
it('shows name, category, and barcode without unit text in read-only mode', () => {
|
||||
render(
|
||||
<ProductRow
|
||||
product={product}
|
||||
categories={categories}
|
||||
onSave={vi.fn()}
|
||||
onDelete={vi.fn()}
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(screen.getByText('Sparkling Water')).toBeInTheDocument();
|
||||
expect(screen.getByText('Drinks')).toBeInTheDocument();
|
||||
expect(screen.getByText(/Barcode: 123456/)).toBeInTheDocument();
|
||||
expect(screen.queryByText(/bottle/i)).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
@@ -17,7 +17,7 @@ import EditIcon from '@mui/icons-material/Edit';
|
||||
import CheckIcon from '@mui/icons-material/Check';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import { ChangeEvent, useEffect, useState } from 'react';
|
||||
import { DEFAULT_UNIT_TYPE, Product } from '../models/Product';
|
||||
import { Product } from '../models/Product';
|
||||
import { BarcodeScannerView } from './BarcodeScannerView';
|
||||
|
||||
interface ProductRowProps {
|
||||
@@ -139,7 +139,7 @@ export const ProductRow = ({ product, categories, onSave, onDelete }: ProductRow
|
||||
<div>
|
||||
<Typography variant="subtitle1">{product.name}</Typography>
|
||||
<Typography variant="caption" color="text.secondary">
|
||||
{product.category} • {product.unit_type || DEFAULT_UNIT_TYPE}
|
||||
{product.category}
|
||||
</Typography>
|
||||
</div>
|
||||
{product.barcode ? (
|
||||
|
||||
Reference in New Issue
Block a user