diff --git a/.github/workflows/react-component-ci.yml b/.github/workflows/react-component-ci.yml index 432a3fb3..a96af284 100644 --- a/.github/workflows/react-component-ci.yml +++ b/.github/workflows/react-component-ci.yml @@ -15,7 +15,7 @@ jobs: - uses: actions/setup-node@v1 with: - node-version: '12' + node-version: '16' - name: cache package-lock.json uses: actions/cache@v2 diff --git a/now.json b/now.json index be2d9209..c3e54f87 100644 --- a/now.json +++ b/now.json @@ -5,10 +5,7 @@ { "src": "package.json", "use": "@now/static-build", - "config": { "distDir": ".doc" } + "config": { "distDir": "dist" } } - ], - "routes": [ - { "src": "/(.*)", "dest": "/dist/$1" } ] } diff --git a/tests/uploader.spec.tsx b/tests/uploader.spec.tsx index 99d669a4..fb2d1a68 100644 --- a/tests/uploader.spec.tsx +++ b/tests/uploader.spec.tsx @@ -681,33 +681,31 @@ describe('uploader', () => { ); }); - return; - describe('transform file before request', () => { - let uploader; + let uploader: ReturnType; beforeEach(() => { uploader = render(); }); afterEach(() => { - uploader.unrender(); + uploader.unmount(); }); it('noes not affect receive origin file when transform file is null', done => { - const handlers = {}; - const props = { + const handlers: UploadProps = {}; + const props: UploadProps = { action: '/test', onSuccess(ret, file) { if (handlers.onSuccess) { - handlers.onSuccess(ret, file); + handlers.onSuccess(ret, file, null!); } }, transformFile() { return null; }, - }; - const wrapper = render(); - const input = wrapper.find('input').first(); + } as any; + const { container } = render(); + const input = container.querySelector('input')!; const files = [ { @@ -718,7 +716,7 @@ describe('uploader', () => { }, ]; - files.item = i => files[i]; + (files as any).item = i => files[i]; handlers.onSuccess = (ret, file) => { expect(ret[1]).toEqual(file.name); @@ -726,7 +724,7 @@ describe('uploader', () => { done(); }; - input.simulate('change', { target: { files } }); + fireEvent.change(input, { target: { files } }); setTimeout(() => { requests[0].respond(200, {}, `["","${files[0].name}"]`); @@ -743,11 +741,11 @@ describe('uploader', () => { }), ); - async function testWrapper(props) { + async function testWrapper(props?: UploadProps) { const onBatchStart = jest.fn(); - const wrapper = render(); + const { container } = render(); - wrapper.find('input').simulate('change', { + fireEvent.change(container.querySelector('input')!, { target: { files, }, @@ -757,7 +755,6 @@ describe('uploader', () => { await sleep(); expect(onBatchStart).toHaveBeenCalled(); - wrapper.unrender(); return onBatchStart; } @@ -822,7 +819,7 @@ describe('uploader', () => { const data = jest.fn(async file => { await sleep(100); return 'test'; - }); + }) as any; const onBatchStart = await testWrapper({ data }); @@ -844,8 +841,9 @@ describe('uploader', () => { return ; }; - const wrapper = render(); - wrapper.find('input').simulate('change', { + const { container } = render(); + + fireEvent.change(container.querySelector('input')!, { target: { files: [ { @@ -864,31 +862,39 @@ describe('uploader', () => { }); it('input style defaults to display none', () => { - const wrapper = render(); - expect(wrapper.find('input').props().style.display).toBe('none'); + const { container } = render(); + expect(container.querySelector('input')).toHaveStyle({ + display: 'none', + }); }); it('classNames and styles should work', () => { - const wrapper = render( + const { container } = render( , ); - expect(wrapper.find('.bamboo-input').length).toBeTruthy(); + expect(container.querySelector('.bamboo-input')).toBeTruthy(); - expect(wrapper.find('.bamboo-input').props().style.color).toEqual('red'); - expect(wrapper.find('input').props().style.display).toBe('none'); + expect(container.querySelector('.bamboo-input')).toHaveStyle({ + color: 'red', + }); + expect(container.querySelector('input')).toHaveStyle({ + display: 'none', + }); }); it('Should be focusable and has role=button by default', () => { - const wrapper = render(); + const { container } = render(); - expect(wrapper.find('span').props().tabIndex).toBe('0'); - expect(wrapper.find('span').props().role).toBe('button'); + expect(container.querySelector('span')!.tabIndex).toBe(0); + expect(container.querySelector('span')).toHaveAttribute('role', 'button'); }); it("Should not be focusable and doesn't have role=button with hasControlInside=true", () => { - const wrapper = render(); + const { container } = render(); + + console.log(container.innerHTML); - expect(wrapper.find('span').props().tabIndex).toBe(undefined); - expect(wrapper.find('span').props().role).toBe(undefined); + expect(container.querySelector('span')!.tabIndex).not.toBe(0); + expect(container.querySelector('span')!.role).not.toHaveAttribute('role', 'button'); }); });