В функцию передается не корректное значение

Есть что-то вроде корзины покупок. Я хочу сделать чтобы при добавлении товара в корзину возле нее был счетчик подсчёта количества товаров.

Код добавления в корзину:

import cartAnimation from "./cartAnimation";

const basket = (basketWrap) => {

allProducts.addEventListener('click', (e) => {
    e.preventDefault();

    if (e.target.hasAttribute('data-cart')) {

      //находим карточку по которой был совершен клик
      const card = e.target.closest('.products__item');

      //анимация товара
      cartAnimation(card);

      //Собираем данные с карточки и записываем их в обьект productInfo

      //Проверка есть ли такой товар в корзине
     
      //если товара нет в корзине

      //сбраные данные подставим в шаблон для товарав корзине
     
      //отобразим товар в корзине      

      //сбрасываем счетчик добавленого товара на 1
      card.querySelector('[data-counter]').innerText = '1';
    }
  });
};

Лишний код я убрала, так как он свой функционал выполняет. Здесь меня интересует функция cartAnimation(card); (в нее я передаю карточку по которой был совершен клик).

Правильно ли я думаю ход выполнения не знаю, но надеюсь что после клика на кнопку с атрибутом data-cart, в переменную card у меня попадает карточка товара, следующим этапом выполнение переходит в функцию cartAnimation в которую параметром card я передаю карточку.

const cartAnimation = (card) => {

  //получаем координаты клона картинки
  const iconCart = document.querySelector('#cart-btn');
    ...

  //ЗДЕСЬ Я ПОЛУЧАЮ КОЛИЧЕСТВО ТОВАРОВ УКАЗАНЫХ В КАРТОЧКЕ ТОВАРА  
  const count = card.querySelector('.products__item-counter-current').textContent; // и они передаются правильно
  
  //устанвливаем стили начального положения

  //получаем координаты корзины

    //устанвливаем стили конечного положения

    //АНИМАЦИЯ ПОЛЕТА ТОВАРА В КОРЗИНУ
      productimageFly.addEventListener('transitionend', function (e) {
        if (e.propertyName == 'top') {
          if (card.classList.contains('_fly')) {
            productimageFly.remove();
            updateCartCounter('true'); // это функция которая ведет подсчет товаров в корзине, точнее она оперирует значениями количества которые хранит карточка при нажатии кнопки "добавить в корзину"
            card.classList.remove('._fly');
          }
        }
      });

      
    //сама функция, она еще в процесе творения
     function updateCartCounter(condition) {
       if (iconCart.hasAttribute('data-count') && condition == 'true') {
        iconCart.setAttribute('data-count', Number(iconCart.getAttribute('data-count')) + Number(count));
       } else if (iconCart.hasAttribute('data-count') && condition == 'false') {
        console.log(document.querySelector('.shopping-cart [data-counter]').textContent);
        iconCart.setAttribute('data-count', Number(iconCart.getAttribute('data-count')) - Number(document.querySelector('.shopping-cart [data-counter]').textContent));
      } else {
        iconCart.setAttribute('data-count', Number(count));
      }
    }
};

export default cartAnimation;

Так работает и значение количества после клика передается верно.

Но так как эта функция должна прибавлять и отнимать количество товаров и использоваться в разных местах, то нужно ее вынести в отдельный модуль, и в зависимости от условия вызывать функцию.

const updateCartCounter = (card, condition ) => {

  const iconCart = document.querySelector('#cart-btn'),
  count = card.querySelector('.products__item-counter-current').textContent; // - вот здесь всегда 1


  if (iconCart.hasAttribute('data-count') && condition  == 'true') {
    iconCart.setAttribute('data-count', Number(iconCart.getAttribute('data-count')) + Number(count));
  } else if (iconCart.hasAttribute('data-count') && condition  == 'false') {
    console.log(document.querySelector('.shopping-cart [data-counter]').textContent);
    iconCart.setAttribute('data-count', Number(iconCart.getAttribute('data-count')) - Number(document.querySelector('.shopping-cart [data-counter]').textContent));
  } else {
    iconCart.setAttribute('data-count', Number(count));
  }
};

export default updateCartCounter;

Но теперь проблема в том что переменная count не хранится значение количества товаров, там теперь всегда 1. И это потому что в функции basket в строке card.querySelector('[data-counter]').innerText = '1'; оно сбрасывается.

И не могу понять почему оно так работает. Код ведь синхронный и все должно выполняться по очередно, и сбрасываться количество должно только после того как уже выполнится функция cartAnimation.

Подскажите почему так происходит? Как в функцию updateCartCounter передать переменную card, в которой будет хранится значение?

Вот ссылка, здесь попыталась все максимально упростить jsfiddle.net