Greasy Fork

Script for creating a confirmation popup when submitting/closing an issue via Ctrl+Enter in GitHub

Test URL: https://github.com/darkred/test/issues/new

GitHub allows in the issues area for a public repo:

• submitting a new issue even with 1 character as title and no body, and
• closing an issue just by pressing the 'close issue' button (i.e. without commenting).

The above happens to me quite a lot because the build-in hotkey for 'submiting an issue or comment' is Ctrl + Enter:
I accidentally press that keyboard shortcut before my issue/comment text is ready.

So, I'm trying to make a script (using Greasemonkey) that would show a confirmation popup whenever I try to:

• submit a new issue, or
• close an issue

via pressing Ctrl + Enter:
if user presses Ok in the popup, then the script to allow the submit,
but if the user presses Cancel in the popup, then the script to stop the submit.

After this helpful comment in StackOverflow (see below) I have the following code:

var targArea_1 = document.querySelector('#issue_body');         // New issue textarea
var targArea_2 = document.querySelector('#new_comment_field');  // New comment textarea

if (targArea_1 !== null) {targArea_1.addEventListener('keydown', manageKeyEvents);}
if (targArea_2 !== null) {targArea_2.addEventListener('keydown', manageKeyEvents);}


function manageKeyEvents (zEvent) {
    if (zEvent.ctrlKey && zEvent.keyCode == 13) {   // If Ctrl+Enter is pressed
        if (confirm('Are you sure?') == false) {    // If the user presses Cancel in the popup
            zEvent.stopPropagation();               // then it stops propagation of the event 
            zEvent.preventDefault();                // and cancels/stops the submit submit action bound to Ctrl+Enter
        } 
    }
}

Now the popup appears ok whenever I press Ctrl + Enter.
The problem is that the issue/comment is not submitted when pressing Ok in the popup (even if I haven't pressed Cancel in the popup before, at all). How to fix this?
And, how to re-allow the issue/comment submit after I have pressed Cancel in the popup once?
In other words: how to re-enable default after preventDefault() ?

PS. I have asked this question in stackoverflow 16 days ago:
http://stackoverflow.com/questions/38283979/userscript-for-creating-a-confirmation-popup-whenever-submitting-closing-an-issu
in case you would prefer to answer there.

maybe something like this :

if (confirm('Are you sure?') == false){
// ...
}else{
var btn=document.querySelector("#partial-new-comment-form-actions button");
if(btn) btn.click();
}

?

Thanks a lot!

(never crossed my mind that I had to explicitly add an else branch - never thought that it was needed, my bad)

I see that you have a stackoverflow profile. If you'd like, post this in SO as answer, and I'll gladly accept+upvote it.

Apparently, the point is that the 'confirm' messagebox clears keyboard events queue.

I didn't know that. Thank you

I'd like to cover one more case with the script: to display the confirmation popup while having focus on the issue title textbox.

I've noticed that, in that textbox, you may submit an issue either by pressing Enter or Ctrl+Enter.

Below is my code. The problem is that the popup doesn't block the submit at all when pressing Ctrl+Enterwhile on the issue title textbox.

(function () {
    function init() {
        var targArea = document.querySelector('#issue_title'); // New issue title
        function manageKeyEvents(zEvent) {
            if (zEvent.ctrlKey && zEvent.keyCode === 13) {      // and the focused element is the issue title textbox
                if (confirm('Are you sure?') === false) {
                    zEvent.stopPropagation();
                    zEvent.preventDefault();
                // } else {
                    // var btn = document.querySelector('.btn-primary');                        // 'Submit new issue' button                
                    // btn.click();
                }
            }
        }
        if (targArea !== null) {targArea.addEventListener('keydown', manageKeyEvents);}
    }
    init();
    document.addEventListener('pjax:end', init); // for the History API
})();

STR:

• open https://github.com/darkred/test/issues,
• click the New Issue button (you'll get redirected to https://github.com/darkred/test/issues/new (via the History API)),
• (You'll notice the focus is on the issue title textbox)
  type 123 as issue title and keep the focus on the issue title textbox (leave the issue body empty) ,
• press Ctrl+Enter,
• notice now that the confirmation popup will appear momentarily,
  but the issue will be submitted i.e. the popup won't block the submit.

What's wrong with my script?

On the other hand, if I either change the 1st if into zEvent.keyCode === 13) (i.e. listen for Enter) and repeat the below STR,
or if I just open the new issue page (https://github.com/darkred/test/issues/new) in a new tab (not redirected via the History API), then the script works ok.

For reference here is a list of the GitHub's keyboard shortcuts list: screenshot,
that appears when you press ? in the new issue page.