Develop Reference

Document.addEventListener() keyup and keydown don't work after click

I'm writing a tampermonkey script that I want to perform an action when a certain set of keys is pressed (cmd + alt + t). I'm seeing a problem where the code stops executing altogether after I click anywhere on the page and I have to either hard refresh or click a certain place on the page (search bar in CloudWatch) to get it working again.
Here's my code:
(async function() {
var set = new Set();
function funcA() {
console.log('funcA');
}
function funcB() {
console.log('funcB');
if (set.has(91) && set.has(18) && set.has(84)) { // cmd + alt + t
funcA();
}
}
function onKeyUp(e) {
console.log('onKeyUp');
set.clear();
console.log(new Array(...set).join(' '));
}
function onKeyDown(e) {
console.log('onKeyDown');
set.add(e.which);
console.log(new Array(...set).join(' '));
funcB();
}
function init() {
console.log('init');
console.log('Adding event listeners.');
document.addEventListener('keyup', onKeyUp);
document.addEventListener('keydown', onKeyDown);
}
if( document.readyState !== 'loading' ) {
console.log( 'not loading' );
init();
} else {
document.addEventListener('DOMContentLoaded', init);
}
})();
The problem only seems to happen on certain pages, for example in AWS CloudWatch logs.
Any ideas?

JavaScript beforeunload event fails to fire in Chrome

There are many discussions of the Window: beforeunload event on Stack Overflow.
My specific problem is that my beforeunload event is not being called when a user closes a tab in Chrome (v91.0.) if the page is processing other JavaScript.
Is there anyway to guarantee the firing of the beforeunload event?
Specifically what I am trying to do is when a user closes a tab or the browser the beforeunload event is called and that listener function makes a call to another function that makes an Ajax call to an action class that signals the server that the user is no longer active (and resources can be released); maybe there is a better way to do this.
Here is the code for the listener:
window.addEventListener('beforeunload', function (e) {
setExternalUserStatus(false);
});
Here is the code for the AJAX call :
function setExternalUserStatus(externalUserStatus) {
if (!xmlhttpLogger) {
createXMLHttpRequestLogger();
}
xmlhttpLogger.open("POST", "../../geospatial/setExternalUserStatus.action?externalUserStatus=" + externalUserStatus);
xmlhttpLogger.setRequestHeader("pragma", "no-cache");
xmlhttpLogger.setRequestHeader("Cache-Control", "no-cache,max-age=0");
xmlhttpLogger.send(null);
xmlhttpLogger.onreadystatechange = function () {
if (xmlhttpLogger.readyState === 4) {
if (xmlhttpLogger.status === 200) {
if (xmlhttpLogger.responseText.includes("updated")) {
console.debug("ExternalUserStatus updated.")
} else {
console.debug("ExternalUserStatus NOT updated.")
}
} else {
console.log("Server status: " + xmlhttpLogger.status)
}
}
}
}
Thx in advance.

Back button handler not being registered when opening the app via push notification

I have an app written in Ionic v1 and AngularJS.
The app is using $ionicPlatform.registerBackButtonAction to handle the device's back button action.
Everything is working great when normally using the app. The problem is starting when the app is being opened by a push notification.
When the app is not in the background, and is being opened by clicking the push notification, the back button handler is not being registered and the physical back button throws me out of the app.
If I click anywhere on the screen (click, not scroll) then the touch event is being registered and everything is working well.
I have tried registering the event in multiple locations after the push notification event is launched.
I have tried simulating a touch event programaticlly on an empty space on the screen.
I have tried dispatching the resume event to simulate a return from paused state.
I have tried reloading the page programmaticlly after page loads.
Nothing seems to work.
The is my $ionicPlatform.registerBackButtonAction event handler that is being registered in app.run:
$ionicPlatform.registerBackButtonAction(function(e) {
e.preventDefault();
function showConfirm() {
var confirmPopup = $ionicPopup.show({
title : 'Close',
template : '<div>Do you want to close the app?</div>',
buttons : [
{
text : '<b>Cancel</b>'
},
{
text : '<b>Approve</b>',
type: 'button-positive',
onTap : function() {
ionic.Platform.exitApp();
}
}
]
});
};
// Is there a page to go back to?
if ($ionicHistory.backView()) {
// Go back in history
if($rootScope.pushPressed2) {
$location.path('/app/home').replace();
}
else {
$rootScope.backButtonPressed = true;
$ionicHistory.backView().go();
}
}
else {
if($rootScope.pushPressed2) {
$location.path('/app/home').replace();
}
else {
showConfirm();
}
}
return false;
}, 101);

