Lookup occurrence of append form submit via JavaScript

Question

How can I debug (folding a web page) in Chrome's Dev Tools when JavaScript is executed on the client side by the browser, and the JavaScript is appending a submit a query from form.

For example, I have a page with a form where:

1. Text + password as input fields with names - password & login
2. When I hit submit, the browser does 1000 executions of some JavaScript scripts, but in the results I only see a full query with magically-added query parameters (which aren't present in the HTML form)
3. Preserving logs is not helpful, as the browser does a redirect during submit (on hitting the button)
4. Those are not hidden fields types
5. There's also no inline JavaScript, but a large .js file behind the scenes

What I want is to locate the JavaScript code which is responsible for inserting those "magic" query fragments.

I can add that this query param value is created by combined those previously submitted input text/password fields values like:

param name                 |     param value
                                (by combine login/password delimited by val2) 
---------------------------------------------------------------------------------
hrsxcvaqr1ib8slcxmalzas321   =   someloginval2somepassword

// or when I input no login and password
hrsxcvaqr1ib8slcxmalzas321   =    undefinedval2undefined

hiddenFieldName=hiddenFieldVal&login=somelogin&password=somePassword&hrsxcvaqr1ib8slcxmalzas321=undefinedval2undefined

By reverse lookup, as I know what is injected to the query:

1. Where in Chrome Dev Tools can I enter?
2. And what of breakpoint or condition do I need to enter to stop execution when string appending or concatenation by val2 takes place?

I was trying with

window.addEventListener("beforeunload", function() { debugger; }, false)

But this is not helpful when I see something like this.

this is form submit js entry point

   onsubmit="zablokujPrzycisk(this)">

function zablokujPrzycisk(a) {
    var c = $(a);
    var b = c.find("button");
    b.disable()
}

still nothing helpful

i want add breakpoint to match against ( usage ) of form input fields

ok i found that this is place when form is modified

 dX.event = {
        global: {},
        add: function(n, h, b, l, m) {
            var k, a, s, q, f, j, c, p, d, o, r, g = dX._data(n);
            if (!g) {
                return
            }
            if (b.handler) {
                q = b;
                b = q.handler;
                m = q.selector
            }
            if (!b.guid) {
                b.guid = dX.guid++
            }
            if (!(a = g.events)) {
                a = g.events = {}
            }
            if (!(j = g.handle)) {

/////////////// HERE ////////////////

                j = g.handle = function(t) {
                    return typeof dX !== eF && (!t || dX.event.triggered !== t.type) ? dX.event.dispatch.apply(j.elem, arguments) : eB
                }

///////////// THEN HERE ////////////////////

        dispatch: function(j) {
        j = dX.event.fix(j);
        var g, f, a, l, h, b = [], c = b5.call(arguments), k = (dX._data(this, "events") || {})[j.type] || [], d = dX.event.special[j.type] || {};
        c[0] = j;
        j.delegateTarget = this;
        if (d.preDispatch && d.preDispatch.call(this, j) === false) {
            return
        }
        b = dX.event.handlers.call(this, j, k);
        g = 0;
        while ((l = b[g++]) && !j.isPropagationStopped()) {
            j.currentTarget = l.elem;
            h = 0;
            while ((a = l.handlers[h++]) && !j.isImmediatePropagationStopped()) {
                if (!j.namespace_re || j.namespace_re.test(a.namespace)) {
                    j.handleObj = a;
                    j.data = a.data;
                    f = ((dX.event.special[a.origType] || {}).handle || a.handler).apply(l.elem, c);
                    if (f !== eB) {
                        if ((j.result = f) === false) {
                            j.preventDefault();
                            j.stopPropagation()
                        }
                    }
                }
            }
        }
        if (d.postDispatch) {
            d.postDispatch.call(this, j)
        }
        return j.result
    },

///////////////////////// AND WE GET SOMETHING LIKE //////////

 $('[data-formularz-log-in]').submit(function(e) {
    var a = document.createElement("input");
    var b = $(this).find('[name="login"]').val();
    var c = $(this).find('[name="blabla"]').val();
    var d = $(this).find('[name="password"]').val();
    var f = b + 'val2' + d;
    a.setAttribute('type', 'hidden');
    a.setAttribute('name', 'hrsxcvaqr1ib8slcxmalzas321');
    a.setAttribute('value', f);
    $(this)[0].appendChild(a)
});

stacktrace :

(anonymous) (VM6228:formatted:5)
dispatch (min.js?v=91:formatted:1858)
g.handle (min.js?v=91:formatted:1669)

but i still don't know how/or where is the name hrsxcvaqr1ib8slcxmalzas321 come from?