How to test setState after getting response from an api

Question

I am doing unit testing using jest and enzyme on my reactjs code,where I have main functional component "TrashDisplayFiles" inside which there is a method "getDeletedData",where I have called the api which is setting TrashFileState by getting response from an api.

function TrashDisplayFiles(props){
      const[TrashFileState,setTrashFileState]=useState([]);
 //API CALL
  useEffect(()=>{
    getDeletedData();
  },[]);
const getDeletedData=()=>{ 
 trackPromise(
  Axios.get(getUrl(),
    {headers:{
    Authorization: `Basic ${btoa(getToken())}`
     }}).then((response) => {
      let FileData=response.data;
      setPaginationDefault(response.data.list.pagination)
      setTrashFileState(response.data.list.entries.map(d=>{
        return {
          select:false,
          id:d.entry.id,
          name:d.entry.name
        }})) 
      }).catch(err=>alert(err))
  )
};

how can i unit test this setTrashFileState(response.data.list.entries.map(d=>{return{ and error alert,so that it get covers in my coverage report

also, this function is not getting simulated in my jsx through onsubmit or onclick,when the Trash page gets load ,this api gets triggered automatically.

score 0 · Answer 1 · answered Jan 20 '21 at 19:07

You can't test a React function's state as such, you can only test the component's behaviour (and it's always a better approach, I think).

Certainly you use this TrashFileState somewhere later in your code, possibly inside render. So test the outcome of that usage!

How to test setState after getting response from an api

1 Answers1