Shopify Question posted in
The Shopify help center can be found here.

Why Javascript keep on running even after array finished in pop() – Shopify

I’m trying to automate some button clicking and data inserting into a webpage by using TamperMonkey. However, even after all the data from the array has been inserted, the javascript keep on clicking on the button. How do I set it so that once the data from the array has been finished inserted, the javascript should stop running.
Here’s the code, to automate batch input of gift cards into shopify.

// ==UserScript==
// @name         Shopify Gift Card Generator
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Generate Gift Cards from a list
// @author       You
// @grant    GM.getValue
// @grant    GM.setValue
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js
// @match        https://[myshopname].myshopify.com/admin/gift_cards
// @run-at      document-idle

// ==/UserScript==

/* globals $ */

(function() {
    'use strict';

    //add recipient list
    var rec = ["2920469463099",
                 "2920466415675",
            ];

    function generateCard(code){

        if($('button:contains("Issue gift card")') !== "undefined"){

            //click generate gift card
            $('button:contains("Issue gift card")').click();

            //set recipient based on id
            $('#gift_card_customer_id').attr("value", code);

            //select the dollar amount eq(0) = 10, eq(1) = 25, eq(2) = 50, eq(3) = 100
            $('.segmented-control.large li:eq(2) label')[0].click();

            //submit!
            //$('form.new_gift_card')[0].submit();
            $('input[type=submit]').click();

            var success = false;
            function closeWindow(){

                if($('.gift-card-success-heading h2:contains("RM50.00 MYR gift card successfully issued")').length == 1){
                    if ($('#gift-card-issue-errors:contains("There ")').length == 0) {
                        //close the modal and restart!
                        $('a.close-modal').click();
                        console.log('last successful recipient id: ');
                        console.log(GM.getValue('last'));

                        setTimeout(function(){
                            generateCard(rec.pop());
                        }, 750);

                    } else {

                        console.log('generation error. last code:');
                        console.log(GM.getValue('last'));
                        success = false;
                    }
                } else {

                    setTimeout(function(){ closeWindow(); }, 500);
                }
            }

            closeWindow();
            return success;

        } else {
            generateCard(code);
        }
    }

    function begin(){

        //wait for the page to load / not over-request the shopify server
        setTimeout(function(){
            generateCard(rec.pop());


        }, 1500);

    }

    begin();

})();

Any suggestions on how to solve the issue? Thank you.

Tags:

3

Answers


  1. 0

    Don’t start the next timer when rec is empty.

    if (rec.length > 0) {
    setTimeout(function(){
        generateCard(rec.pop());
    }, 750);
}
    Login or Signup to reply.
  2. 0

    Add check before calling the generateCard method in setTimeout.

    Currently this method is getting called with undefined value after array is empty.

    setTimeout(function() {
  if (rec.length > 0) {
    generateCard(rec.pop());
  }
}, 1500);
    Login or Signup to reply.
  3. 0

    You can use a reducer method with your code inside the function for each array item. That way when you finish the last item of the array execution stops.

    let yourArray = [...yourData];
const reducer = (accumulator, currentValue) => {
    //your button clicking logic here
};

yourArray.reduce(reducer);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search