diff --git a/projects/testing-library/src/lib/user-events/type.ts b/projects/testing-library/src/lib/user-events/type.ts index d2cf4fb1..52261f94 100644 --- a/projects/testing-library/src/lib/user-events/type.ts +++ b/projects/testing-library/src/lib/user-events/type.ts @@ -40,7 +40,7 @@ export function createType(fireEvent: FireFunction & FireObject) { const { allAtOnce = false, delay = 0 } = options || {}; const initialValue = (element as HTMLInputElement).value; - if (allAtOnce) { + if (allAtOnce || value === '') { fireEvent.input(element, { target: { value } }); element.addEventListener('blur', createFireChangeEvent(initialValue)); return; diff --git a/projects/testing-library/tests/user-events/type.spec.ts b/projects/testing-library/tests/user-events/type.spec.ts index 4fa4e769..b91d12a1 100644 --- a/projects/testing-library/tests/user-events/type.spec.ts +++ b/projects/testing-library/tests/user-events/type.spec.ts @@ -178,7 +178,7 @@ describe('options', () => { }); }); -test('should not type when event.preventDefault() is called', async () => { +test('does not type when event.preventDefault() is called', async () => { @Component({ selector: 'fixture', template: ` @@ -219,3 +219,27 @@ test('should not type when event.preventDefault() is called', async () => { expect(inputControl.value).toBe(''); }); + +test('can clear an input field', async () => { + @Component({ + selector: 'fixture', + template: ` + + `, + }) + class FixtureComponent { + @Input() initialValue = ''; + } + + const component = await render(FixtureComponent, { + componentProperties: { + initialValue: 'an initial value', + }, + }); + + const inputControl = component.getByTestId('input') as HTMLInputElement; + expect(inputControl.value).toBe('an initial value'); + + component.type(inputControl, ''); + expect(inputControl.value).toBe(''); +});