Увидел ваш пост-запрос в группе JS FB и подумал, что я отвечу здесь.
Сначала вам нужно использовать document.ready или убедиться, что все js загружены как последняя причина, иначе элемент еще не можетсуществовать. Это не причина вашей проблемы, кстати. Проблема, которую я объясняю как последний, но несколько советов. Вы используете класс и querySelector, querySelector извлечет первый элемент в документе, и если вы хотите, чтобы все элементы были возвращены, вам нужен querySelectorAll, и это не уникально, или вы хотите связать одно и то же действие и функциональность со многими элементами? Поэтому было бы лучше использовать уникальный идентификатор элемента и использовать что-то вроде:
const myElement = document.getElementById("idName");
myElement.addEventListener("click", myFynction);
const myFunction = () => console.log("Clicked");
Реальная причина вашей проблемы Вы связываете функцию с событием click и связываете его с() за ним и это вызывает выполнение, потому что теперь вы не привязываете функцию, а получаете результат связанной функции, вы не можете передавать такие параметры в связанное событие. Вам нужно будет получить их внутри функции, вызывающей только событие, и может быть вызван обратный вызов.
Итак, ваш рабочий код:
const show_card = (shopping_card_checkout) => console.log("ali el-deeb");
document.querySelector('.fa-shopping-cart').addEventListener('click', show_card);
И если только один возврат или один оператор внутриФункция стрелки: нет необходимости в фигурных скобках и нет необходимости использовать return, поскольку она автоматически вернет результат oneliner.