Fix OWASP toggle interaction and prevent recursive change events

Fixes issues where toggle became unresponsive and triggered recursive calls:

1. Add flags (updatingOWASPStatus, updatingComodoStatus) to prevent change
   event handlers from triggering when status check updates toggle state
2. Guard change event handlers to return early when flags are set
3. IMPORTANT: Still increment counters when returning early to maintain
   correct counter state for subsequent user clicks
4. Set flags before updating toggle via prop('checked'), reset after 100ms
5. Use timeout delays (500ms) before status checks after install/uninstall
   to allow operations to complete and prevent race conditions

This ensures:
- Toggle responds correctly to user clicks on first click
- Status updates don't trigger unwanted installations
- Counter state is maintained even when skipping automatic updates
- No recursive loops when updating toggle state
This commit is contained in:
usmannasir
2025-11-24 02:07:19 +05:00
parent ae020ece7b
commit 54262e6a52

View File

@@ -1226,10 +1226,18 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
var comodoInstalled = false;
var counterOWASP = 0;
var counterComodo = 0;
var updatingOWASPStatus = false;
var updatingComodoStatus = false;
$('#owaspInstalled').change(function () {
// Prevent triggering installation when status check updates the toggle
if (updatingOWASPStatus) {
counterOWASP = counterOWASP + 1; // Still increment counter
return;
}
owaspInstalled = $(this).prop('checked');
$scope.ruleFiles = true;
@@ -1246,6 +1254,12 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
$('#comodoInstalled').change(function () {
// Prevent triggering installation when status check updates the toggle
if (updatingComodoStatus) {
counterComodo = counterComodo + 1; // Still increment counter
return;
}
$scope.ruleFiles = true;
comodoInstalled = $(this).prop('checked');
@@ -1291,6 +1305,10 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
if (updateToggle === true) {
// Set flags to prevent change event from triggering installation
updatingOWASPStatus = true;
updatingComodoStatus = true;
if (response.data.owaspInstalled === 1) {
$('#owaspInstalled').prop('checked', true);
$scope.owaspDisable = false;
@@ -1305,6 +1323,13 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
$('#comodoInstalled').prop('checked', false);
$scope.comodoDisable = true;
}
// Reset flags after toggle update
$timeout(function() {
updatingOWASPStatus = false;
updatingComodoStatus = false;
}, 100);
} else {
if (response.data.owaspInstalled === 1) {
@@ -1366,8 +1391,10 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
$scope.installationFailed = true;
$scope.installationSuccess = false;
// Update toggle state immediately to reflect installation result
getOWASPAndComodoStatus(true);
// Update toggle state after a short delay to reflect installation result
$timeout(function() {
getOWASPAndComodoStatus(true);
}, 500);
} else {
$scope.modsecLoading = true;
@@ -1382,7 +1409,9 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
$scope.errorMessage = response.data.error_message;
// Update toggle to reflect failed installation (will show OFF)
getOWASPAndComodoStatus(true);
$timeout(function() {
getOWASPAndComodoStatus(true);
}, 500);
}
}