Как я могу вызвать событие click для элемента списка?

Question

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

В списке содержатся данные об игроке, и эти данные всегда отличаются, потому что его как аукцион. Классы элементов всегда имеют одинаковые имена.

Выбранное имя: class="listFUTItem has-auction-data selected"

Не выбранный элемент имеет имя: class="listFUTItem has-auction-data"

Список выглядит так:

С помощью MutationObserver я уже отредактировал высоту элемента, и если цена ниже средней в моей базе данных, он окрашивается в дополнительном стиле, как показано здесь:

Теперь я хочу автоматически выбрать сделку, в которой класс элементов соответствует '[style*="background-color"]'

Я также попытался добавить выбранный класс к элементу, но тогда боковая панель не будет иметь никакого влияния на это.

trasnferlist HTML выглядит так:

с боковой панелью я имею в виду это событие:

Это код MutationObserver с jQuery внутри:

var observeTransferList = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
    mutation.addedNodes.forEach(function (node) {
        if (node.nodeType === 1 && node.matches(".has-auction-data")) {
            $(node).css("height", "37");
            $(node).removeClass('selected');

            chrome.storage.sync.get(function (items) {
                platform = items.platform;
                percentage = items.percentage;
                var playerData = getPlayerData(node, platform, percentage);


                $(node).append(playerData);
                if (playerData.colorPicked) {
                    $(node).css("backgroundColor", playerData.colorPicked); //can be "" by default, or green, yellow etc
                    //$(node).css("height", "37");
                    var price = Math.trunc(
                        parseInt(playerData.binValue.replace(/,/g, "")) / 0.949
                    );
                }


   // -------- CODE HERE -----------//
                if (node.matches('[style*="background-color"]')) { //works
                    $(node).css("height", "60"); //works
                    $(node).addClass('selected')//works
                    //$(node).click('selected'); // not working
                    //$(node).click(); // not working 
                   //$(node).trigger('click'); //notworking
                   //$(node).trigger('click', ['selected']); // not working even when adding a selected class after page load and remove old selected

                }

I пробовал решение типа:

Разница между .click () и фактическим нажатием кнопки? (javascript / jQuery)

Инициирование события щелчка на внутреннем элементе

выполнение функции щелчка без щелчка пользователем? тоже

Каким-то образом мне нужно вызвать событие listelement, которое меняет боковую панель. Каким-то образом виртуальный щелчок должен вызвать события, связанные с настоящим щелчком мыши. Но что я пропустил?

Answer 1

Каждое событие мыши имеет атрибут isTrusted. Этот атрибут имеет значение false, если событие было сгенерировано методом element.click(). Поэтому на сайте, о котором вы говорите, может быть реализована проверка, которая предотвратит javascript автоматизацию браузера (метод .click()).

У меня была похожая проблема, так как вы, и единственное решение, которое я нашел, было использовать python -браузер-автоматизация Selenuim для python. Selenium поставляется с драйвером chrome (имитирующим весь браузер chrome), который предоставляет файлы cookie, все API javascript, и, что наиболее важно для вас, он может генерировать MouseEvents с атрибутом isTrusted.