Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

374
Visualizações
@testing-library/vue :: testing emit an event on VueJS component using debounce

I'm trying to test an emitted event by an input field, which has a debounce on update method.

Without debounce, the test passed, without problems.

Here's a piece of the code.

import { render } from '@testing-library/vue';
import userEvent from '@testing-library/user-event';
import debounce from 'lodash.debounce';

const template = {
  template: '<input v-model="searchText" @input="update" type="search" />',
  data() {
    return {
      searchText: '',
    };
  },
  methods: {
    update: debounce(function (e) {
      this.searchText = e.target.value;
      if (this.searchText.length >= 3) this.$emit('update-items', this.searchText);
    }, 300),
  },
};

it('should emit [update-items] event if the query length typed on search input field is equal os greater than three', async () => {
  // * Arrange

  // * Act
  const { container, emitted } = await render(template);

  const el = container.querySelector('input');
  await userEvent.type(el, 'abcd');

  // * Assert
  expect(emitted()).toHaveProperty('update-items'); // ! FAIL
});

The original is here: https://gist.github.com/vicainelli/cf614ef7d7967684ebab6cae8290033e

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

I figure out, I just had to mock lodash.debounce dependencie

jest.mock('lodash.debounce', () => jest.fn((fn) => fn));
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda