diff --git a/src/components/urgent-request/UrgentRequest.test.ts b/src/components/urgent-request/UrgentRequest.test.ts
new file mode 100644
index 0000000000000000000000000000000000000000..c1419c3973e3ffcb6117bf42fb821386651bafe0
--- /dev/null
+++ b/src/components/urgent-request/UrgentRequest.test.ts
@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { render, screen } from '@testing-library/react';
+import UrgentRequest, {
+  UrgentRequestProps,
+} from './UrgentRequest';
+import userEvent from '@testing-library/user-event';
+
+const mockSetUrgent = jest.fn((urgen: boolean) => { });
+
+describe('<UrgentRequest>', () => {
+  it('renders the option to make a contact request urgent', () => {
+    const { getByText, findAllByText } = render(
+      <UrgentRequest urgent={urgent} setUrgent={ mockSetUrgent } />
+    );
+    // Folded urgent box has invisible content
+    const urgentIntro = getByText(/CAUTION:/i);
+    const urgentInput = screen.getByRole('input');
+    const urgentSubmit = screen.getByRole('button');
+    const urgentFold = getByText(/Urgent request\?/i);
+    const noUrgentConfirmation = findAllByText(/Your request was marked urgent/i);
+    
+    expect(urgentIntro).not.toBeVisible();
+
+    // Unfolfing the urgency form
+    userEvent.click(urgentFold);
+    expect(urgentIntro).toBeVisible();
+
+    // Not urgent initially 
+    
+    expect(noUrgentConfirmation).toBe([]);
+    
+    // See expected elements
+    expect(document.body.contains(urgentIntro));
+    expect(urgentIntro).toHaveTextContent(/"URGENT"/)
+    
+    // Expected default values
+    expect(urgentInput).toHaveValue("");
+    expect(urgentSubmit).toBeDisabled();
+
+    // Try typing something that doesn't change the urgent status
+    userEvent.type(urgentInput, "NOT URGENT");
+    expect(urgentInput).toHaveValue("NOT URGENT");
+    expect(urgentSubmit).toBeDisabled();
+
+    // Clear the input
+    userEvent.clear(urgentInput);
+
+    // Fill in URGENT to change the urgent status
+    userEvent.type(urgentInput, "URGENT");
+    // Can click submit now..
+    expect(urgentSubmit).not.toBeDisabled();
+
+    // Clicking it..
+    userEvent.click(urgentSubmit);
+
+    // Triggers a message sent up the hierarchy..
+    expect(mockSetUrgent).toBeCalledWith(true);
+
+    // Which changes the `urgent` prop passed down to it which changes the 
+    // status to urgent.
+    const urgentConfirmation = getByText(/Your request was marked urgent/i);
+    expect(document.body.contains(urgentConfirmation));
+
+    // The urgent form is gone
+    expect(urgentSubmit).not.toBeVisible();
+    expect(urgentInput).not.toBeVisible();
+
+    // A new button apppears that allows the status to be not urgent again.
+    const notUrgentSubmit = screen.getByRole('button');
+    // Clicking it reverts everthing back to the original state.
+    userEvent.click(notUrgentSubmit);
+    expect(document.body.contains(urgentConfirmation)).not.toBeTruthy();
+    expect(urgentInput).toBeVisible();
+    expect(urgentInput).toHaveValue("");
+    expect(urgentSubmit).toBeVisible();
+    expect(notUrgentSubmit).not.toBeVisible();
+  });
+});