import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import Card from '../src/components/home/Card.jsx';

describe('Card Component', () => {
  it('should render the Card component with the given ID', () => {
    const testId = '123';
    render(<Card id={testId} color={"FFA500FF"}/>);

    const cardElement = screen.getByText(/123/i);
    expect(cardElement).toBeInTheDocument();
  });

  it('should store the ID in local storage when clicked', () => {
    const testId = '456';
    render(<Card id={testId} color={"FFA500FF"}/>);

    const cardElement = screen.getByText(/456/i);
    fireEvent.click(cardElement);

    expect(localStorage.setItem).toHaveBeenCalledWith('selectedId', testId);
  });
});