diff --git a/tests/utils/edit/calculateNewValue.ts b/tests/utils/edit/calculateNewValue.ts deleted file mode 100644 index bb87a1ff..00000000 --- a/tests/utils/edit/calculateNewValue.ts +++ /dev/null @@ -1,144 +0,0 @@ -import {setup} from '#testHelpers' - -// TODO: focus the maxlength tests on the tested aspects - -test('honors maxlength', async () => { - const {element, getEventSnapshot, user} = setup('') - await user.type(element, '123') - - // NOTE: no input event when typing "3" - expect(getEventSnapshot()).toMatchInlineSnapshot(` - Events fired on: input[value="12"] - - input[value=""] - pointerover - input[value=""] - pointerenter - input[value=""] - mouseover - input[value=""] - mouseenter - input[value=""] - pointermove - input[value=""] - mousemove - input[value=""] - pointerdown - input[value=""] - mousedown: primary - input[value=""] - pointerup - input[value=""] - mouseup: primary - input[value=""] - click: primary - input[value=""] - keydown: 1 - input[value=""] - keypress: 1 - input[value=""] - beforeinput - input[value="1"] - input - input[value="1"] - keyup: 1 - input[value="1"] - keydown: 2 - input[value="1"] - keypress: 2 - input[value="1"] - beforeinput - input[value="12"] - input - input[value="12"] - keyup: 2 - input[value="12"] - keydown: 3 - input[value="12"] - keypress: 3 - input[value="12"] - beforeinput - input[value="12"] - keyup: 3 - `) -}) - -test('honors maxlength="" as if there was no maxlength', async () => { - const {element, getEventSnapshot, user} = setup('') - await user.type(element, '123') - - expect(getEventSnapshot()).toMatchInlineSnapshot(` - Events fired on: input[value="123"] - - input[value=""] - pointerover - input[value=""] - pointerenter - input[value=""] - mouseover - input[value=""] - mouseenter - input[value=""] - pointermove - input[value=""] - mousemove - input[value=""] - pointerdown - input[value=""] - mousedown: primary - input[value=""] - pointerup - input[value=""] - mouseup: primary - input[value=""] - click: primary - input[value=""] - keydown: 1 - input[value=""] - keypress: 1 - input[value=""] - beforeinput - input[value="1"] - input - input[value="1"] - keyup: 1 - input[value="1"] - keydown: 2 - input[value="1"] - keypress: 2 - input[value="1"] - beforeinput - input[value="12"] - input - input[value="12"] - keyup: 2 - input[value="12"] - keydown: 3 - input[value="12"] - keypress: 3 - input[value="12"] - beforeinput - input[value="123"] - input - input[value="123"] - keyup: 3 - `) -}) - -test('honors maxlength with existing text', async () => { - const {element, getEventSnapshot, user} = setup( - '', - ) - await user.type(element, '3') - - // NOTE: no input event when typing "3" - expect(getEventSnapshot()).toMatchInlineSnapshot(` - Events fired on: input[value="12"] - - input[value="12"] - pointerover - input[value="12"] - pointerenter - input[value="12"] - mouseover - input[value="12"] - mouseenter - input[value="12"] - pointermove - input[value="12"] - mousemove - input[value="12"] - pointerdown - input[value="12"] - mousedown: primary - input[value="12"] - select - input[value="12"] - pointerup - input[value="12"] - mouseup: primary - input[value="12"] - click: primary - input[value="12"] - keydown: 3 - input[value="12"] - keypress: 3 - input[value="12"] - beforeinput - input[value="12"] - keyup: 3 - `) -}) - -test('honors maxlength on textarea', async () => { - const {element, getEventSnapshot, user} = setup( - '', - ) - - await user.type(element, '3') - - expect(getEventSnapshot()).toMatchInlineSnapshot(` - Events fired on: textarea[value="12"] - - textarea[value="12"] - pointerover - textarea[value="12"] - pointerenter - textarea[value="12"] - mouseover - textarea[value="12"] - mouseenter - textarea[value="12"] - pointermove - textarea[value="12"] - mousemove - textarea[value="12"] - pointerdown - textarea[value="12"] - mousedown: primary - textarea[value="12"] - select - textarea[value="12"] - pointerup - textarea[value="12"] - mouseup: primary - textarea[value="12"] - click: primary - textarea[value="12"] - keydown: 3 - textarea[value="12"] - keypress: 3 - textarea[value="12"] - beforeinput - textarea[value="12"] - keyup: 3 - `) -}) - -// https://github.com/testing-library/user-event/issues/418 -test('ignores maxlength on input[type=number]', async () => { - const {element, user} = setup( - ``, - ) - - await user.type(element, '3') - - expect(element).toHaveValue(123) -}) diff --git a/tests/utils/edit/input.ts b/tests/utils/edit/input.ts index f670a641..a2d05bc9 100644 --- a/tests/utils/edit/input.ts +++ b/tests/utils/edit/input.ts @@ -1,6 +1,6 @@ import cases from 'jest-in-case' import {input} from '#src/utils' -import {setup} from '#testHelpers' +import {render, setup} from '#testHelpers' import {createConfig} from '#src/setup/setup' cases( @@ -167,3 +167,43 @@ test('prevent input on `beforeinput` event', () => { expect(eventWasFired('input')).toBe(true) expect(element).toHaveValue('b') }) + +cases( + 'maxlength', + ({html, data, expectedValue}) => { + const {element, eventWasFired} = render(html) + + input(createConfig(), element, data) + + expect(element).toHaveValue(expectedValue) + expect(eventWasFired('beforeinput')).toBe(true) + expect(eventWasFired('input')).toBe(!!expectedValue) + }, + { + 'on text input': { + html: ``, + data: '123', + expectedValue: '12', + }, + 'on textarea': { + html: `