test: add testcase for rebuildGroupPanelOrder

web/src/components/modals/GroupDetail/Panel/GroupPanelTree.tsx

@@ -37,7 +37,7 @@ function buildTreeDataWithGroupPanel(
 /**
  * 重新构建面板顺序
  */
-function rebuildGroupPanelOrder(
+export function rebuildGroupPanelOrder(
   groupPanels: GroupPanelInfo[]
 ): GroupPanelInfo[] {
   const originGroupPanels = _cloneDeep(groupPanels);

web/src/components/modals/GroupDetail/Panel/__tests__/GroupPanelTree.spec.tsx

@@ -2,46 +2,46 @@ jest.mock('tailchat-shared/i18n');
 import { render } from '@testing-library/react';
 import React from 'react';
 import { GroupPanel, GroupPanelType } from 'tailchat-shared';
-import { GroupPanelTree } from '../GroupPanelTree';
+import { GroupPanelTree, rebuildGroupPanelOrder } from '../GroupPanelTree';
 
-describe('GroupPanelTree', () => {
+const testGroupPanels: GroupPanel[] = [
-  const testGroupPanels: GroupPanel[] = [
+  {
-    {
+    id: '00',
-      id: '00',
+    name: 'section-1',
-      name: 'section-1',
+    type: GroupPanelType.GROUP,
-      type: GroupPanelType.GROUP,
+  },
-    },
+  {
-    {
+    id: '01',
-      id: '01',
+    name: 'panel-01',
-      name: 'panel-01',
+    type: GroupPanelType.TEXT,
-      type: GroupPanelType.TEXT,
+    parentId: '00',
-      parentId: '00',
+  },
-    },
+  {
-    {
+    id: '02',
-      id: '02',
+    name: 'panel-02',
-      name: 'panel-02',
+    type: GroupPanelType.TEXT,
-      type: GroupPanelType.TEXT,
+    parentId: '00',
-      parentId: '00',
+  },
-    },
+  {
-    {
+    id: '10',
-      id: '10',
+    name: 'section-2',
-      name: 'section-2',
+    type: GroupPanelType.GROUP,
-      type: GroupPanelType.GROUP,
+  },
-    },
+  {
-    {
+    id: '11',
-      id: '11',
+    name: 'panel-11',
-      name: 'panel-11',
+    type: GroupPanelType.TEXT,
-      type: GroupPanelType.TEXT,
+    parentId: '10',
-      parentId: '10',
+  },
-    },
+  {
-    {
+    id: '12',
-      id: '12',
+    name: 'panel-12',
-      name: 'panel-12',
+    type: GroupPanelType.TEXT,
-      type: GroupPanelType.TEXT,
+    parentId: '10',
-      parentId: '10',
+  },
-    },
+];
-  ];
 
+describe('GroupPanelTree', () => {
   test('simple render snapshot', async () => {
     const onChange = jest.fn();
     const wrapper = render(
@@ -51,3 +51,48 @@ describe('GroupPanelTree', () => {
     expect(wrapper.container).toMatchSnapshot();
   });
 });
+
+describe('rebuildGroupPanelOrder', () => {
+  test('ref is changed', () => {
+    expect(rebuildGroupPanelOrder(testGroupPanels)).not.toBe(testGroupPanels);
+    expect(rebuildGroupPanelOrder(testGroupPanels)[0]).not.toBe(
+      testGroupPanels[0]
+    );
+  });
+
+  test('keep order if right', () => {
+    expect(rebuildGroupPanelOrder(testGroupPanels)).toEqual(testGroupPanels);
+  });
+
+  test('child should after parent', () => {
+    expect(
+      rebuildGroupPanelOrder([testGroupPanels[1], testGroupPanels[0]])
+    ).toEqual([testGroupPanels[0], testGroupPanels[1]]);
+  });
+
+  test('switch position should keep origin order', () => {
+    expect(
+      rebuildGroupPanelOrder([
+        testGroupPanels[1],
+        testGroupPanels[2],
+        testGroupPanels[0],
+      ])
+    ).toEqual([testGroupPanels[0], testGroupPanels[1], testGroupPanels[2]]);
+  });
+
+  test('switch position should keep origin order(group)', () => {
+    expect(
+      rebuildGroupPanelOrder([
+        testGroupPanels[1],
+        testGroupPanels[2],
+        testGroupPanels[0],
+        testGroupPanels[3],
+      ])
+    ).toEqual([
+      testGroupPanels[0],
+      testGroupPanels[1],
+      testGroupPanels[2],
+      testGroupPanels[3],
+    ]);
+  });
+});