test: grouppaneltree render

pull/13/head
moonrailgun 4 years ago
parent 3fabb6f683
commit 17b68bf977

@ -16,6 +16,7 @@ module.exports = {
'<rootDir>/test/fileTransformer.js',
},
transformIgnorePatterns: ['/node_modules/'],
setupFiles: ['<rootDir>/test/setup.js'],
setupFilesAfterEnv: [],
globals: {
window: {},

@ -0,0 +1,3 @@
export const t = (key: string) => {
return key;
};

@ -100,3 +100,4 @@ export {
version,
} from './utils/environment';
export { getTextColorHex } from './utils/string-helper';
export { sleep } from './utils/utils';

@ -0,0 +1,10 @@
/**
* JavaScript sleep
* https://github.com/sqren/await-sleep/blob/master/index.js
* @param milliseconds
*/
export function sleep(milliseconds: number): Promise<void> {
return new Promise((resolve) => {
setTimeout(resolve, milliseconds);
});
}

@ -0,0 +1,8 @@
// https://github.com/testing-library/react-testing-library#suppressing-unnecessary-warnings-on-react-dom-168
const originalError = console.error;
console.error = (...args) => {
if (/Warning.*not wrapped in act/.test(args[0])) {
return;
}
originalError.call(console, ...args);
};

@ -0,0 +1,53 @@
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';
describe('GroupPanelTree', () => {
const testGroupPanels: GroupPanel[] = [
{
id: '00',
name: 'section-1',
type: GroupPanelType.GROUP,
},
{
id: '01',
name: 'panel-01',
type: GroupPanelType.TEXT,
parentId: '00',
},
{
id: '02',
name: 'panel-02',
type: GroupPanelType.TEXT,
parentId: '00',
},
{
id: '10',
name: 'section-2',
type: GroupPanelType.GROUP,
},
{
id: '11',
name: 'panel-11',
type: GroupPanelType.TEXT,
parentId: '10',
},
{
id: '12',
name: 'panel-12',
type: GroupPanelType.TEXT,
parentId: '10',
},
];
test('simple render snapshot', async () => {
const onChange = jest.fn();
const wrapper = render(
<GroupPanelTree groupPanels={testGroupPanels} onChange={onChange} />
);
expect(wrapper.container).toMatchSnapshot();
});
});

@ -0,0 +1,242 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`GroupPanelTree simple render snapshot 1`] = `
<div>
<div
class="ant-tree ant-tree-icon-hide"
>
<div
role="tree"
>
<input
style="width: 0px; height: 0px; display: flex; overflow: hidden; opacity: 0; border: 0px; padding: 0px; margin: 0px;"
tabindex="0"
value=""
/>
</div>
<div
aria-hidden="true"
class="ant-tree-treenode"
style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;"
>
<div
class="ant-tree-indent"
>
<div
class="ant-tree-indent-unit"
/>
</div>
</div>
<div
class="ant-tree-list"
style="position: relative;"
>
<div
class="ant-tree-list-holder"
>
<div>
<div
class="ant-tree-list-holder-inner"
style="display: flex; flex-direction: column;"
>
<div
class="ant-tree-treenode ant-tree-treenode-switcher-open"
>
<span
aria-hidden="true"
class="ant-tree-indent"
/>
<span
class="ant-tree-switcher ant-tree-switcher_open"
>
<span
aria-label="caret-down"
class="anticon anticon-caret-down ant-tree-switcher-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="caret-down"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
/>
</svg>
</span>
</span>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-open draggable"
draggable="true"
title="section-1"
>
<span
class="ant-tree-title"
>
section-1
</span>
</span>
</div>
<div
class="ant-tree-treenode"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal draggable"
draggable="true"
title="panel-01"
>
<span
class="ant-tree-title"
>
panel-01
</span>
</span>
</div>
<div
class="ant-tree-treenode ant-tree-treenode-leaf-last"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal draggable"
draggable="true"
title="panel-02"
>
<span
class="ant-tree-title"
>
panel-02
</span>
</span>
</div>
<div
class="ant-tree-treenode ant-tree-treenode-switcher-open ant-tree-treenode-leaf-last"
>
<span
aria-hidden="true"
class="ant-tree-indent"
/>
<span
class="ant-tree-switcher ant-tree-switcher_open"
>
<span
aria-label="caret-down"
class="anticon anticon-caret-down ant-tree-switcher-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="caret-down"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
/>
</svg>
</span>
</span>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-open draggable"
draggable="true"
title="section-2"
>
<span
class="ant-tree-title"
>
section-2
</span>
</span>
</div>
<div
class="ant-tree-treenode"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-end"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal draggable"
draggable="true"
title="panel-11"
>
<span
class="ant-tree-title"
>
panel-11
</span>
</span>
</div>
<div
class="ant-tree-treenode ant-tree-treenode-leaf-last"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-end"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
aria-grabbed="true"
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal draggable"
draggable="true"
title="panel-12"
>
<span
class="ant-tree-title"
>
panel-12
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;
Loading…
Cancel
Save