stash

packages/devui/jest.config.js

@@ -1,4 +1,4 @@
 module.exports = {
   preset: 'ts-jest',
-  setupFilesAfterEnv: ['<rootDir>/tests/setup.js'],
+  setupFilesAfterEnv: ['<rootDir>/tests/setup.ts'],
 };

packages/devui/tests/Container.test.tsx

@@ -7,7 +7,7 @@ describe('Container', function () {
   it('renders correctly', () => {
     const wrapper = render(
       <Container
-        themeData={{ theme: 'default', scheme: 'default', invert: false }}
+        themeData={{ theme: 'default', scheme: 'default', light: false }}
       >
         Text
       </Container>

packages/devui/tests/ContextMenu.test.tsx

@@ -7,7 +7,14 @@ import { items } from '../src/ContextMenu/data';
 describe('ContextMenu', function () {
   it('renders correctly', () => {
     const wrapper = render(
-      <ContextMenu items={items} onClick={() => {}} x={100} y={100} />
+      <ContextMenu
+        items={items}
+        onClick={() => {
+          // noop
+        }}
+        x={100}
+        y={100}
+      />
     );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });

packages/devui/tests/Dialog.test.tsx

@@ -5,13 +5,32 @@ import { Dialog } from '../src';
 
 describe('Dialog', function () {
   it('renders correctly', () => {
-    const wrapper = render(<Dialog />);
+    const wrapper = render(
+      <Dialog
+        onDismiss={() => {
+          // noop
+        }}
+        onSubmit={() => {
+          // noop
+        }}
+      />
+    );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });
 
   it('renders with props', () => {
     const wrapper = render(
-      <Dialog title="Dialog Title" open fullWidth>
+      <Dialog
+        title="Dialog Title"
+        open
+        fullWidth
+        onDismiss={() => {
+          // noop
+        }}
+        onSubmit={() => {
+          // noop
+        }}
+      >
         Hello Dialog!
       </Dialog>
     );
@@ -19,13 +38,31 @@ describe('Dialog', function () {
   });
 
   it('renders modal', () => {
-    const wrapper = render(<Dialog modal />);
+    const wrapper = render(
+      <Dialog
+        modal
+        onDismiss={() => {
+          // noop
+        }}
+        onSubmit={() => {
+          // noop
+        }}
+      />
+    );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });
 
   it('should handle dismiss event', () => {
     const onDismiss = jest.fn();
-    const wrapper = mount(<Dialog open onDismiss={onDismiss} />);
+    const wrapper = mount(
+      <Dialog
+        open
+        onDismiss={onDismiss}
+        onSubmit={() => {
+          // noop
+        }}
+      />
+    );
 
     wrapper.find('button').first().simulate('click');
     expect(onDismiss).toBeCalled();
@@ -33,7 +70,15 @@ describe('Dialog', function () {
 
   it('should handle submit event', () => {
     const onSubmit = jest.fn();
-    const wrapper = mount(<Dialog open onSubmit={onSubmit} />);
+    const wrapper = mount(
+      <Dialog
+        open
+        onDismiss={() => {
+          // noop
+        }}
+        onSubmit={onSubmit}
+      />
+    );
 
     wrapper.find('button').last().simulate('click');
     expect(onSubmit).toBeCalled();

packages/devui/tests/Editor.test.tsx

@@ -25,7 +25,14 @@ describe('Editor', function () {
 
     return range;
   };
-  const wrapper = mount(<Editor value="var a = 1;" />);
+  const wrapper = mount(
+    <Editor
+      value="var a = 1;"
+      onChange={() => {
+        //noop
+      }}
+    />
+  );
 
   it('renders correctly', () => {
     expect(mountToJson(wrapper)).toMatchSnapshot();

packages/devui/tests/Select.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, mount } from 'enzyme';
+import { render, mount, CommonWrapper, ReactWrapper } from 'enzyme';
 import { renderToJson, mountToJson } from 'enzyme-to-json';
 import { Select } from '../src';
 import { options } from '../src/Select/options';
@@ -35,7 +35,7 @@ describe('Select', function () {
     );
 
     const input = wrapper.find('input');
-    input.at(0).instance().value = 'two';
+    ((input.at(0).instance() as unknown) as HTMLInputElement).value = 'two';
     input.first().simulate('change');
     expect(mountToJson(wrapper)).toMatchSnapshot();
     input.first().simulate('keyDown', { keyCode: 13 });
@@ -47,7 +47,7 @@ describe('Select', function () {
     const wrapper = mount(<Select options={options} onChange={onChange} />);
 
     const input = wrapper.find('input');
-    input.at(0).instance().value = 'text';
+    ((input.at(0).instance() as unknown) as HTMLInputElement).value = 'text';
     input.first().simulate('change');
     expect(mountToJson(wrapper)).toMatchSnapshot(); // 'No results found'
     input.first().simulate('keyDown', { keyCode: 13 });

packages/devui/tests/Slider.test.tsx

@@ -5,7 +5,13 @@ import { Slider } from '../src';
 
 describe('Slider', function () {
   it('renders correctly', () => {
-    const wrapper = render(<Slider />);
+    const wrapper = render(
+      <Slider
+        onChange={() => {
+          // noop
+        }}
+      />
+    );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });
 
@@ -16,9 +22,10 @@ describe('Slider', function () {
         min={1}
         max={10}
         value={5}
-        step={1}
         disabled
-        onChange={() => {}}
+        onChange={() => {
+          // noop
+        }}
       />
     );
     expect(renderToJson(wrapper)).toMatchSnapshot();
@@ -26,7 +33,7 @@ describe('Slider', function () {
 
   it('should handle the change event', () => {
     const onChange = jest.fn();
-    const wrapper = mount(<Slider value={1} autoFocus onChange={onChange} />);
+    const wrapper = mount(<Slider value={1} onChange={onChange} />);
 
     wrapper.find('input').simulate('change');
     expect(onChange).toBeCalled();

packages/devui/tests/Tabs.test.tsx

@@ -6,20 +6,39 @@ import { tabs, simple10Tabs } from '../src/Tabs/data';
 
 describe('Tabs', function () {
   it('renders correctly', () => {
-    const wrapper = render(<Tabs tabs={tabs} onClick={() => {}} />);
+    const wrapper = render(
+      <Tabs
+        tabs={tabs}
+        onClick={() => {
+          // noop
+        }}
+      />
+    );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });
 
   it('renders with props', () => {
     const wrapper = render(
-      <Tabs tabs={tabs} onClick={() => {}} selected="Tab2" />
+      <Tabs
+        tabs={tabs}
+        onClick={() => {
+          // noop
+        }}
+        selected="Tab2"
+      />
     );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });
 
   it('renders tabs without inner components', () => {
     const wrapper = render(
-      <Tabs tabs={simple10Tabs} onClick={() => {}} selected="5" />
+      <Tabs
+        tabs={simple10Tabs}
+        onClick={() => {
+          // noop
+        }}
+        selected="5"
+      />
     );
     expect(renderToJson(wrapper)).toMatchSnapshot();
   });

packages/devui/tests/__snapshots__/Editor.test.tsx.snap

@@ -7,6 +7,7 @@ exports[`Editor renders correctly 1`] = `
   lineNumbers={true}
   lineWrapping={false}
   mode="javascript"
+  onChange={[Function]}
   readOnly={false}
   value="var a = 1;"
 >

packages/devui/tests/__snapshots__/Notification.test.js.snap

@@ -1,51 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Notification renders correctly 1`] = `
-<div
-  class="sc-fznKkj ibIwiW"
-  type="info"
->
-  <span>
-    Message
-  </span>
-</div>
-`;
-
-exports[`Notification renders with props 1`] = `
-<div
-  class="sc-fznKkj ibIwiW"
-  type="error"
->
-  <svg
-    fill="currentColor"
-    height="1em"
-    stroke="currentColor"
-    stroke-width="0"
-    viewBox="0 0 24 24"
-    width="1em"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
-    />
-  </svg>
-  <span>
-    Message
-  </span>
-  <button>
-    <svg
-      fill="currentColor"
-      height="1em"
-      stroke="currentColor"
-      stroke-width="0"
-      viewBox="0 0 24 24"
-      width="1em"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-      />
-    </svg>
-  </button>
-</div>
-`;

packages/devui/tests/__snapshots__/SegmentedControl.test.js.snap

@@ -1,24 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`SegmentedControl renders correctly 1`] = `
-<div
-  class="sc-fznyAO jQfpYK"
->
-  <button
-    data-selected="true"
-    value="Button1"
-  >
-    Button1
-  </button>
-  <button
-    value="Button2"
-  >
-    Button2
-  </button>
-  <button
-    value="Button3"
-  >
-    Button3
-  </button>
-</div>
-`;

packages/devui/tests/__snapshots__/Slider.test.js.snap

@@ -1,33 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Slider renders correctly 1`] = `
-<div
-  class="sc-AxheI ikoHwk"
->
-  <input
-    max="100"
-    min="0"
-    type="range"
-    value="0"
-  />
-</div>
-`;
-
-exports[`Slider renders with props 1`] = `
-<div
-  class="sc-AxheI bySZMR"
-  disabled=""
->
-  <label>
-    Hi 
-  </label>
-  <input
-    disabled=""
-    max="10"
-    min="1"
-    step="1"
-    type="range"
-    value="5"
-  />
-</div>
-`;

packages/devui/tests/__snapshots__/Tabs.test.js.snap

@@ -1,129 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Tabs renders correctly 1`] = `
-<div
-  class="sc-fzplWN iQpDbE"
->
-  <div
-    class="sc-fzpans gRdChJ"
-  >
-    <div>
-      <button
-        value="Tab1"
-      >
-        Tab1
-      </button>
-      <button
-        value="Tab2"
-      >
-        Tab2
-      </button>
-      <button
-        value="Tab3"
-      >
-        Tab3
-      </button>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Tabs renders tabs without inner components 1`] = `
-<div
-  class="sc-fzplWN iQpDbE"
->
-  <div
-    class="sc-fzpans gRdChJ"
-  >
-    <div>
-      <button
-        value="1"
-      >
-        Tab1
-      </button>
-      <button
-        value="2"
-      >
-        Tab2
-      </button>
-      <button
-        value="3"
-      >
-        Tab3
-      </button>
-      <button
-        value="4"
-      >
-        Tab4
-      </button>
-      <button
-        data-selected="true"
-        value="5"
-      >
-        Tab5
-      </button>
-      <button
-        value="6"
-      >
-        Tab6
-      </button>
-      <button
-        value="7"
-      >
-        Tab7
-      </button>
-      <button
-        value="8"
-      >
-        Tab8
-      </button>
-      <button
-        value="9"
-      >
-        Tab9
-      </button>
-      <button
-        value="10"
-      >
-        Tab10
-      </button>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Tabs renders with props 1`] = `
-<div
-  class="sc-fzplWN iQpDbE"
->
-  <div
-    class="sc-fzpans gRdChJ"
-  >
-    <div>
-      <button
-        value="Tab1"
-      >
-        Tab1
-      </button>
-      <button
-        data-selected="true"
-        value="Tab2"
-      >
-        Tab2
-      </button>
-      <button
-        value="Tab3"
-      >
-        Tab3
-      </button>
-    </div>
-  </div>
-  <div>
-    <div
-      style="display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:22px"
-    >
-      Selected Tab2
-    </div>
-  </div>
-</div>
-`;

packages/devui/tests/__snapshots__/Toolbar.test.js.snap

@@ -1,38 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Toolbar renders correctly 1`] = `
-<div
-  class="sc-fznZeY bcKxBO"
->
-  <div
-    class="sc-AxhUy dkmwYZ"
-  >
-    <button
-      class="sc-AxiKw jvXzBz"
-    >
-      1
-    </button>
-  </div>
-  <div
-    class="sc-fzokOt drZiIn"
-  />
-  <div
-    class="sc-fzqBZW kjCEpb"
-  />
-  <div
-    class="sc-AxhUy dkmwYZ"
-  >
-    <button
-      class="sc-AxiKw jvXzBz"
-    >
-      2
-    </button>
-  </div>
-</div>
-`;
-
-exports[`Toolbar renders with props 1`] = `
-<div
-  class="sc-fznZeY csZTMz"
-/>
-`;