added test for clearing prompt

jonbnewman · Jan 8, 2022 · ce801d5 · ce801d5
1 parent d91e25f
commit ce801d5
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 6 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "use-prompt",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "license": "MIT",
   "author": "Jonathan Newman",
   "description": "Display a react component to a user asynchronously",

diff --git a/stories/components/Prompter/index.tsx b/stories/components/Prompter/index.tsx
@@ -6,10 +6,12 @@ import Message from './Message';
 import Button from './Button';
 import Output from './Output';
 
-export interface Props extends HTMLAttributes<HTMLDivElement> {}
+export interface Props extends HTMLAttributes<HTMLDivElement> {
+  clearable?: boolean;
+}
 
-export const Prompter: FC<Props> = () => {
-  const [prompt, showPrompt, visible] = usePrompt();
+export const Prompter: FC<Props> = ({ clearable = false }) => {
+  const [prompt, showPrompt, visible, clear] = usePrompt();
   const [resolveReason, setResolveReason] = useState<null | string>(null);
   const [rejectReason, setRejectReason] = useState<null | string>(null);
 
@@ -34,8 +36,8 @@ export const Prompter: FC<Props> = () => {
       <div>
         <Button
           variant="contained"
-          onClick={triggerPrompt}
-          disabled={visible}
+          onClick={visible ? clear : triggerPrompt}
+          disabled={visible && !clearable}
           data-testid="show-prompt"
         >
           Show prompt

diff --git a/test/index.test.tsx b/test/index.test.tsx
@@ -27,6 +27,28 @@ describe('Modal Prompt', () => {
     });
   });
 
+  it('can clear a prompt', async () => {
+    const { queryByText, getByTestId } = render(<Prompter clearable />);
+
+    await waitFor(() => {
+      expect(queryByText('Prompt is currently hidden')).toBeInTheDocument();
+    });
+
+    const button = getByTestId('show-prompt');
+    expect(button).not.toHaveAttribute('disabled');
+    expect(queryByText('Are you sure?')).not.toBeInTheDocument();
+
+    fireEvent.click(button);
+    await waitFor(() => {
+      expect(queryByText('Are you sure?')).toBeInTheDocument();
+    });
+
+    fireEvent.click(button);
+    await waitFor(() => {
+      expect(queryByText('Are you sure?')).not.toBeInTheDocument();
+    });
+  });
+
   it('can resolve a prompt', async () => {
     const { queryByText, getByTestId } = render(<Prompter />);