How to write a test and set a value of variable with vue-test-utils?

Question

I have a method in my component that is triggered when the user click the button. The problem that i have is that im getting an error and i dont know what i am doing wrong.

This is the method in my component:

updateCecos() {
      console.log("updateCecos")
      this.valid = this.$refs.formCeco.validate()
      if (this.valid) {
        this.sendUpdateCecos()
      } else {
        this.$emit("update:pendingChangesCecos", false)
        this.showError(
          this.$t("lang.vista-peticion-datosBasicos.errorFormularioInvalido")
        )
      }
    },

And this is the test that i made to evaluate the method:

describe("Ceco.vue", () => {
  let localVue
  let vuetify
  let wrapper
  let $route
  let store
  let changed
  let sendUpdateCecos

  beforeEach(() => {
    // se inicializa vue
    localVue = createLocalVue()
    // se hace un mock de la ruta actual
    $route = {
      path: "/maestroProyectos",
    }
    // se inicializa la store
    localVue.use(Vuex)
    store = new Vuex.Store({
      state: mockStore.state,
      getters: mockStore.getters,
      actions: mockStore.actions,
      mutations: mockStore.mutations,
    })
    // se inicializa el traductor
    localVue.use(i18n)
    // se inicializa vuetify
    Vue.use(Vuetify)
    vuetify = new Vuetify()
    // se espian los metodos del componente
    changed = jest.spyOn(Cecos.methods, "changed")
    sendUpdateCecos = jest.spyOn(Cecos.methods, "sendUpdateCecos")
    // se monta el componente en la variable wrapper
    wrapper = mount(Cecos, {
      localVue,
      store,
      vuetify,
      i18n,
      propsData: {
        newProyecto: false,
        editProyecto: false,
        mapDataFromTable: new Map(),
        listaCecos: [{text: "1", value: "1"}],
        loadingCompleteHttp: false,
        thereAreChangesCecos: false,
        pendingChangesCecos: false,
        tabPending: null,
      },
    })
  })

it("must call sendUpdateCecos method when button is clicked", async () => {
    await wrapper.setData({valid: true})
    expect(wrapper.vm.valid).toBe(true)

    const button = wrapper.find(".slide-secondary-btn")
    button.trigger("click")

    await wrapper.vm.$nextTick()

    await flushPromises()

    expect(sendUpdateCecos).toHaveBeenCalled()
  })

  afterEach(() => {
    jest.clearAllMocks()
  })
})

The problem is that i get the next error when running the test:

expect(jest.fn()).toHaveBeenCalled()

    Expected number of calls: >= 1
    Received number of calls:    0

      174 |     await flushPromises()
      175 |
    > 176 |     expect(sendUpdateCecos).toHaveBeenCalled()
          |                             ^
      177 |     // expect(actions.showError).toHaveBeenCalled()
      178 |   })
      179 |

      at toHaveBeenCalled (test/components/MaestroProyectos/Cecos.spec.js:176:29)
      at tryCatch (node_modules/@babel/runtime/helpers/regeneratorRuntime.js:45:16)
      at Generator.<anonymous> (node_modules/@babel/runtime/helpers/regeneratorRuntime.js:133:17)
      at Generator.next (node_modules/@babel/runtime/helpers/regeneratorRuntime.js:74:21)
      at asyncGeneratorStep (node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:17)
      at _next (node_modules/@babel/runtime/helpers/asyncToGenerator.js:17:9)

What could be the reason for the test to fail?