dimanche 25 octobre 2020

test onFocus and onBlur event handling using mocha, sinon

How can i test the onFocus and onBlur events of my Text component. I want to simulate the focus event and check if callSetLocalizedName function was called.

Here is my component

const FancyText = ({value, onChange, ...rest}) => {
    const headerRef = useRef();
        return (<Form display={displayValue}
            data={value}
            onChange={onChange}
            {...rest}>
        <Header ref={headerRef}/>
        <Text
            value={value || ''}
            get={(data) => getValue(data)} set={(value) => setValue(value)}
            onFocus={() => headerRef.current.callSetLocalizedName('Edit text')}
            onBlur={() => headerRef.current.callSetLocalizedName('Edit Text')}/>
    </Form>);
    };

My Header Component

const FormHeader = forwardRef(({localizedName}, ref) => {
    const [newLocalizedName, setLocalizedName] = useState(localizedName);

    useImperativeHandle(ref, () => ({
        callSetLocalizedName(value) {
            setLocalizedName(value);
        },
    }));
    return (
    <>
        {localeToValue(newLocalizedName)}
    </>);
});

Aucun commentaire:

Enregistrer un commentaire