Ancienne et nouvelle valeur

Avec l'observateur ci-dessous, qu'affiche la console au chargement, puis après un clic sur chacun des boutons, dans l'ordre (le bouton « 5 » deux fois) ?

<div id="app">
  <button type="button" @click="quantite++">+1</button>
  <button type="button" @click="quantite = 5">5</button>
  <button type="button" @click="quantite = 7; quantite = 1">7 puis 1</button>
</div>

const { createApp, ref, watch } = Vue;

createApp({
  setup() {
    const quantite = ref(1);
    watch(quantite, (nouvelle, ancienne) => {
      console.log(`${ancienne} → ${nouvelle}`);
    }, { immediate: true });
    return { quantite };
  },
}).mount("#app");