create panelList.test.js

Author: dev-javascript

src/panelList/__snapshots__/panelList.test.js.snap

@@ -0,0 +1,59 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`PanelList structure :  default options 1`] = `
+<div>
+  <div
+    className="rc-dyn-tabs-panellist rc-dyn-tabs-ltr"
+  >
+    <div
+      aria-hidden={false}
+      aria-labelledby="rc-dyn-tabs-l-1"
+      className="rc-dyn-tabs-panel rc-dyn-tabs-selected"
+      id="rc-dyn-tabs-p-1"
+      role="tabpanel"
+      tab-id="1"
+    >
+      <div />
+    </div>
+    <div
+      aria-hidden={true}
+      aria-labelledby="rc-dyn-tabs-l-2"
+      className="rc-dyn-tabs-panel"
+      id="rc-dyn-tabs-p-2"
+      role="tabpanel"
+      tab-id="2"
+    >
+      <div />
+    </div>
+  </div>
+</div>
+`;
+
+exports[`PanelList structure :  rtl option 1`] = `
+<div>
+  <div
+    className="rc-dyn-tabs-panellist rc-dyn-tabs-rtl"
+  >
+    <div
+      aria-hidden={false}
+      aria-labelledby="rc-dyn-tabs-l-1"
+      className="rc-dyn-tabs-panel rc-dyn-tabs-selected"
+      id="rc-dyn-tabs-p-1"
+      role="tabpanel"
+      tab-id="1"
+    >
+      <div />
+    </div>
+    <div
+      aria-hidden={true}
+      aria-labelledby="rc-dyn-tabs-l-2"
+      className="rc-dyn-tabs-panel"
+      id="rc-dyn-tabs-p-2"
+      role="tabpanel"
+      tab-id="2"
+    >
+      <div />
+    </div>
+  </div>
+</div>
+`;

src/panelList/panelList.test.js

@@ -0,0 +1,56 @@
+import React from "react"
+import { unmountComponentAtNode } from "react-dom";
+import PanelList from "./panelList.js";
+import renderer from 'react-test-renderer';
+import Api from '../utils/api/api.js';
+let container = document.createElement("div"), realUseContext;
+const getDefaultApi = () => ({
+    tabs: [
+        { id: '1', title: 'tab1' },
+        { id: '2', title: 'tab2' },
+    ],
+    selectedTabID: '1'
+});
+const setMockUseContext = (op = {}) => {
+    const defaultOp = getDefaultApi();
+    const instance = new (Api)({ options: Object.assign({}, defaultOp, op) });
+    instance.openTabIDs = ['1', '2'];
+    instance.selectedTabID = '1';
+    React.useContext = jest.fn(() => instance);
+};
+beforeAll(() => {
+    document.body.appendChild(container);
+    realUseContext = React.useContext;
+});
+beforeEach(() => { });
+afterEach(() => {
+    unmountComponentAtNode(container);
+    container.innerHTML = "";
+    React.useContext = realUseContext;
+});
+afterAll(() => {
+    document.body.removeChild(container);
+    container = null;
+});
+describe('PanelList structure : ', () => {
+    test('default options', () => {
+        setMockUseContext();
+        const tree = renderer
+            .create(<div>
+                <PanelList></PanelList>
+            </div>)
+            .toJSON();
+        expect(tree).toMatchSnapshot();
+    });
+    test('rtl option', () => {
+        setMockUseContext({ direction: 'rtl' });
+        const tree = renderer
+            .create(<div>
+                <PanelList></PanelList>
+            </div>)
+            .toJSON();
+        expect(tree).toMatchSnapshot();
+    });
+});
+
+