import { InputBase } from '@/presentation/components' ; import { render , fireEvent , screen } from '@testing-library/react' ; import React from 'react' ; import faker from 'faker' ; const makeSut = ( fieldName ) : void => { render ( < InputBase name = { fieldName } state = { { } } setState = { null } / > ) ; } ; describe ( 'Input Component' , ( ) => { test ( 'Should begin with readOnly' , ( ) => { const field = faker . database . column ( ) ; makeSut ( field ) ; const input = screen . getByTestId ( field ) as HTMLInputElement ; expect ( input . readOnly ) . toBe ( true ) ; } ) ; test ( 'Should remove readOnly on focus' , ( ) => { const field = faker . database . column ( ) ; makeSut ( field ) ; const input = screen . getByTestId ( field ) as HTMLInputElement ; fireEvent . focus ( input ) ; expect ( input . readOnly ) . toBe ( false ) ; } ) ; test ( 'Should focus input on label click' , ( ) => { const field = faker . database . column ( ) ; makeSut ( field ) ; const input = screen . getByTestId ( field ) ; const label = screen . getByTestId ( `${ field }-label` ) ; fireEvent . click ( label ) ; expect ( document . activeElement ) . toBe ( input ) ; } ) ; } ) ;