Implement testing library (#2)

Co-authored-by: Eric NGUYEN <enguyen@techform.fr>
Reviewed-on: https://git.siklos-chaneru.duckdns.org/Siklos/svg-layout-designer-react/pulls/2

src/Components/Sidebar/Sidebar.test.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { describe, test, expect } from 'vitest';
+import { render, screen } from '../../utils/test-utils';
+import Sidebar from './Sidebar';
+
+describe('Sidebar test', () => {
+  test('Start empty', () => {
+    render(
+      <Sidebar
+        componentOptions={[]}
+        isOpen={true}
+        onClick={() => {}}
+        buttonOnClick={() => {}}
+      />
+    );
+
+    expect(screen.getByText(/Components/i)).toBeDefined();
+  });
+});

src/test/setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

src/utils/test-utils.tsx

@@ -0,0 +1,20 @@
+/* eslint-disable import/export */
+import * as React from 'react';
+import { cleanup, render } from '@testing-library/react';
+import { afterEach } from 'vitest';
+
+afterEach(() => {
+  cleanup();
+});
+
+const customRender = (ui: React.ReactElement, options = {}) =>
+  render(ui, {
+    // wrap provider(s) here if needed
+    wrapper: ({ children }) => children,
+    ...options
+  });
+
+export * from '@testing-library/react';
+export { default as userEvent } from '@testing-library/user-event';
+// override render export
+export { customRender as render };