From 5a669dbe0a6ce78e64b2215f0dca03bddf43971c Mon Sep 17 00:00:00 2001
From: PBK-B <PBK-B@PBK6.cn>
Date: Wed, 24 Aug 2022 23:52:19 +0800
Subject: [PATCH] test(collapse): add collapse related tests #1280

---
 src/collapse/__tests__/collapse.test.tsx | 36 +++++++++++++++++++++---
 1 file changed, 32 insertions(+), 4 deletions(-)

diff --git a/src/collapse/__tests__/collapse.test.tsx b/src/collapse/__tests__/collapse.test.tsx
index 4430f3b4e4..0117dc6dc1 100644
--- a/src/collapse/__tests__/collapse.test.tsx
+++ b/src/collapse/__tests__/collapse.test.tsx
@@ -1,9 +1,11 @@
 import React from 'react';
-import { testExamples, render } from '@test/utils';
-import Collapse from '../Collapse';
-import CollapsePanal from '../CollapsePanel';
+import { testExamples, render, act, waitFor, fireEvent } from '@test/utils';
+
+import { Collapse } from '..';
 import { TdCollapseProps, TdCollapsePanelProps } from '../type';
 
+const { Panel } = Collapse;
+
 // 测试组件代码 Example 快照
 testExamples(__dirname);
 
@@ -15,14 +17,40 @@ const panelContent =
   '这部分是每个折叠面板折叠或展开的内容，可根据不同业务或用户的使用诉求，进行自定义填充。可以是纯文本、图文、子列表等内容形式。';
 const CollapseTestComponent = (props: TestComponentProps) => (
   <Collapse {...props?.collapse}>
-    <CollapsePanal {...props?.panel}>{panelContent}</CollapsePanal>
+    <Panel {...props?.panel}>{panelContent}</Panel>
   </Collapse>
 );
 
 describe('Collapse Unit Test', () => {
+  // 渲染测试
   test('create', async () => {
     const { container, queryByText } = render(<CollapseTestComponent />);
     expect(container.firstChild.classList.contains('t-collapse')).toBeTruthy();
     expect(queryByText(panelContent)).toBeInTheDocument();
   });
+
+  // 测试点击事件
+  test('click event', async () => {
+    const CollapseTest = () => (
+      <Collapse defaultExpandAll defaultValue="default">
+        <Panel header="这是一个折叠标题" value="default">
+          这部分是每个折叠面板折叠或展开的内容，可根据不同业务或用户的使用诉求，进行自定义填充。可以是纯文本、图文、子列表等内容形式。
+        </Panel>
+      </Collapse>
+    );
+    await act(async () => {
+      render(<CollapseTest />);
+      // 获取 element
+      const element = await waitFor(() => document.querySelector('.t-collapse-panel__header'));
+      expect(element).not.toBeNull();
+
+      // 默认展开，点击关闭
+      fireEvent.click(element);
+      expect(document.querySelector('.t-collapse-panel__body--collapsed')).not.toBeNull();
+
+      // 当前关闭，点击展开
+      fireEvent.click(element);
+      expect(document.querySelector('.t-collapse-panel__body--collapsed')).toBeNull();
+    });
+  });
 });