Cómo usar jest.spyOn con el componente de función React usando Typescript

Por fin luego de tanto trabajar ya hallamos la contestación de esta contrariedad que agunos lectores de esta web tienen. Si quieres aportar algún dato no dejes de aportar tu conocimiento.

Solución:

Publicando mi comentario aquí nuevamente para responder a su pregunta: Su validateBeforeSave la función se declara dentro SomeComponent por lo que es una función de ámbito cerrado/privado no accesible desde el exterior. Puede pasar esa función como un apoyo y luego puede crear un espía y pasarlo como un valor de apoyo en su prueba y probar si la función de apoyo aprobada (espía) fue llamada o no

Entonces modificaría su función algo así:

// some validator function
function validateBeforeSave()
  ...


// Some function Component

const SomeComponent = (props: IMyComponentProps) => 
  const  classes, validateBeforeSave  = props;

  // Component has state
  const [count, setCount] = useState(0);


  function handleClick() 
  validateBeforeSave();
  .
  .
  .
  

  return (
   

      
      className="saveBtn"
      onClick=handleClick
      
    
  );

;

Y en su prueba unitaria, algo como esto:

  // Unit test
  describe('SomeComponent' () => 
  it('validates model on button click', () => 
      const validateSpy = jest.fn();
      const wrapper = mount(
        
          
        ,
      );
      const instance = wrapper.instance();
      wrapper
        .find('.saveBtn')
        .at(0)
        .simulate('click');
      expect(validateSpy).toHaveBeenCalledTimes(1);
    );
  

Puntuaciones y reseñas

Ten en cuenta difundir este enunciado si te ayudó.

---

---

Utiliza Nuestro Buscador