Add new unit tests and refactor async expectations

Added unit tests for Snippet, Clipboard, checkIfFlagExists function, and SdkModal components. Additionally, refactored end-to-end tests in feature-flags.spec.ts to correctly await asynchronous expectations to improve reliability and readability of tests.

Author: mohanrajpac

src/components/common/__tests__/Clipboard.test.js

@@ -0,0 +1,13 @@
+import Clipboard from '../Clipboard';
+import { render } from '@testing-library/react';
+
+describe('Clipboard', () => {
+	test('Clipboard function', async () => {
+		const text = 'test clipboard';
+
+		const { getByLabelText } = render(<Clipboard text={text} />);
+		const clipboardButton = getByLabelText('Copy to clipboard');
+
+		expect(clipboardButton).toBeInTheDocument();
+	});
+});

src/components/modals/__tests__/SdkModal.test.js

@@ -0,0 +1,19 @@
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import SdkModal from '../SdkModal';
+
+describe('SdkModal component', () => {
+	test('should render modal correctly', async () => {
+		const item = { name: 'Test Flag' };
+		const closeSdkModal = jest.fn();
+		render(<SdkModal item={item} closeSdkModal={closeSdkModal} />);
+
+		expect(
+			screen.getByText(`SDK for feature flag: ${item.name}`),
+		).toBeInTheDocument();
+
+		await userEvent.click(screen.getByLabelText('Close'));
+
+		expect(closeSdkModal).toHaveBeenCalled();
+	});
+});

src/components/snippets/__tests__/Snippet.test.js

@@ -0,0 +1,13 @@
+import { render, screen } from '@testing-library/react';
+import Snippet from '../Snippet';
+
+describe('Snippet component', () => {
+	it('renders without crashing', () => {
+		const data = 'console.log(\'Hello, World!\')';
+		const language = 'javascript';
+
+		render(<Snippet data={data} language={language} />);
+
+		expect(screen.getByText(/'Hello, World!'/)).toBeInTheDocument();
+	});
+});

src/utils/checkIfFlagExists.test.js

@@ -0,0 +1,40 @@
+import { checkIfFlagExists } from './index';
+
+describe('Function: checkIfFlagExists', () => {
+	let flags;
+	let flagName;
+
+	beforeEach(() => {
+		flags = [
+			{ id: 1, name: 'flag1', enabled: true },
+			{ id: 2, name: 'flag2', enabled: false },
+			{ id: 3, name: 'flag3', enabled: true },
+		];
+
+		flagName = 'flag1';
+	});
+
+	test('should return true if flag exists', async () => {
+		const result = checkIfFlagExists(flags, flagName);
+		expect(result).toBe(true);
+	});
+
+	test('should return false if flag does not exist', async () => {
+		flagName = 'nonExistentFlag';
+
+		const result = checkIfFlagExists(flags, flagName);
+		expect(result).toBe(false);
+	});
+
+	test('should return false when flags array is empty', async () => {
+		flags = [];
+		const result = checkIfFlagExists(flags, flagName);
+		expect(result).toBe(false);
+	});
+
+	test('should return false when flagName is empty', async () => {
+		flagName = '';
+		const result = checkIfFlagExists(flags, flagName);
+		expect(result).toBe(false);
+	});
+});

tests/e2e/feature-flags.spec.ts

@@ -48,7 +48,7 @@ test.describe('Feature flags', () => {
 		expect(
 			await page.getByLabel('Dismiss this notice').innerText()
 		).toMatch(/Saved successfully!/);
-		expect(
+		await expect(
 			page
 				.locator('id=mr-feature-flag-item')
 				.last()
@@ -66,13 +66,13 @@ test.describe('Feature flags', () => {
 
 		//Create another flag with same name should show error
 		await AddNewFlagAndFill(page, 'testDuplicate');
-		expect(page.getByText(ERROR_FLAG_EXISTS)).toBeVisible();
-		expect(page.getByRole('button', { name: 'Save' })).toBeDisabled();
+		await expect(page.getByText(ERROR_FLAG_EXISTS)).toBeVisible();
+		await expect(page.getByRole('button', { name: 'Save' })).toBeDisabled();
 
 		//update flag name to be unique but still invalid
 		await AddNewFlag(page, 'test duplicate');
-		expect(page.getByText(ERROR_FLAG_INVALID)).toBeVisible();
-		expect(page.getByRole('button', { name: 'Save' })).toBeDisabled();
+		await expect(page.getByText(ERROR_FLAG_INVALID)).toBeVisible();
+		await expect(page.getByRole('button', { name: 'Save' })).toBeDisabled();
 
 		expect(
 			await page.getByLabel('Dismiss this notice').innerText()
@@ -90,7 +90,7 @@ test.describe('Feature flags', () => {
 
 		await OpenSdkModal(page);
 
-		expect(
+		await expect(
 			page.getByRole('heading', {
 				name: `SDK for feature flag: ${flagName}`,
 			})