$ionicPlatform.registerBackButtonAction(function(event)
{
if ($ionicHistory.currentStateName() === "home" )
{
$cordovaDialogs.confirm('Are You Sure You Want to Exit?', 'AppName', ['Cancel','OK'])
.then(function(buttonIndex) {
// no button = 0 'OK' = 1 'Cancel' = 2
var btnIndex = buttonIndex;
if(buttonIndex==2)
{
ionic.Platform.exitApp();
}
});
}
else
{
if($ionicHistory.currentStateName() === "login" )
{
ionic.Platform.exitApp();
}
else
{
$ionicHistory.goBack();
}
}
}, 100);

cordova/phonegap block and allow back button

I am trying to block the back button in certain cases.
However as soon as I add the eventlistener it always blocks the back button.
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.addEventListener("backbutton", onBackKey, false);
}
function onBackKey() {
if($scope.quicksetup)
{
alert("1");
return false;
}
else
{
alert("2");
return true;
}
}
It comes in the else structure but when it returns true it doesn't execute the back action anymore.
There are no errors whatsoever in logcat.
I have no idea what is causing this...

Once you set the listener you overwrite the backbutton behaviour no matter if you return true or false it will not execute the normal way anymore.
You need to use navigator.app.backHistory() and navigator.app.exitApp(); to handle going back and exiting the app.
The onbackbutton callback does not expect anything to be returned, it is not a boolean callback function.
function onBackKey() {
if($scope.quicksetup)
{
alert("1");
return;
}
else
{
alert("2");
navigator.app.exitApp(); //I guess you want to exit the app here
}
}

Android: Unable to capture the backbutton click in javascript

I am using IntelXDK to develop an android app in HTML5, CSS3 and JavaScript, the app is a one page app which works fine while switching views with HTML buttons but when pressing the back button on a mobile device the app exits, however I want to capture this event and display the home screen.
The event works in a simulator but not on a physical device
This is what I have done to capture the backbutton click event but the app just closes:
$(document).ready(function () {
var animTime = 300,
clickPolice = false;
$(document).on('click', '.acc-btn', function () {
if (!clickPolice) {
clickPolice = true;
var currIndex = $(this).index('.acc-btn');
$('.acc-content').stop().animate({ height: 0 }, animTime);
$('.acc-content').eq(currIndex).stop().animate({ height: 108 }, animTime);
setTimeout(function () { clickPolice = false; }, animTime);
}
});
//Back button event
document.addEventListener('backbutton', function () {
if ($('#front').hasClass('hidden')) {
ShowPage('front');
return false;
}
else {
navigator.app.exitApp();
}
}, false);
});
//Show page function etc.....
I know the ShowPage function works fine as it is used elsewhere
Any help is appreciated

Check out the following link for Android - https://software.intel.com/en-us/node/493108
You have to capture the back button and add a virtual page to prevent the app from exiting
document.addEventListener("intel.xdk.device.hardware.back", function() {
//continue to grab the back button
intel.xdk.device.addVirtualPage();
}, false);

Try to remove the boolean parameter from your addEventListener so
//Back button event
document.addEventListener('backbutton', function () {
if ($('#front').hasClass('hidden')) {
ShowPage('front');
return false;
}
else {
navigator.app.exitApp();
}
});