Reactjs 如何在';反应谷歌自动完成';图书馆

Reactjs 如何在';反应谷歌自动完成';图书馆,reactjs,google-maps-api-3,jestjs,react-testing-library,googleplacesautocomplete,Reactjs,Google Maps Api 3,Jestjs,React Testing Library,Googleplacesautocomplete,我正在尝试测试“react google autocomplete”库,但我不知道如何测试在键入地址或键入位置时按enter键是否显示位置。我正在使用react测试库。选项位于“显示:无”分区内 下面是功能部件代码 function LocationSearch(props) { const onPlaceSelected = (place) => { if(typeof place.geometry !== 'undefined'){ const

我正在尝试测试“react google autocomplete”库,但我不知道如何测试在键入地址或键入位置时按enter键是否显示位置。我正在使用react测试库。选项位于“显示:无”分区内

下面是功能部件代码

function LocationSearch(props) {

    const onPlaceSelected = (place) => {
        if(typeof place.geometry !== 'undefined'){
        const latValue = place.geometry.location.lat();
        const lngValue = place.geometry.location.lng();
        props.setLocation({ lat: latValue, lng: lngValue })
        props.setError(false)
        }else{
            props.setError('place')
        }
    };

   return ( <Autocomplete
        style={{
            width: '60%',
            height: '40px',
            textAlign: 'center',
            borderRadius: '10px',
            borderColor: 'black',
            marginTop:'30px',
            placeholder:'Test'
        }}
        onPlaceSelected={(place) => onPlaceSelected(place)}
        types={['address']}
    />)
}
功能定位搜索(道具){
const onPlaceSelected=(place)=>{
if(typeof place.geometry!=“未定义”){
const latValue=place.geometry.location.lat();
const lngValue=place.geometry.location.lng();
props.setLocation({lat:latValue,lng:lngValue})
props.setError(false)
}否则{
props.setError('place')
}
};
返回(onPlaceSelected(place)}
类型={['address']}
/>)
}
这是我尝试过的测试

global.google = {
    maps: {
        places: {
            Autocomplete: function () {
                return { addListener: jest.fn() };
            },
            event: { trigger: jest.fn() }
        }
    }   
};


it('Location search', async () => {

    const rendered = render(
        <Context.Provider value={{ auth, setAuth }}>
            <Router history={history} >
                <LocationSearch setLocation={setLocation} setError={setError}/>
            </Router>
        </Context.Provider>)

    const autocomplete = rendered.getByTestId('autocomplete-search');
    autocomplete.focus()
    fireEvent.change(autocomplete, { target: { value: 'Calle La Ronda' } })
    await wait()

    fireEvent.keyDown(autocomplete, { key: 'ArrowDown' })
    await wait()
    fireEvent.keyDown(autocomplete, { key: 'Enter' })
    await wait()
    fireEvent.click(autocomplete);
    
    expect(autocomplete.value).toEqual('Calle La Ronda, San Salvador, El Salvador')
});
global.google={
地图:{
地点:{
自动完成:函数(){
返回{addListener:jest.fn()};
},
事件:{trigger:jest.fn()}
}
}   
};
它('位置搜索',异步()=>{
常量渲染=渲染(
)
const autocomplete=rendered.getByTestId('autocomplete-search');
autocomplete.focus()
更改(自动完成,{target:{value:'Calle La Ronda'})
等待等待
firevent.keyDown(自动完成,{key:'ArrowDown'})
等待等待
firevent.keyDown(自动完成,{key:'Enter'})
等待等待
fireEvent.单击(自动完成);
expect(autocomplete.value).toEqual('Calle La Ronda,圣萨尔瓦多,萨尔瓦多')
});
我已经能够测试输入更改,但无法测试提交或选项