Testing con Context/State Management

gistfile1.txt

// Context
const CartContext = createContext(null)

export const CartProvider = ({ children }) => {
  const [items, setItems] = useState([])
  
  const addItem = (item) => setItems([...items, item])
  const removeItem = (id) => setItems(items.filter(i => i.id !== id))
  
  return (
    <CartContext.Provider value={{ items, addItem, removeItem }}>
      {children}
    </CartContext.Provider>
  )
}

// Test Helper
const renderWithCart = (ui, options) => {
  return render(<CartProvider>{ui}</CartProvider>, options)
}

// Test
describe('Cart Integration', () => {
  it('comparte estado entre componentes', async () => {
    const user = userEvent.setup()
    
    renderWithCart(
      <>
        <ProductList />
        <CartSummary />
      </>
    )

    // Agregar desde ProductList
    const addButton = screen.getByRole('button', { name: /add product/i })
    await user.click(addButton)

    // Verificar en CartSummary
    expect(screen.getByText(/1 item/i)).toBeInTheDocument()
  })
})