dcsimg
www.webdeveloper.com
Results 1 to 13 of 13

Thread: chrome extension execute script wait for ajax response complete

  1. #1
    Join Date
    Jul 2017
    Posts
    9

    chrome extension execute script wait for ajax response complete

    in a chrome extension, in the executeScript function i click on the button, this button render content with ajax, i want wait content load and then click in an another button: in the background.js script i have:
    HTML Code:
    chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
        chrome.tabs.update(tabs[0].id, {url: tabs[0].url}, function () {
            chrome.tabs.executeScript({
                file: "scriptInjection.js"
            }, function (output) {
                if (output == 'test1') {
                    sendData (output);
                    //clearStorage();
                } else if (output == 'test2') {
                    sendData (output);
                    clearStorage();
                }
            });
        });
    });
    i try a lot of things in scriptInjection.js for exmple i create a pause function like this: in the scriptInjection.js file i have:
    HTML Code:
    function pause(milliseconds) {
        let dt = new Date();
        while ((new Date()) - dt <= milliseconds) {
        }
    }
    
    if (document.URL == "...") {
        all = document.querySelectorAll('span.fc-title');
    
        for (let i = 0; i < all.length; i++) {
            if (all[i].innerText == 'company') {
                all[i].click();
                var result = true;
                break;
            }
        }
        if (result === true) {
            pause(2000);
            reserve();
            output = 'test1';
        } else {
            document.querySelector("#calendar > div.fc-toolbar > div.fc-right > div > button.fc-next-button.fc-button.fc-state-default.fc-corner-right > span").click();
            all = document.querySelectorAll('span.fc-title');
    
            for (let i = 0; i < all.length; i++) {
                if (all[i].innerText == 'company') {
                    all[i].click();
                    var result = true;
                    break;
                }
            }
            if (result === true) {              
                pause(2000);
                reserve();
                output = 'test1';
            }
        }
    }
    but in this way the script dose not wait until ajax content loaded, i use setInterval for reserve function but still it dose not work. i use MutationObserver in the scriptInjection.js file like this at the start point of the scriptInjection.js but it dose not work:
    HTML Code:
         var observer = new MutationObserver(function () {
            reserve();
          });
          observer.observe(document.documentElement, {attributes: true, childList: true, characterData: true});
    and the reserve function:
    HTML Code:
    function reserve(){
                  let Shifts = document.getElementsByName("shifts");
                  if (Shifts.length !== 0) {
                      for (let i = 0; i < Shifts.length; i++) {
                          Shifts[i].click();
                          break;
                      }
                      document.querySelector("#Btn").click();
                  }
    
    }
    i read this link to use mutation observer "fjaguero.com/blog/using-mutationobservers-to-build-a-simple-extension/" but i dont know where to place mutation observer in the chrome extension should i use it content script or in the execute script file?

  2. #2
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,409
    It depends on your JavaScript you use and how you build your query...

    As for programming chrome extensions, never done it but given that they are HTML,JavaScript and CSS, theres no reason to not expect them to function like a regular browser script.

    So this AJAX query, you haven't shown the code you have and I am going to guess that your code you use has been the common variety of...
    Code:
    xmlhttp = new XMLHttpRequest();
    xmlhttp.open("GET","myurl.ext",true);
    xmlhttp....
    You use the true where you have a page that you want normal function to carry on until the load flag has been triggered and the data then is acted upon, if you want to hold the page until the data has loaded, you would use false in the .open() in an ajax query.

    So the real question is how have you written your AJAX function, if its not loading, then there is possibly a problem, could be a local conflict or a cross domain issue.

    It also helps if you read errors in the console.log (F12 open / close) the console and open the log tab to see output error messages and warnings.
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  3. #3
    Join Date
    Jul 2017
    Posts
    9
    with a chrome extension i click automatically on the button of webpages automatically, but in this case i have button in site for example webdeveloper.com which load content with ajax, i click on the button of for example reply to thread and the script should wait until the box appear to (for example) write a comment in the box and ...

  4. #4
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,409
    Still doesn't get around the issue of code, you state its an AJAX issue but you don't post any AJAX code, it helps to see that you have constructed the loading routine properly.
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  5. #5
    Join Date
    Jul 2017
    Posts
    9
    Quote Originally Posted by \\.\ View Post
    Still doesn't get around the issue of code, you state its an AJAX issue but you don't post any AJAX code, it helps to see that you have constructed the loading routine properly.
    see this chrome extension "https://github.com/fjaguero/twitter-replies-counter" gif, the content load with for example ajax on twitter after user scroll page on twitter, but the chrome extension get update with mutation observer

  6. #6
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,409
    You have yet to supply the javascript you use for the AJAX object.

    Chances are that the object you have has either been configured wrong or needs an additional element or you could be making an illegal call that isn't allowed, until you show the javascript you are using, theres little point posting comments, seeing the code speaks more than any comment can.
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  7. #7
    Join Date
    Jul 2017
    Posts
    9
    Quote Originally Posted by \\.\ View Post
    You have yet to supply the javascript you use for the AJAX object.

    Chances are that the object you have has either been configured wrong or needs an additional element or you could be making an illegal call that isn't allowed, until you show the javascript you are using, theres little point posting comments, seeing the code speaks more than any comment can.
    have you ever programming a chrome extension? the chrome extension has the ability to run command like console on the page so for example when chrome extension click on a button on the web page, there is no need to know what is action of form and ..., chrome extension behave like a user.

  8. #8
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,409
    Ajax code you use, have formed the object right? We will never know because you won't supply the command you are using.
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  9. #9
    Join Date
    Jul 2017
    Posts
    9
    Quote Originally Posted by \\.\ View Post
    Ajax code you use, have formed the object right? We will never know because you won't supply the command you are using.
    i did not use any ajax, for example webdeveloper.com use ajax for getting content with button, my chrome extension automatically click on that button but it dose not wait to get result which webdeveloper.com produce.
    execuse me if i have a bad engilish.

  10. #10
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    5,409
    So if you haven't used AJAX then why are you expecting it to perform for you?
    --> JavaScript Frameworks like JQuery, Angular, Node <--
    ... and please remember to wrap code with forum BBCode tags:-

    [CODE]...[/CODE] [HTML]...[/HTML] [PHP]...[/PHP]

    If you can't think outside the box, you will be trapped forever with no escape...

  11. #11
    Join Date
    Mar 2012
    Posts
    3,961
    Hi, I am concerned as to why you want a Chrome extension to click a button? It sounds to me potentially like malicious code. At least, I can't think of a good reason why you should want to do it. Added to the fact that you seem unwilling to post your code, I'm not at all happy with this thread.

    So, please, answer the questions that have been asked and/or post your code.

  12. #12
    Join Date
    Jul 2017
    Posts
    9
    Quote Originally Posted by jedaisoul View Post
    Hi, I am concerned as to why you want a Chrome extension to click a button? It sounds to me potentially like malicious code. At least, I can't think of a good reason why you should want to do it. Added to the fact that you seem unwilling to post your code, I'm not at all happy with this thread.

    So, please, answer the questions that have been asked and/or post your code.

    i need chrome extension sth like scraper to get data from site, i visited;
    and about another question with "MutationObservers", MutationObservers in javascript used for getting changes to DOM. but i dont know how to use that?
    see this extension "https://github.com/fjaguero/twitter-replies-counter", and a lot of extensions in the chrome extension store, that do this thing.

  13. #13
    Join Date
    Jul 2017
    Posts
    9

    response

    Quote Originally Posted by masihfathi View Post
    i need chrome extension sth like scraper to get data from site, i visited;
    and about another question with "MutationObservers", MutationObservers in javascript used for getting changes to DOM. but i dont know how to use that?
    see this extension "https://github.com/fjaguero/twitter-replies-counter", and a lot of extensions in the chrome extension store, that do this thing.

    the problem solved by using content script, the problem was when using executeScript the result go to callback and mutation observer can't track ajax response.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center