adds jss snippet test

Author: mohanrajpac

src/components/snippets/JsSnippet.tsx

@@ -3,7 +3,7 @@ import { useMemo } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import Clipboard from '../common/Clipboard';
 
-export default function ({ flag }: { flag: string }): JSX.Element {
+const JsSnippet = ({ flag }: { flag: string }) => {
 	const jsSnippet = useMemo(() => {
 		return `import domReady from '@wordpress/dom-ready';
 domReady(function () {
@@ -22,4 +22,6 @@ domReady(function () {
 			<Snippet data={jsSnippet} language={'typescript'} />
 		</div>
 	);
-}
+};
+
+export default JsSnippet;

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

@@ -0,0 +1,28 @@
+import JsSnippet from '../JsSnippet';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+
+describe('JsSnippet component', () => {
+	test('should render JsSnippet correctly with passed flag prop', async () => {
+		render(<JsSnippet flag="testFlag" />);
+		const result = screen.getByText(/JavaScript Snippet/i);
+		expect(result).toBeInTheDocument();
+	});
+
+	test('should render the correct JavaScript snippet with the passed flag', async () => {
+		render(<JsSnippet flag="testFlag" />);
+		const snip = screen.getByText(/.codebFeatureFlags.isEnabled/i);
+		expect(snip).toBeInTheDocument();
+	});
+
+	test('should update the JavaScript snippet when the flag prop changes', async () => {
+		const { rerender } = render(<JsSnippet flag="testFlag1" />);
+		let snip = screen.getByText(/testFlag1'/i);
+		expect(snip).toBeInTheDocument();
+		rerender(<JsSnippet flag="testFlag2" />);
+		snip = screen.queryByText(/'testFlag1'/i);
+		expect(snip).toBeNull();
+		snip = screen.getByText(/'testFlag2'/i);
+		expect(snip).toBeInTheDocument();
+	});
+});