From 6f9aeb5cdc13b95e6e46f8bc7d50764fa7202234 Mon Sep 17 00:00:00 2001
From: whitneywind <78887901+whitneywind@users.noreply.github.com>
Date: Thu, 7 Nov 2024 16:00:40 -0800
Subject: [PATCH] progress bar testing

---
 .../src/__tests__/progressbar.test.tsx        | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 products/statement-generator/src/__tests__/progressbar.test.tsx

diff --git a/products/statement-generator/src/__tests__/progressbar.test.tsx b/products/statement-generator/src/__tests__/progressbar.test.tsx
new file mode 100644
index 00000000..46d91f8f
--- /dev/null
+++ b/products/statement-generator/src/__tests__/progressbar.test.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import ProgressBar from 'components/ProgressBar';
+
+describe('Progress Bar', () => {
+  // tests that progress bar renders correctly
+  test('renders the progress bar component', () => {
+    render(<ProgressBar percentage={16.67} />);
+    const progressBarElement = screen.getByRole('progressbar');
+    expect(progressBarElement).toBeInTheDocument();
+  });
+
+  // tests that progress bar renders the percentage that it's passed
+  test('progress bar displays the correct percentage', () => {
+    render(<ProgressBar percentage={50} />);
+    const progressBarElement = screen.getByRole('progressbar');
+    expect(progressBarElement).toHaveAttribute('aria-valuenow', '50');
+  });
+
+  // tests that progress bar renders the percentage its passed when completed
+  test('progress bar displays the correct max percentage', () => {
+    render(<ProgressBar percentage={100} />);
+    const progressBarElement = screen.getByRole('progressbar');
+    expect(progressBarElement).toHaveAttribute('aria-valuenow', '100');
+  });
+});