Add test for ProductRow read-only display

This commit is contained in:
beatz174-bit
2025-11-24 07:37:31 +10:00
parent b01fc87403
commit d4f184f69c
2 changed files with 37 additions and 2 deletions
+35
View File
@@ -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();
});
});
+2 -2
View File
@@ -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 ? (