Vue JS Vue JS Testing and Debugging 2

Question 1

How do you test that a Vue component emits the correct custom event with @vue/test-utils?

Accepted Answer

Use wrapper.emitted() to inspect emitted events and their arguments

Answer

wrapper.emitted() returns an object where each key is an event name and the value is an array of argument arrays for each emission.

Question 2

What Vue DevTools panel shows a log of all Vuex or Pinia store mutations over time?

Accepted Answer

Timeline / State mutations log

Answer

The Vue DevTools Timeline tab records every Vuex commit or Pinia action with timestamps and state snapshots, enabling time-travel debugging.

Question 3

How do you test a Vue composable (Composition API function) without mounting a full component?

Accepted Answer

Wrap the call in withSetup() or call it directly if it has no lifecycle dependencies

Answer

Simple composables with no lifecycle hooks can be called directly in tests; for those needing lifecycle context, a helper app/component wrapper provides the correct Vue instance.

Question 4

What does the errorCaptured lifecycle hook do in Vue?

Accepted Answer

Intercepts errors thrown by descendant components and prevents them from propagating further

Answer

errorCaptured fires when an error propagates from a child component; returning false stops the error from bubbling further up the component tree.

Question 5

Which Vue 3 global API allows you to register a handler for unhandled errors from any component?

Accepted Answer

app.config.errorHandler

Answer

app.config.errorHandler receives all unhandled errors from component lifecycle hooks, watchers, and event handlers throughout the application.

Vue JS Practice Test

Vue JS Practice Test

Vue JS Vue JS Testing and Debugging 2