added testcase

__tests__/confirmable.test.js

@@ -0,0 +1,85 @@
+import 'regenerator-runtime/runtime';
+import '@testing-library/jest-dom'; 
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';
+
+import React from 'react';
+import confirmable from '../src/confirmable';
+
+const TestComponent = ({ cancel, dismiss, proceed, show }) => {
+  if (!show) return null;
+
+  return (
+    <div>
+      <button data-testid="cancel-button" onClick={() => cancel('cancel')}>
+        Cancel
+      </button>
+      <button data-testid="dismiss-button" onClick={dismiss}>
+        Dismiss
+      </button>
+      <button data-testid="proceed-button" onClick={() => proceed('proceed')}>
+        Proceed
+      </button>
+    </div>
+  );
+};
+
+const ConfirmableTestComponent = confirmable(TestComponent);
+
+describe('confirmable', () => {
+    test('calls cancel function', async () => {
+        const dispose = jest.fn();
+        const reject = jest.fn();
+        const resolve = jest.fn();
+
+        render(
+          <ConfirmableTestComponent dispose={dispose} reject={reject} resolve={resolve} />
+        );
+
+        fireEvent.click(screen.getByTestId('cancel-button'));
+        await waitFor(() => expect(reject).toHaveBeenCalledWith('cancel'));
+        expect(dispose).toHaveBeenCalledTimes(0);
+      });
+
+      test('calls dismiss function', async () => {
+        const dispose = jest.fn();
+        const reject = jest.fn();
+        const resolve = jest.fn();
+
+        render(
+          <ConfirmableTestComponent dispose={dispose} reject={reject} resolve={resolve} />
+        );
+
+        fireEvent.click(screen.getByTestId('dismiss-button'));
+        await waitFor(() => expect(dispose).toHaveBeenCalledTimes(1));
+      });
+
+      test('calls proceed function', async () => {
+        const dispose = jest.fn();
+        const reject = jest.fn();
+        const resolve = jest.fn();
+
+        render(
+          <ConfirmableTestComponent dispose={dispose} reject={reject} resolve={resolve} />
+        );
+
+        fireEvent.click(screen.getByTestId('proceed-button'));
+        await waitFor(() => expect(resolve).toHaveBeenCalledWith('proceed'));
+      });
+
+
+  test('hides the component when show is false', () => {
+    const { rerender } = render(
+      <TestComponent show={true} />
+    );
+
+    expect(screen.queryByTestId('cancel-button')).toBeInTheDocument();
+    expect(screen.queryByTestId('dismiss-button')).toBeInTheDocument();
+    expect(screen.queryByTestId('proceed-button')).toBeInTheDocument();
+
+    rerender(<TestComponent show={false} />);
+
+    expect(screen.queryByTestId('cancel-button')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('dismiss-button')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('proceed-button')).not.toBeInTheDocument();
+  });
+});

__tests__/createConfirmation.test.js

