расширение chrome не работает с javascript contentScript

#javascript #jquery

#javascript #jquery

Вопрос:

я работал над расширением Chrome, и ранее я внес некоторые изменения в расширение Chrome, я добавил пару изменений в contentScript, и с тех пор он не работает, я получаю либо неожиданные ошибки токенов, либо просто общие проблемы с синтаксисом, я не лучший, когда дело доходит доjavascript / jquery и я не могу понять, в чем проблема, я полагаю, что это где-то внизу связано с отступом кода между firebase и скриптом, если у кого-нибудь есть какие-либо идеи, почему и где я ошибаюсь, и может указать мне правильное направление, я бы очень оценилэто, я не получаю никаких ошибок в консоли, просто не выполняет скрипт и не работает

 (function() {
    'use strict';

    let playerDataMap = new Map();
    function loadPlayerDataFromCsv() {
        console.log('**LOADING PLAYER DATA**');
        $.get("https://raw.githubusercontent.com/TheWraith1912/Project1/main/iconsxb.csv", function(CSVdata) {
            var lines = CSVdata.split("n");
            var headers = lines[0].split(",");

            for (var i = 1; i < lines.length; i  ) {
                if (lines[i] != "") {
                    var currentline = lines[i].replaceAll('"', "").split(",");
                    var name = currentline[0].normalize("NFD").replace(/[u0300-u036f]/g, "").split(" ");
                    let key = name[name.length - 1]   currentline[1];
                    let value = currentline[2].trim();
                    playerDataMap.set(key, value);
                }
            }
        });
        console.log('**LOADED PLAYER DATA**');
    }

    function addStyleElement() {
        if ($('style[title="highlightStyle"]').length > 0) {
            return;
        }
        var t = document.createElement("style");
        t.type = "text/css",
        t.innerText = "n    .SearchResults.ui-layout-left .listFUTItem {n        height: 39px;n    }n    .SearchResults.ui-layout-left .listFUTItem .label {n        font-size: 10px;n  }n    .SearchResults.ui-layout-left .auction {n        margin-top: 0 !important;n        font-size: 12px;n        top: 4px;n    }n",
        document.head.appendChild(t);
    }

    function waitForSearchButton() {
        console.log('**WAITING FOR TRANSFER SEARCH BUTTON**');
        let searchButtonCandidate = $('.btn-standard.call-to-action');
        if (searchButtonCandidate.length > 0 amp;amp; searchButtonCandidate[0] amp;amp; $(searchButtonCandidate[0]).text() === 'Search') {
            console.log('**SEARCH BUTTON FOUND**');
            $('.btn-standard.call-to-action').on("keyup", function(event) {
                if (event.key == "b")
                    addStyleElement();
                highlightValues();
            });

            console.log('**SEARCH BUTTON READY TO CLICK**');
        } else {
            setTimeout(function() {
                waitForSearchButton();
            }, 2000);
        }
    }

    function highlightValues() {
        setTimeout(function() {
            console.log('Getting Everything Ready');
            getPlayerDataFromSite();
            //$('.pagination.prev').on('click', function(e){
            $('.pagination.prev').keyup(function(e) {
                if (e.keycode == 37)
                    e.preventDefault();
                addStyleElement();
                console.log('**PREVIOUS**');
                setTimeout(function() {
                    getPlayerDataFromSite();
                }, 500);
            });

            //$('.pagination.next').on('click', function(e){
            $('.pagination.next').keyup(function(e) {
                if (e.keycode == 39)
                    e.preventDefault();
                addStyleElement();
                console.log('**NEXT**');
                setTimeout(function() {
                    getPlayerDataFromSite();
                }, 500);
            });
        }, 1000);
    }

    function getPlayerDataFromSite() {
        for (var i = 0; i <= 19; i  ) {
            var name = $('.name:eq('   i   ')').text();
            name = name.normalize("NFD").replace(/[u0300-u036f]/g, "");
            var rating = $('.rating:eq('   i   ')').text();
            var fullName = name.split(' ');
            var sitePlayerPrice = '';
            if ($('.auction:eq('   i   ')').children('div').eq(2).text().split(":")[1] != undefined) {
                sitePlayerPrice = $('.auction:eq('   i   ')').children('div').eq(2).text().split(":")[1].replaceAll(",", "");
            }
            var excelDataSheetPrice = playerDataMap.get(fullName[fullName.length - 1]   ""   rating);
            console.log('ExcelSheetPrice', fullName[fullName.length - 1]   ""   rating, "==>", excelDataSheetPrice);
            console.log('SitePrice', name   ""   rating   "==>", sitePlayerPrice);

            let sitePlayerPriceAsNumber = parseInt(sitePlayerPrice);
            if (!excelDataSheetPrice || !sitePlayerPriceAsNumber) {
                continue;
            }

            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 1.03)) {
                console.log('**'   fullName   ' IS Orange NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'orange');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 1.01)) {
                console.log('**'   fullName   ' IS GREY NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'grey');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice)) {
                console.log('**'   fullName   ' IS GREEN NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'green');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 0.97)) {
                console.log('**'   fullName   ' IS Magenta NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'magenta');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 0.80)) {
                console.log('**'   fullName   ' IS RED NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'red');
            }
        }

    }

    loadPlayerDataFromCsv();
    waitForSearchButton();

    chrome.storage.local.get(["loggedIn"], function(result) {
        if (result.loggedIn === true) {
            func();
        } else {

            chrome.runtime.sendMessage({
                cmd: "showNotification"
            }, function(response) {});

        }
    })
}
)

 
 

Комментарии:

1. console.log('**LOADED PLAYER DATA**'); будет выполняться задолго до загрузки ваших данных, поскольку $.get является асинхронным

2. извините, что это значит

3. Ну, вы вызываете какую-то службу $.get("https://raw.githubusercontent.com..) . Это займет некоторое время, даже если это займет 1 секунду. В то же время Javascript не перестает работать (он не блокируется). Итак, он запускает следующую строку: console.log('**LOADED PLAYER DATA**') итак, это сделано. Тогда больше не нужно запускать код, потому что это конец функции. Затем, через секунду, веб-служба, которую вы вызвали, отвечает данными. В этот момент запускается функция обратного вызова и var lines = CSVdata.split выполняется. Через секунду после получения '**LOADED PLAYER DATA**' журнала.

Ответ №1:

Вы объявляете анонимную функцию (function(){...}) , но это все, вы ее не запускаете. Добавьте () в конце, чтобы выполнить вашу функцию : (function(){...})()

 (function () {
    'use strict';

    let playerDataMap = new Map();
    function loadPlayerDataFromCsv() {
        console.log('**LOADING PLAYER DATA**');
        $.get("https://raw.githubusercontent.com/TheWraith1912/Project1/main/iconsxb.csv", function (CSVdata) {
            var lines = CSVdata.split("n");
            var headers = lines[0].split(",");

            for (var i = 1; i < lines.length; i  ) {
                if (lines[i] != "") {
                    var currentline = lines[i].replaceAll('"', "").split(",");
                    var name = currentline[0].normalize("NFD").replace(/[u0300-u036f]/g, "").split(" ");
                    let key = name[name.length - 1]   currentline[1];
                    let value = currentline[2].trim();
                    playerDataMap.set(key, value);
                }
            }
        });
        console.log('**LOADED PLAYER DATA**');
    }

    function addStyleElement() {
        if ($('style[title="highlightStyle"]').length > 0) {
            return;
        }
        var t = document.createElement("style");
        t.type = "text/css",
            t.innerText = "n    .SearchResults.ui-layout-left .listFUTItem {n        height: 39px;n    }n    .SearchResults.ui-layout-left .listFUTItem .label {n        font-size: 10px;n  }n    .SearchResults.ui-layout-left .auction {n        margin-top: 0 !important;n        font-size: 12px;n        top: 4px;n    }n",
            document.head.appendChild(t);
    }

    function waitForSearchButton() {
        console.log('**WAITING FOR TRANSFER SEARCH BUTTON**');
        let searchButtonCandidate = $('.btn-standard.call-to-action');
        if (searchButtonCandidate.length > 0 amp;amp; searchButtonCandidate[0] amp;amp; $(searchButtonCandidate[0]).text() === 'Search') {
            console.log('**SEARCH BUTTON FOUND**');
            $('.btn-standard.call-to-action').on("keyup", function (event) {
                if (event.key == "b")
                    addStyleElement();
                highlightValues();
            });

            console.log('**SEARCH BUTTON READY TO CLICK**');
        } else {
            setTimeout(function () {
                waitForSearchButton();
            }, 2000);
        }
    }

    function highlightValues() {
        setTimeout(function () {
            console.log('Getting Everything Ready');
            getPlayerDataFromSite();
            //$('.pagination.prev').on('click', function(e){
            $('.pagination.prev').keyup(function (e) {
                if (e.keycode == 37)
                    e.preventDefault();
                addStyleElement();
                console.log('**PREVIOUS**');
                setTimeout(function () {
                    getPlayerDataFromSite();
                }, 500);
            });

            //$('.pagination.next').on('click', function(e){
            $('.pagination.next').keyup(function (e) {
                if (e.keycode == 39)
                    e.preventDefault();
                addStyleElement();
                console.log('**NEXT**');
                setTimeout(function () {
                    getPlayerDataFromSite();
                }, 500);
            });
        }, 1000);
    }

    function getPlayerDataFromSite() {
        for (var i = 0; i <= 19; i  ) {
            var name = $('.name:eq('   i   ')').text();
            name = name.normalize("NFD").replace(/[u0300-u036f]/g, "");
            var rating = $('.rating:eq('   i   ')').text();
            var fullName = name.split(' ');
            var sitePlayerPrice = '';
            if ($('.auction:eq('   i   ')').children('div').eq(2).text().split(":")[1] != undefined) {
                sitePlayerPrice = $('.auction:eq('   i   ')').children('div').eq(2).text().split(":")[1].replaceAll(",", "");
            }
            var excelDataSheetPrice = playerDataMap.get(fullName[fullName.length - 1]   ""   rating);
            console.log('ExcelSheetPrice', fullName[fullName.length - 1]   ""   rating, "==>", excelDataSheetPrice);
            console.log('SitePrice', name   ""   rating   "==>", sitePlayerPrice);

            let sitePlayerPriceAsNumber = parseInt(sitePlayerPrice);
            if (!excelDataSheetPrice || !sitePlayerPriceAsNumber) {
                continue;
            }

            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 1.03)) {
                console.log('**'   fullName   ' IS Orange NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'orange');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 1.01)) {
                console.log('**'   fullName   ' IS GREY NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'grey');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice)) {
                console.log('**'   fullName   ' IS GREEN NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'green');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 0.97)) {
                console.log('**'   fullName   ' IS Magenta NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'magenta');
            }
            if (sitePlayerPriceAsNumber <= parseInt(excelDataSheetPrice * 0.80)) {
                console.log('**'   fullName   ' IS RED NOW**')
                $('.name:eq('   i   ')').parent().css('background-color', 'red');
            }
        }

    }

    loadPlayerDataFromCsv();
    waitForSearchButton();

    chrome.storage.local.get(["loggedIn"], function (result) {
        if (result.loggedIn === true) {
            func();
        } else {

            chrome.runtime.sendMessage({
                cmd: "showNotification"
            }, function (response) { });

        }
    })
})() // <--- this
 

Комментарии:

1. спасибо, в какую строку мне добавить «()»?

2. Ну, в самом конце. Вы определяете гигантскую инкапсулирующую функцию, но не запускаете ее. Так что вообще ничего не запускается. Как вы могли написать так много кода, не имея возможности его запустить??

3. извините, если я медленный, я просто не писал это сам, и они не знают, где была ошибка, либо я не уверен, куда добавить (), потому что я просто получаю неожиданное «)»

4. Полный код, скопированный в моем ответе, с () в конце

5. Не беспокойтесь! Код работает лучше, когда вы его выполняете 😉