Move build to use tsdx as build tool

.github/workflows/main.yml

@@ -0,0 +1,42 @@
+name: CI
+on: [push]
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Begin CI...
+        uses: actions/checkout@v2
+
+      - name: Use Node 12
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12.x
+
+      - name: Use cached node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: nodeModules-${{ hashFiles('yarn.lock') }}
+          restore-keys: |
+            nodeModules-
+
+      - name: Install dependencies
+        run: yarn install --frozen-lockfile
+        env:
+          CI: true
+
+      - name: Lint
+        run: yarn lint
+        env:
+          CI: true
+
+      - name: Test
+        run: yarn test --ci --coverage --maxWorkers=2
+        env:
+          CI: true
+
+      - name: Build
+        run: yarn build
+        env:
+          CI: true

__test_utils__/DynamicInputForm.tsx

@@ -7,7 +7,7 @@ interface DynamicInputFormProps {
   inputName?: string;
 }
 
-class DynamicInputForm extends React.Component<DynamicInputFormProps, { input: typeof TestInput }> {
+class DynamicInputForm extends React.Component<DynamicInputFormProps, { input: any }> {
   constructor(props) {
     super(props);
     this.state = {

__test_utils__/TestInput.tsx

@@ -2,9 +2,9 @@
 import React from 'react';
 
 import { withFormsy } from '../src';
-import { PassDownProps } from '../src/Wrapper';
+import { PassDownProps } from '../src/withFormsy';
 
-export type FormsyInputProps = React.HTMLProps<HTMLInputElement> & PassDownProps<string>;
+export type FormsyInputProps = Omit<React.HTMLProps<HTMLInputElement>, 'required' | 'value'> & PassDownProps<string>;
 
 class TestInput extends React.Component<FormsyInputProps> {
   updateValue = (event) => {
@@ -22,7 +22,7 @@ export function InputFactory(methods) {
       TestInput.prototype[method] = methods[method];
     }
   });
-  return withFormsy<FormsyInputProps, string>(TestInput);
+  return withFormsy<FormsyInputProps, any>(TestInput);
 }
 
-export default withFormsy<FormsyInputProps, string>(TestInput);
+export default withFormsy<FormsyInputProps, any>(TestInput);

__test_utils__/TestInputHoc.tsx

@@ -7,4 +7,4 @@ class TestComponent extends React.Component {
   }
 }
 
-export default withFormsy(TestComponent);
+export default withFormsy(TestComponent as any);

__test_utils__/getInput.ts

@@ -1,11 +1,11 @@
-import { WrapperInstanceMethods } from '../src/Wrapper';
+import { WrapperInstanceMethods } from '../src/withFormsy';
 import Formsy from '../src';
 
 export function getWrapperInstance<V>(inputComponent) {
   return inputComponent.instance() as WrapperInstanceMethods<V>;
 }
 
-export function getInputInstance<V>(inputComponent) {
+export function getInputInstance(inputComponent) {
   return inputComponent.instance() as HTMLInputElement;
 }
 

__tests__/Element-spec.tsx → __tests__/Element.spec.tsx

@@ -1,12 +1,10 @@
-/* eslint-disable react/destructuring-assignment */
-import React from 'react';
-import sinon from 'sinon';
 import { mount } from 'enzyme';
-
-import Formsy, { withFormsy } from '../src';
+import React from 'react';
+import { getFormInstance, getInputInstance, getWrapperInstance } from '../__test_utils__/getInput';
 import immediate from '../__test_utils__/immediate';
 import TestInput, { FormsyInputProps, InputFactory } from '../__test_utils__/TestInput';
-import { getFormInstance, getInputInstance, getWrapperInstance } from '../__test_utils__/getInput';
+
+import Formsy, { withFormsy } from '../src';
 
 describe('Element', () => {
   it('should pass down correct value prop after using setValue()', () => {
@@ -40,13 +38,13 @@ describe('Element', () => {
       </Formsy>,
     );
     const inputComponent = form.find('Formsy(NoValidateInput)');
-    const setStateSpy = sinon.spy(getWrapperInstance(inputComponent), 'setState');
+    const setStateSpy = jest.spyOn(getWrapperInstance(inputComponent) as any, 'setState');
     const inputElement = form.find('input');
 
-    expect(setStateSpy.called).toEqual(false);
+    expect(setStateSpy).not.toHaveBeenCalled();
     inputElement.simulate('change', { target: { value: 'foobar' } });
-    expect(setStateSpy.calledOnce).toEqual(true);
-    expect(setStateSpy.calledWithExactly({ value: 'foobar' })).toEqual(true);
+    expect(setStateSpy).toHaveBeenCalledTimes(1);
+    expect(setStateSpy).toHaveBeenCalledWith({ value: 'foobar' });
   });
 
   it('should set back to pristine value when running reset', () => {
@@ -113,7 +111,7 @@ describe('Element', () => {
     mount(
       <Formsy action="/users">
         <Input name="foo" value="" />
-        <Input name="foo" value="" required />
+        <Input name="foo" value="" required  />
         <Input name="foo" value="foo" required="isLength:3" />
       </Formsy>,
     );
@@ -180,6 +178,7 @@ describe('Element', () => {
         );
       }
     }
+
     const form = mount<TestForm>(<TestForm />);
 
     form.instance().changeValue();
@@ -251,7 +250,7 @@ describe('Element', () => {
   });
 
   it('should be able to run a function to validate', () => {
-    const customValidationA = (values, value) => {
+    const customValidationA = (_values, value) => {
       return value === 'foo';
     };
 
@@ -470,6 +469,7 @@ describe('Element', () => {
         );
       }
     }
+
     const form = mount(<TestForm />);
 
     form.setState({
@@ -505,6 +505,7 @@ describe('Element', () => {
         );
       }
     }
+
     const form = mount<TestForm>(<TestForm />);
 
     const input = form.find('Formsy(TestInput)');
@@ -528,6 +529,7 @@ describe('Element', () => {
         );
       }
     }
+
     const form = mount(<TestForm />);
 
     // TODO: Beef up this smoke test
@@ -552,6 +554,7 @@ describe('Element', () => {
         );
       }
     }
+
     const form = mount(<TestForm />);
 
     // TODO: Beef up this smoke test
@@ -562,7 +565,7 @@ describe('Element', () => {
   });
 
   it('input should rendered once with PureRenderMixin', () => {
-    const renderSpy = sinon.spy();
+    const renderSpy = jest.fn();
 
     const Input = InputFactory({
       shouldComponentUpdate() {
@@ -575,17 +578,17 @@ describe('Element', () => {
       },
     });
 
-    const form = mount(
+    mount(
       <Formsy>
         <Input name="foo" value="foo" />
       </Formsy>,
     );
 
-    expect(renderSpy.calledOnce).toEqual(true);
+    expect(renderSpy).toHaveBeenCalledTimes(1);
   });
 
   it('input should call shouldComponentUpdate with correct value', () => {
-    const renderSpy = sinon.spy();
+    const renderSpy = jest.fn();
 
     const Input = InputFactory({
       shouldComponentUpdate(prevProps) {
@@ -606,11 +609,11 @@ describe('Element', () => {
 
     const input = form.find('input');
 
-    expect(renderSpy.calledOnce).toEqual(true);
+    expect(renderSpy).toHaveBeenCalledTimes(1);
 
     input.simulate('change', { target: { value: 'fooz' } });
     expect(getInputInstance(input).value).toEqual('fooz');
-    expect(renderSpy.calledTwice).toEqual(true);
+    expect(renderSpy).toHaveBeenCalledTimes(2);
   });
 
   it('unregisters on unmount', () => {

__tests__/Formsy-spec.tsx → __tests__/Formsy.spec.tsx

@@ -3,16 +3,16 @@ import { mount } from 'enzyme';
 import * as React from 'react';
 
 import DynamicInputForm from '../__test_utils__/DynamicInputForm';
-import Formsy, { addValidationRule } from '../src';
+import { getFormInstance, getWrapperInstance } from '../__test_utils__/getInput';
 import TestInput from '../__test_utils__/TestInput';
 import TestInputHoc from '../__test_utils__/TestInputHoc';
-import { getFormInstance, getWrapperInstance } from '../__test_utils__/getInput';
+import Formsy, { addValidationRule } from '../src';
 import { ValidationError } from '../src/interfaces';
 
 describe('Setting up a form', () => {
   it('should expose the users DOM node through an innerRef prop', () => {
     class TestForm extends React.Component {
-      public inputRef: typeof TestInputHoc;
+      public inputRef: any;
 
       render() {
         return (
@@ -823,7 +823,7 @@ describe('form valid state', () => {
     let isValid = true;
 
     class TestForm extends React.Component {
-      onValidSubmit = (model, reset, updateInputsWithError) => {
+      onValidSubmit = (_model, _reset, updateInputsWithError) => {
         updateInputsWithError({ foo: 'bar' }, true);
       };
 
@@ -859,7 +859,7 @@ describe('form valid state', () => {
     });
 
     class TestForm extends React.Component {
-      onValidSubmit = (model, reset, updateInputsWithError) => {
+      onValidSubmit = (_model, _reset, updateInputsWithError) => {
         updateInputsWithError({ bar: 'bar' }, true);
       };
 
@@ -918,6 +918,7 @@ describe('form valid state', () => {
 
   it('should be true when validationErrors is not empty and preventExternalInvalidation is true', () => {
     let isValid = true;
+
     class TestForm extends React.Component<{}, { validationErrors: { [key: string]: ValidationError } }> {
       constructor(props) {
         super(props);

__tests__/Rules-equalsField-spec.tsx → __tests__/Rules-equalsField.spec.tsx

@@ -1,8 +1,9 @@
+import { mount } from 'enzyme';
 import React from 'react';
+import TestInput from '../__test_utils__/TestInput';
 
 import Formsy from '../src';
-import TestInput from '../__test_utils__/TestInput';
-import { mount } from 'enzyme';
+import { WrapperInstanceMethods } from '../src/withFormsy';
 
 function ValidationForm(props: { validations: string; value?: any; other?: any }) {
   const { validations, value, other } = props;
@@ -18,7 +19,7 @@ function ValidationForm(props: { validations: string; value?: any; other?: any }
 export function expectIsValid(testForm: React.ComponentElement<any, any>) {
   const form = mount(testForm);
   const inputComponent = form.find('Formsy(TestInput)').first();
-  return expect(inputComponent.instance().isValid());
+  return expect(((inputComponent.instance() as unknown) as WrapperInstanceMethods<any>).isValid());
 }
 
 describe('equalsField', () => {

__tests__/Utils-spec.tsx → __tests__/Utils.spec.tsx

@@ -94,7 +94,7 @@ describe('Utils', () => {
       failed: ['rule'],
       success: [],
     });
-    expect(utils.runRules('', {}, { rule: true }, { rule: (_cv, _v, validationsVal) => 'Error' })).toEqual({
+    expect(utils.runRules('', {}, { rule: true }, { rule: (_cv, _v, _validationsVal) => 'Error' })).toEqual({
       errors: ['Error'],
       failed: ['rule'],
       success: [],