how to save this screenshot in local drive without any pop up?

Question

I want to save this screenshot in local drive without showing a popup to download.

    (function() {
        'use strict';
        $("body").prepend ( `
    <button id="btCapture">SCREENSHOT</button>
    <input type="submit" value="Take Screenshot Of Div" onclick="capture();" />
    <form method="POST" enctype="multipart/form-data" action="save.php" id="myForm">
    <input type="hidden" name="img_val" id="img_val" value="" />
    </form>
    <div></div>`);

    document.getElementById("btCapture").onclick = function() { generate();};
        (function (exports) {
            function urlsToAbsolute(nodeList) {
                if (!nodeList.length) {
                    return [];
                }
                var attrName = 'href';
                if (nodeList[0].prototype === HTMLImageElement.prototype || nodeList[0].protottype === HTMLScriptElement.prototype) {
                    attrName = 'src';
                }
                nodeList = [].map.call(nodeList, function (el, i) {
                    var attr = el.getAttribute(attrName);
                    if (!attr) {
                        return;
                    }
                    var absURL = /^(https?|data):/i.test(attr);
                    if (absURL) {
                        return el;
                    } else {
                        return el;
                    }
                });
                return nodeList;
            }

            function screenshotPage() {
                urlsToAbsolute(document.images);
                urlsToAbsolute(document.querySelectorAll("link[rel='stylesheet']"));
                var screenshot = document.documentElement.cloneNode(true);
                var b = document.createElement('base');
                b.href = document.location.protocol + '//' + location.host;
                var head = screenshot.querySelector('head');
                head.insertBefore(b, head.firstChild);
                screenshot.style.pointerEvents = 'none';
                screenshot.style.overflow = 'hidden';
                screenshot.style.webkitUserSelect = 'none';
                screenshot.style.mozUserSelect = 'none';
                screenshot.style.msUserSelect = 'none';
                screenshot.style.oUserSelect = 'none';
                screenshot.style.userSelect = 'none';
                screenshot.dataset.scrollX = window.scrollX;
                screenshot.dataset.scrollY = window.scrollY;
                var script = document.createElement('script');
                script.textContent = '(' + addOnPageLoad_.toString() + ')();';
                screenshot.querySelector('body').appendChild(script);
                var blob = new Blob([screenshot.outerHTML], {
                    type: 'text/html'
                });
                return blob;
            }

            function addOnPageLoad_() {
                window.addEventListener('DOMContentLoaded', function (e) {
                    var scrollX = document.documentElement.dataset.scrollX || 0;
                    var scrollY = document.documentElement.dataset.scrollY || 0;
                    window.scrollTo(scrollX, scrollY);
                });
            }

            function generate() {
                window.URL = window.URL || window.webkitURL;
                window.open(window.URL.createObjectURL(screenshotPage()));
            }
            exports.screenshotPage = screenshotPage;
            exports.generate = generate;
        })(window);
    })

;

Answer 1

You can't. Allowing web pages to write files to arbitrary paths on the end-user's machine would be a massive hole for malware to exploit. The user must be involved.