@@ -0,0 +1,72 @@
+import 'regenerator-runtime/runtime';
+import { fireEvent, waitFor } from '@testing-library/react';
+import { act } from 'react-dom/test-utils';
+
+import React from 'react';
+
+import { createConfirmationCreater } from '../src/createConfirmation';
+import { createDomTreeMounter } from '../src/mounter/domTree';
+
+const MyComponent = ({ resolve, reject }) => (
+  <div>
+    <button onClick={() => resolve('success')}>Resolve</button>
+    <button onClick={() => reject('error')}>Reject</button>
+  </div>
+);
+
+describe('createConfirmationCreater', () => {
+  const mounter = createDomTreeMounter();
+  const spy = jest.spyOn(mounter, 'mount');
+  const unmountSpy = jest.spyOn(mounter, 'unmount');
+  const confirm = createConfirmationCreater(mounter);
+
+  test('mounts and unmounts the component, and resolves the promise', async () => {
+    const confirmMyComponent = confirm(MyComponent);
+
+    let result;
+    await act(async () => {
+      result = confirmMyComponent();
+    });
+
+    await waitFor(() => {
+      expect(spy).toHaveBeenCalled();
+    });
+
+    const resolveButton = document.querySelector('button');
+    await act(async () => {
+      fireEvent.click(resolveButton);
+    });
+
+    await expect(result).resolves.toBe('success');
+
+    await waitFor(() => {
+      expect(unmountSpy).toHaveBeenCalled();
+    });
+  });
+
+  test('mounts and unmounts the component, and rejects the promise', async () => {
+    const confirmMyComponent = confirm(MyComponent);
+
+    let result;
+    await act(async () => {
+      result = confirmMyComponent().catch((e) => e); // ここで.catchを追加してエラーを無視しないようにする
+    });
+
+    await waitFor(() => {
+      expect(spy).toHaveBeenCalled();
+    });
+
+    const rejectButton = document.querySelectorAll('button')[1];
+    await act(async () => {
+      fireEvent.click(rejectButton);
+    });
+
+    const error = await result;
+    expect(error).toBe('error');
+
+    await waitFor(() => {
+      expect(unmountSpy).toHaveBeenCalled();
+    });
+  });
+
+});

__tests__/integration.test.js

@@ -0,0 +1,117 @@
+// integration.test.js
+import 'regenerator-runtime/runtime';
+import '@testing-library/jest-dom';
+
+import { render, screen, fireEvent, act } from '@testing-library/react';
+
+import React from 'react';
+import { createConfirmationCreater, createDomTreeMounter, createReactTreeMounter, confirmable, createMountPoint } from '../src';
+
+const MyComponent = ({ cancel, dismiss, proceed, show }) => {
+  if (!show) return null;
+
+  return (
+    <div>
+      <button data-testid="cancel-button" onClick={() => cancel('cancel')}>
+        Cancel
+      </button>
+      <button data-testid="dismiss-button" onClick={dismiss}>
+        Dismiss
+      </button>
+      <button data-testid="proceed-button" onClick={() => proceed('proceed')}>
+        Proceed
+      </button>
+    </div>
+  );
+};
+
+const ConfirmableMyComponent = confirmable(MyComponent);
+
+// Create the confirm function with createDomTreeMounter
+const confirmWithDomTree = createConfirmationCreater(createDomTreeMounter())(ConfirmableMyComponent);
+
+const reactTreeMounter = createReactTreeMounter();
+// Create the confirm function with createReactTreeMounter
+const confirmWithReactTree = createConfirmationCreater(reactTreeMounter)(ConfirmableMyComponent);
+
+// Create MountPoint for ConfirmableMyComponent with createReactTreeMounter
+const MountPoint = createMountPoint(reactTreeMounter);
+
+const testHelper = async (testCase) => {
+  const { onProceed, onCancel, useMountPoint } = testCase;
+
+  const reactTreeMounter = useMountPoint ? createReactTreeMounter() : null;
+  const confirmFn = useMountPoint
+    ? createConfirmationCreater(reactTreeMounter)(ConfirmableMyComponent)
+    : confirmWithDomTree;
+
+  if (useMountPoint) {
+    const NewMountPoint = createMountPoint(reactTreeMounter);
+    render(<NewMountPoint />);
+  }
+
+  act(() => {
+    confirmFn({}).then(onProceed, onCancel);
+  });
+};
+
+
+  const testProceed = async (useMountPoint = false) => {
+    const onProceed = jest.fn();
+    const onCancel = jest.fn();
+
+    await testHelper({ onProceed, onCancel, useMountPoint });
+
+    expect(screen.getByTestId('proceed-button')).toBeInTheDocument();
+    fireEvent.click(screen.getByTestId('proceed-button'));
+    await act(() => Promise.resolve()); // Wait for the Promise to resolve
+    expect(screen.queryByTestId('proceed-button')).not.toBeInTheDocument();
+
+    expect(onProceed).toHaveBeenCalledWith('proceed');
+    expect(onCancel).not.toHaveBeenCalled(); // Check if onCancel was not called
+  };
+
+  const testCancel = async (useMountPoint = false) => {
+    const onProceed = jest.fn();
+    const onCancel = jest.fn();
+
+    await testHelper({ onProceed, onCancel, useMountPoint });
+
+    expect(screen.getByTestId('cancel-button')).toBeInTheDocument();
+    fireEvent.click(screen.getByTestId('cancel-button'));
+    await act(() => Promise.resolve()); // Wait for the Promise to reject
+    expect(screen.queryByTestId('cancel-button')).not.toBeInTheDocument();
+
+    expect(onProceed).not.toHaveBeenCalled(); // Check if onProceed was not called
+    expect(onCancel).toHaveBeenCalledWith('cancel');
+  };
+
+  const testDismiss = async (useMountPoint = false) => {
+    const onProceed = jest.fn();
+    const onCancel = jest.fn();
+
+    await testHelper({ onProceed, onCancel, useMountPoint });
+
+    expect(screen.getByTestId('dismiss-button')).toBeInTheDocument();
+    fireEvent.click(screen.getByTestId('dismiss-button'));
+    await act(() => Promise.resolve()); // Wait for the Promise to reject
+    expect(screen.queryByTestId('dismiss-button')).not.toBeInTheDocument();
+
+    expect(onProceed).not.toHaveBeenCalled(); // Check if onProceed was not called
+    expect(onCancel).not.toHaveBeenCalled(); // Check if onCancel was not called
+  };
+
+  describe('react-confirm integration test', () => {
+    describe('with createDomTreeMounter', () => {
+      test('proceed works as expected', () => testProceed());
+      test('cancel works as expected', () => testCancel());
+      test('dismiss works as expected', () => testDismiss());
+    });
+
+    describe('with createReactTreeMounter', () => {
+      test('proceed works as expected', () => testProceed(true));
+      test('cancel works as expected', () => testCancel(true));
+      test('dismiss works as expected', () => testDismiss(true));
+    });
+  });
+

