From a49f272a138cbe4cc5da3807dea1c34ce00e09c6 Mon Sep 17 00:00:00 2001
From: HyeongSeoku <gudtjr3437@naver.com>
Date: Fri, 21 Jul 2023 17:04:22 +0900
Subject: [PATCH 1/2] test: delimiter default case

---
 test/delimiter.test.tsx | 42 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 test/delimiter.test.tsx

diff --git a/test/delimiter.test.tsx b/test/delimiter.test.tsx
new file mode 100644
index 0000000..f4b43d9
--- /dev/null
+++ b/test/delimiter.test.tsx
@@ -0,0 +1,42 @@
+import { cleanup, fireEvent, getByRole, render } from '@testing-library/react';
+import { ReactMultiEmail } from '../react-multi-email';
+import React from 'react';
+
+afterEach(cleanup);
+
+describe('ReactMultiEmail delimiter TEST', () => {
+  it('Default delimiter test', () => {
+    const { getByRole } = render(
+      <ReactMultiEmail
+        getLabel={(email, index, removeEmail) => (
+          <div data-tag key={index}>
+            <div data-tag-item>{email}</div>
+            <span data-tag-handle onClick={() => removeEmail(index)}>
+              ×
+            </span>
+          </div>
+        )}
+      />,
+    );
+
+    const inputElem = getByRole('textbox');
+    const emailsWrapper = document.querySelector('.data-labels');
+    const MAX_TEST_CASE = 3;
+
+    for (let i = 0; i < MAX_TEST_CASE; i++) {
+      const testValue = i === 0 ? 'test@gmail.com' : i === 1 ? 'test@naver.com' : 'test@tt.com';
+      const delimiter = i === 0 ? ' ' : i === 1 ? ',' : ';';
+
+      fireEvent.change(inputElem, { target: { value: testValue } });
+      expect(emailsWrapper?.childElementCount).toEqual(i);
+      fireEvent.change(inputElem, { target: { value: `${testValue}${delimiter}` } });
+      expect(emailsWrapper?.childElementCount).toEqual(i + 1);
+    }
+    // 중복 체크
+    const duplicationValue = 'test@gmail.com';
+    fireEvent.change(inputElem, { target: { value: duplicationValue } });
+    expect(emailsWrapper?.childElementCount).toEqual(MAX_TEST_CASE);
+    fireEvent.change(inputElem, { target: { value: `${duplicationValue};` } });
+    expect(emailsWrapper?.childElementCount).toEqual(MAX_TEST_CASE);
+  });
+});

From a1a46fd1bf8ca6c3ea9af2aea0674534858911f1 Mon Sep 17 00:00:00 2001
From: HyeongSeoku <gudtjr3437@naver.com>
Date: Fri, 21 Jul 2023 17:08:29 +0900
Subject: [PATCH 2/2] test: delimiter custom case

---
 test/delimiter.test.tsx | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/test/delimiter.test.tsx b/test/delimiter.test.tsx
index f4b43d9..041f016 100644
--- a/test/delimiter.test.tsx
+++ b/test/delimiter.test.tsx
@@ -39,4 +39,39 @@ describe('ReactMultiEmail delimiter TEST', () => {
     fireEvent.change(inputElem, { target: { value: `${duplicationValue};` } });
     expect(emailsWrapper?.childElementCount).toEqual(MAX_TEST_CASE);
   });
+
+  it('Custom delimiter test', () => {
+    const { getByRole } = render(
+      <ReactMultiEmail
+        delimiter='[&/]'
+        getLabel={(email, index, removeEmail) => (
+          <div data-tag key={index}>
+            <div data-tag-item>{email}</div>
+            <span data-tag-handle onClick={() => removeEmail(index)}>
+              ×
+            </span>
+          </div>
+        )}
+      />,
+    );
+    const inputElem = getByRole('textbox');
+    const emailsWrapper = document.querySelector('.data-labels');
+    const MAX_TEST_CASE = 2;
+
+    for (let i = 0; i < MAX_TEST_CASE; i++) {
+      const testValue = i === 0 ? 'test@gmail.com' : 'test@naver.com';
+      const delimiter = i === 0 ? '&' : '/';
+
+      fireEvent.change(inputElem, { target: { value: testValue } });
+      expect(emailsWrapper?.childElementCount).toEqual(i);
+      fireEvent.change(inputElem, { target: { value: `${testValue}${delimiter}` } });
+      expect(emailsWrapper?.childElementCount).toEqual(i + 1);
+    }
+    // 중복 체크
+    const duplicationValue = 'test@gmail.com';
+    fireEvent.change(inputElem, { target: { value: duplicationValue } });
+    expect(emailsWrapper?.childElementCount).toEqual(MAX_TEST_CASE);
+    fireEvent.change(inputElem, { target: { value: `${duplicationValue}/` } });
+    expect(emailsWrapper?.childElementCount).toEqual(MAX_TEST_CASE);
+  });
 });