Reload na página

Opa bom dia!

Compartilho da mesma, não consegui entender porque esta dando reload na página quando excluimos o cliente. O código funciona, mas pelo que entendi, não deveria recarregar a página. Já usei o preventDefault().

Segue abaixo o código.

import { clienteService } from '../service/cliente-service.js';

const criaNovaLinha = (nome, email, id) => {
    const linhaNovoCliente = document.createElement('tr');
    const conteudo = `
    <td class="td" data-td>${nome}</td>
    <td>${email}</td>
    <td>
        <ul class="tabela__botoes-controle">
            <li>
                <a href="../telas/edita_cliente.html?id=${id}" 
                class="botao-simples botao-simples--editar">Editar</a>
            </li>
            <li>
                <button class="botao-simples botao-simples--excluir" type="button">
                    Excluir
                </button>
            </li>
        </ul>
    </td>`  

    linhaNovoCliente.innerHTML = conteudo;
    linhaNovoCliente.dataset.id = id;   // cria um data atributs com o valor do id

    return linhaNovoCliente;
}

const tabela = document.querySelector('[data-tabela]');

tabela.addEventListener('click', (event) => {
    event.preventDefault();
    const ehBotaoDeletar =   event.target .className === `botao-simples botao-simples--excluir`;

    if (ehBotaoDeletar) {
        // metodo closest, indica o mais proximo do [data-id]
        const linhaCliente = event.target.closest('[data-id]');
        let id = linhaCliente.dataset.id;
        clienteService.removeCliente(id).then(() => {
            linhaCliente.remove();
        })
        // no meu codigo não precisou inserir o .then acima para 
        // deletar a linha do html,  possivelmente pelo reload na página

    }
})