test: add editor test case.

Author: jaywcjlove

core/src/copied.test.tsx

@@ -1,8 +1,6 @@
 import renderer from 'react-test-renderer';
-import {cleanup, screen, fireEvent, render} from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
-import ReactDOM from 'react-dom/client';
-import userEvent from '@testing-library/user-event'
+import { cleanup, screen, fireEvent, render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { Copied } from './copied';
 
 it('renders <Copied /> test case', () => {
@@ -31,6 +29,21 @@ it('renders <Copied /> `show` test case', () => {
   expect(tree).toHaveProperty('props.onClick');
 });
 
+it('renders <Copied /> `click` test case', async () => {
+  const user = userEvent.setup();
+  render(<Copied text={{ a: 1 }} show data-testid="demo2" />);
+  const elm = screen.getByTestId('demo2');
+  await user.click(elm);
+  expect(elm).toBeInstanceOf(SVGSVGElement);
+  const elme = screen.getByTestId('demo2');
+  expect(typeof elme).toEqual('object');
+  expect(elm.style).toHaveProperty('cursor', 'pointer');
+  expect(elm.style).toHaveProperty('vertical-align', 'middle');
+  expect(elm.style).toHaveProperty('margin-left', '5px');
+  expect(elm.getAttribute('fill')).toEqual('var(--w-rjv-copied-success-color, #28a745)');
+  // screen.debug();
+});
+
 it('renders <Copied /> `show` test case', () => {
   function TriangleArrow(props: any) {
     const { style, ...reset } = props;

core/src/editor/countInfoExtra.test.tsx

@@ -1,4 +1,6 @@
 import renderer from 'react-test-renderer';
+import { cleanup, screen, fireEvent, render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { CountInfoExtra } from './countInfoExtra';
 
 
@@ -31,4 +33,85 @@ it('renders <CountInfoExtra /> onAdd test case', () => {
     height: '1em',
     width: '1em',
   });
-});
+});
+
+it('renders <CountInfoExtra /> onDelete/parentValue test case', () => {
+  const component = renderer.create(
+    <CountInfoExtra editable parentValue={{ ab: 1 }} visible showTools value={{ a: 123 }} onDelete={() => true} onAdd={() => true} />
+  );
+  let tree = component.toJSON();
+  expect(Array.isArray(tree)).toBe(true);
+  if (Array.isArray(tree)) {
+    const child1 = tree[1];
+    expect(child1).toHaveProperty('type');
+    expect(child1).toHaveProperty('props');
+    expect(child1).toHaveProperty('children');
+    expect(child1).toHaveProperty('type', 'svg');
+    expect(child1).toHaveProperty('props.fill', 'var(--w-rjv-delete-color, #dc3545)')
+    expect(child1).toHaveProperty('props.viewBox', '0 0 40 40')
+    expect(child1).toHaveProperty('props.style', {
+      verticalAlign: 'middle',
+      display: 'inline-block',
+      cursor: 'pointer',
+      marginLeft: 5,
+      height: '1em',
+      width: '1em',
+    });
+  }
+});
+
+it('renders <CountInfoExtra /> `onDelete/onAdd` test case', async () => {
+  const user = userEvent.setup();
+  const { container } = render(
+    <CountInfoExtra
+      editable
+      visible
+      showTools
+      keyName="ab"
+      parentValue={{ ab: { a: 123 } }}
+      value={{ a: 123 }}
+      onDelete={(keyName, value, parentValue) => {
+        expect(keyName).toEqual('ab');
+        return true;
+      }}
+      setValue={() => { }}
+      setParentValue={() => { }}
+      onAdd={(keyOrValue) => {
+        expect(keyOrValue).toEqual('AddKeyOrValue');
+        return true
+      }}
+    />
+  );
+  expect(container.firstElementChild).toBeInstanceOf(SVGSVGElement);
+  await user.click(container.firstElementChild!);
+  expect(container.lastElementChild).toBeInstanceOf(SVGSVGElement);
+  await user.click(container.lastElementChild!);
+});
+
+it('renders <CountInfoExtra /> `onDelete/onAdd` test case', async () => {
+  const user = userEvent.setup();
+  const { container } = render(
+    <CountInfoExtra
+      editable
+      visible
+      showTools
+      keyName={0}
+      parentValue={['ab', 1, 3]}
+      value={['ab', 1, 3]}
+      onDelete={(keyName, value, parentValue) => {
+        expect(keyName).toEqual(0);
+        return true;
+      }}
+      setValue={() => { }}
+      setParentValue={() => { }}
+      onAdd={(keyOrValue) => {
+        expect(keyOrValue).toEqual('AddKeyOrValue');
+        return true
+      }}
+    />
+  );
+  expect(container.firstElementChild).toBeInstanceOf(SVGSVGElement);
+  await user.click(container.firstElementChild!);
+  expect(container.lastElementChild).toBeInstanceOf(SVGSVGElement);
+  await user.click(container.lastElementChild!);
+});

core/src/editor/value.test.tsx

@@ -118,4 +118,30 @@ it('renders <ReValue /> quotes test case', () => {
     expect(tree[2]).toHaveProperty('props.style', { color: 'var(--w-rjv-type-string-color, #cb4b16)' });
     expect(tree[2]).toHaveProperty('props.data-value', '"test"');
   }
+});
+
+
+it('renders <ReValue /> onDelete test case', () => {
+  const component = renderer.create(
+    <ReValue type="string" displayDataTypes quotes="'" value="test" visible={true} editableValue={true}  onDelete={() => true} />,
+  );
+  const tree = component.toJSON();
+  expect(Array.isArray(tree)).toBe(true);
+  if (Array.isArray(tree)) {
+    expect(tree).toHaveLength(5);
+    const child1 = tree[4];
+    expect(child1).toHaveProperty('props');
+    expect(child1).toHaveProperty('type', 'svg');
+    expect(child1).toHaveProperty('props.style', {
+      verticalAlign: 'middle',
+      display: 'inline-block',
+      cursor: 'pointer',
+      marginLeft: 5,
+      height: '1em',
+      width: '1em'
+    });
+    expect(child1).toHaveProperty('props.onClick');
+    expect(child1).toHaveProperty('props.fill', 'var(--w-rjv-delete-color, #dc3545)');
+    expect(child1).toHaveProperty('props.viewBox', '0 0 40 40');
+  }
 });