From ba793e043e4d8515b1a9ea490ee2c5f92b1fd6c2 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Wed, 27 Sep 2023 15:40:16 +0200
Subject: refactor(components): rewrite Section component

* Make it compliant with ESlint rules
* Remove mandatory heading, it now depends on the consumer
* Change defaults for hasBorder and variant
---
 .../atoms/layout/section/section.test.tsx          | 27 ++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 src/components/atoms/layout/section/section.test.tsx

(limited to 'src/components/atoms/layout/section/section.test.tsx')

diff --git a/src/components/atoms/layout/section/section.test.tsx b/src/components/atoms/layout/section/section.test.tsx
new file mode 100644
index 0000000..85305c0
--- /dev/null
+++ b/src/components/atoms/layout/section/section.test.tsx
@@ -0,0 +1,27 @@
+import { describe, expect, it } from '@jest/globals';
+import { render, screen as rtlScreen } from '@testing-library/react';
+import { Section } from './section';
+
+const content = 'Section content.';
+
+describe('Section', () => {
+  it('renders its body', () => {
+    render(<Section>{content}</Section>);
+    expect(rtlScreen.getByText(content)).toBeInTheDocument();
+  });
+
+  it('renders a section with border', () => {
+    render(<Section hasBorder>{content}</Section>);
+    expect(rtlScreen.getByText(content)).toHaveClass('wrapper--borders');
+  });
+
+  it('renders a light section', () => {
+    render(<Section variant="light">{content}</Section>);
+    expect(rtlScreen.getByText(content)).toHaveClass('wrapper--light');
+  });
+
+  it('renders a dark section', () => {
+    render(<Section variant="dark">{content}</Section>);
+    expect(rtlScreen.getByText(content)).toHaveClass('wrapper--dark');
+  });
+});
-- 
cgit v1.2.3