Describe the role of a spy in testing with a framework example

This tests whether you know a spy records calls without replacing original implementation. A strong answer defines the tracking role, picks a concrete Vue or Angular handler, and asserts with toHaveBeenCalled.
WHAT THIS TESTS: This question probes your understanding of observation versus substitution in unit testing. The interviewer wants to see that you know a spy is a wrapper that intercepts calls to a real function so you can inspect invocations without stopping that function from doing its real work. At the senior level they also care whether you can apply this inside a component framework and manage test isolation.
A GOOD ANSWER COVERS: First, define the conceptual difference between a spy and a mock or stub. A spy records call count, arguments, and return values while leaving the original implementation intact, whereas a mock replaces behavior. Second, pick a specific framework context. In Vue you might spy on a methods object function or a composable utility. In Angular you might spy on a component class method or a service method invoked by a template event. In Svelte you might spy on a function imported into a component. Third, name the Jest API correctly. jest.spyOn takes an object and a method name, returns a mock function that still executes the original code, and exposes mock.calls and mock.results for assertions. Fourth, mention cleanup. Spies persist on the object between tests unless you call mockRestore or configure restoreMocks in Jest.
COMMON WRONG ANSWERS: A major red flag is saying a spy replaces the original function. That describes a stub or mock, not a spy. Another red flag is providing an example where the original implementation must not run, such as suppressing a network request, and still calling it a spy. That is a misuse of terminology. Candidates also stumble by forgetting to restore the spy, which mutates shared module state and causes order-dependent test failures. Finally, giving a trivial example outside a component framework misses the point of the prompt.
LIKELY FOLLOW-UPS: The interviewer may ask when you would choose spyOn over jest.fn or manual mocks. They may ask how to spy on exported functions in ES modules, which requires mocking the module because jest.spyOn works on object methods. They may also ask how to assert that a spy was called with specific arguments, or how to change a spy into a stub mid-test using mockReturnValue.
ONE CONCRETE EXAMPLE: Imagine a Vue component with a submitForm method that calls this.saveData and then emits a success event. You want to verify that submitForm calls saveData with the correct payload without disabling the real save logic. In your test, you write const saveSpy = jest.spyOn(wrapper.vm, saveData). Then you trigger the form submission, for example with wrapper.find(button).trigger(click). After that, you assert expect(saveSpy).toHaveBeenCalledTimes(1) and expect(saveSpy).toHaveBeenCalledWith({ name: Ada }). Because it is a spy, the real saveData still executes and the component state updates normally. At the end of the test you call saveSpy.mockRestore() to remove the wrapper and prevent leakage into the next test.
Source: jestjs.io
Read the original → jestjs.io
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.