Jelajahi Sumber

test(web): Card

Paul Armstrong 4 tahun lalu
induk
melakukan
5ee7146884
2 mengubah file dengan 46 tambahan dan 3 penghapusan
  1. 0 3
      web/src/components/Card.jsx
  2. 46 0
      web/src/components/__tests__/Card.test.jsx

+ 0 - 3
web/src/components/Card.jsx

@@ -9,10 +9,7 @@ export default function Box({
   elevated = true,
   header,
   href,
-  icons,
   media = null,
-  subheader,
-  supportingText,
   ...props
 }) {
   const Element = href ? 'a' : 'div';

+ 46 - 0
web/src/components/__tests__/Card.test.jsx

@@ -0,0 +1,46 @@
+import { h } from 'preact';
+import Card from '../Card';
+import { render, screen } from '@testing-library/preact';
+
+describe('Card', () => {
+  test('renders a Card with media', async () => {
+    render(<Card media={<img src="tacos.jpg" alt="tacos" />} />);
+    expect(screen.queryByAltText('tacos')).toBeInTheDocument();
+  });
+
+  test('renders a Card with a link around media', async () => {
+    render(<Card href="/tacos" media={<img src="tacos.jpg" alt="tacos" />} />);
+    expect(screen.queryByAltText('tacos')).toBeInTheDocument();
+    expect(screen.getByAltText('tacos').closest('a')).toHaveAttribute('href', '/tacos');
+  });
+
+  test('renders a Card with a header', async () => {
+    render(<Card header="Tacos!" />);
+    expect(screen.queryByText('Tacos!')).toBeInTheDocument();
+  });
+
+  test('renders a Card with a linked header', async () => {
+    render(<Card href="/tacos" header="Tacos!" />);
+    expect(screen.queryByText('Tacos!')).toBeInTheDocument();
+    expect(screen.queryByText('Tacos!').closest('a')).toHaveAttribute('href', '/tacos');
+  });
+
+  test('renders content', async () => {
+    const content = <div data-testid="content">hello</div>;
+    render(<Card content={content} />);
+    expect(screen.queryByTestId('content')).toBeInTheDocument();
+  });
+
+  test('renders buttons', async () => {
+    const buttons = [
+      { name: 'Tacos', href: '/tacos' },
+      { name: 'Burritos', href: '/burritos' },
+    ];
+    render(<Card buttons={buttons} />);
+    expect(screen.queryByText('Tacos')).toHaveAttribute('role', 'button');
+    expect(screen.queryByText('Tacos')).toHaveAttribute('href', '/tacos');
+
+    expect(screen.queryByText('Burritos')).toHaveAttribute('role', 'button');
+    expect(screen.queryByText('Burritos')).toHaveAttribute('href', '/burritos');
+  });
+});