(In continuance of this answer)
I've been trying to make a script (using Greasemonkey) that would show a confirmation popup whenever I attempt to:
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.
The script in the answer above works ok in these cases.
I've noticed that, there's an additional way to submit an issue:
press Enter or Ctrl+Enter while having focus on the issue title textbox .
I'd like to cover this with the script, too.
Below is my code.
if I just open the new issue page (https://github.com/darkred/test/issues/new) in a new tab _(i.e. not via single-page application workflow, aka the History API)_), then the script also works when pressing Ctrl+Enter.
The problem that I still have are that
if I navigate to the new issue page via following the New issue
button (i.e. via the History API),
and then I either press Ctrl+Enter or just Enter in the title textbox,
then the popup appears momentarily but the submit is not blocked.
(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:
New Issue
button (you'll get redirected via the History API to https://github.com/darkred/test/issues/new,What's wrong with my script?
For reference here is a list of the GitHub's keyboard shortcuts list: screenshot,
that appears when you press ? in the new issue page.
I managed to solve this by forcing an unfocus+re-focus on the #issue_title
element:
when you open the New issue page, the focus is on the issue title textbox.
The script for some reason wouldn't block the submit. But, if you force an unfocus and re-focus of that element (using blur()
(=unfocus) and focus()
), then the script blocks the submit.
Here is the code (always // @run-at document-end
)
(function () {
function init() {
var targArea = document.querySelector('#issue_title'); // New issue title
function manageKeyEvents(zEvent) {
targArea.blur();
targArea.focus();
if ((zEvent.ctrlKey && zEvent.keyCode === 13) || zEvent.keyCode === 13) {
if (confirm('Are you sure?') === false) {
zEvent.stopPropagation();
zEvent.preventDefault();
} else {
var btn = document.querySelector('.btn-primary');
btn.click();
}
}
}
if (targArea !== null) {targArea.addEventListener('keydown', manageKeyEvents);}
}
init();
document.addEventListener('pjax:end', init); // for the History API
})();
And here is the complete userscript:
GitHub - Confirmations before submitting issues and comments