__tests__/mounter/domTree.test.js

@@ -0,0 +1,53 @@
+// createDomTreeMounter.test.js
+import 'regenerator-runtime/runtime';
+import '@testing-library/jest-dom/extend-expect';
+
+import { createDomTreeMounter } from '../../src/mounter/domTree';
+import React from 'react';
+
+const MyComponent = () => <div data-testid="my-component">Hello, world!</div>;
+
+describe('createDomTreeMounter', () => {
+  let mounter;
+
+  beforeEach(() => {
+    mounter = createDomTreeMounter();
+  });
+
+  test('mounts a component and unmounts it', async () => {
+    const key = mounter.mount(MyComponent);
+
+    // Wait for the component to mount
+    await new Promise(setTimeout);
+
+    // Check if the component is mounted
+    const mountedComponent = document.querySelector('[data-testid="my-component"]');
+    expect(mountedComponent).toBeInTheDocument();
+
+    mounter.unmount(key);
+
+    // Check if the component is unmounted
+    const unmountedComponent = document.querySelector('[data-testid="my-component"]');
+    expect(unmountedComponent).not.toBeInTheDocument();
+  });
+
+  test('mounts a component in a specific mount node', async () => {
+    const mountNode = document.createElement('div');
+    document.body.appendChild(mountNode);
+
+    const key = mounter.mount(MyComponent, {}, mountNode);
+
+    // Wait for the component to mount
+    await new Promise(setTimeout);
+
+    // Check if the component is mounted in the correct mount node
+    const mountedComponent = mountNode.querySelector('[data-testid="my-component"]');
+    expect(mountedComponent).toBeInTheDocument();
+
+    mounter.unmount(key);
+
+    // Check if the component is unmounted
+    const unmountedComponent = mountNode.querySelector('[data-testid="my-component"]');
+    expect(unmountedComponent).not.toBeInTheDocument();
+  });
+});