Merge pull request #481 from yaob421123/yb

test(Table): add test

Author: ChenlingasMx

packages/core/src/Table/index.tsx

@@ -26,9 +26,9 @@ const Table = ({ data, columns, rowKey, horizontal = true, style }: TableProps)
   };
 
   return (
-    <ScrollView style={[styles.conW, style]} horizontal={horizontal}>
+    <ScrollView testID="RNE__Table__wrap" style={[styles.conW, style]} horizontal={horizontal}>
       <ScrollView horizontal={!horizontal}>
-        <View style={styles.conTitle}>
+        <View testID="RNE__Table__header" style={styles.conTitle}>
           {columns.map((itm, idx) => (
             <View
               key={itm.dataIndex + idx}
@@ -38,17 +38,19 @@ const Table = ({ data, columns, rowKey, horizontal = true, style }: TableProps)
             </View>
           ))}
         </View>
-        {data.map((item, idx) => {
-          const key = getRowKey(item);
-          return (
-            <BodyRow
-              key={key}
-              columns={columns}
-              record={item}
-              style={{ borderBottomWidth: idx === data.length - 1 ? 1 : 1 }}
-            />
-          );
-        })}
+        <View testID="RNE__Table__body">
+          {data.map((item, idx) => {
+            const key = getRowKey(item);
+            return (
+              <BodyRow
+                key={key}
+                columns={columns}
+                record={item}
+                style={{ borderBottomWidth: idx === data.length - 1 ? 1 : 1 }}
+              />
+            );
+          })}
+        </View>
         {data.length === 0 && <Text style={styles.noDataText}>暂无数据...</Text>}
       </ScrollView>
     </ScrollView>

test-ci/src/__tests__/table.tsx

@@ -0,0 +1,43 @@
+import 'react-native';
+import React from 'react';
+import Table from '../lib/Table';
+import { render } from '@testing-library/react-native';
+import { toObject } from '../utils';
+
+describe('Table', () => {
+  it('columns', () => {
+    const columns = [
+      { title: '姓名', dataIndex: 'name' },
+      { title: '性别', dataIndex: 'sex' },
+      { title: '地址', dataIndex: 'address' },
+    ];
+    const { getByTestId } = render(<Table columns={columns} data={[]} rowKey="id" />);
+    const component = getByTestId('RNE__Table__header');
+    expect(component.props.children).toHaveLength(3);
+  });
+
+  it('data', () => {
+    const data = [{ id: 1 }, { id: 2 }];
+    const { getByTestId } = render(<Table columns={[]} data={data} rowKey="id" />);
+    const component = getByTestId('RNE__Table__body');
+    expect(component.props.children).toHaveLength(2);
+  });
+
+  it('no data', () => {
+    const { getByText } = render(<Table columns={[]} data={[]} rowKey="id" />);
+    expect(getByText('暂无数据...')).toBeTruthy();
+  });
+
+  it('horizontal', () => {
+    const { getByTestId } = render(<Table columns={[]} data={[]} rowKey="id" horizontal={false} />);
+    const component = getByTestId('RNE__Table__wrap');
+    expect(component.props.horizontal).toBe(false);
+  });
+
+  it('style', () => {
+    const { getByTestId } = render(<Table columns={[]} data={[]} rowKey="id" style={{ fontSize: 14 }} />);
+    const component = getByTestId('RNE__Table__wrap');
+    const styles = toObject(component.props.style);
+    expect(styles.fontSize).toBe(14);
+  });
+});