Add comprehensive debugging to product comparison button

- Added console.log at script load, IIFE execution, init, and bindEvents
- Added check for button element existence in console
- Added alert on button click for immediate visual feedback
- Added logging before AJAX request with URL and nonce
- Added beforeSend callback for AJAX request

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

assets/js/admin.js

@@ -2,14 +2,20 @@
  * Admin JavaScript for Informatiq Smart Pricing
  */
 
+console.log('Informatiq Smart Pricing: Script loaded');
+
 (function($) {
 	'use strict';
 
+	console.log('Informatiq Smart Pricing: IIFE executed, jQuery available:', typeof $ !== 'undefined');
+
 	var InformatiqSP = {
 		/**
 		 * Initialize
 		 */
 		init: function() {
+			console.log('Informatiq Smart Pricing: init() called');
+			console.log('informatiqSP object:', typeof informatiqSP !== 'undefined' ? informatiqSP : 'NOT DEFINED');
 			this.bindEvents();
 		},
 
@@ -17,10 +23,17 @@
 		 * Bind event handlers
 		 */
 		bindEvents: function() {
+			console.log('Informatiq Smart Pricing: bindEvents() called');
+
+			var $compareBtn = $('#informatiq-sp-compare-products');
+			console.log('Compare products button found:', $compareBtn.length > 0);
+
 			$('#informatiq-sp-manual-sync').on('click', this.handleManualSync);
 			$('#informatiq-sp-test-connection').on('click', this.handleTestConnection);
 			$('#informatiq-sp-revoke-auth').on('click', this.handleRevokeAuth);
-			$('#informatiq-sp-compare-products').on('click', this.handleCompareProducts);
+			$compareBtn.on('click', this.handleCompareProducts);
+
+			console.log('Informatiq Smart Pricing: All event handlers bound');
 		},
 
 		/**
@@ -188,24 +201,51 @@
 		handleCompareProducts: function(e) {
 			e.preventDefault();
 
+			console.log('=== COMPARE PRODUCTS CLICKED ===');
+			alert('Compare Products button clicked! Check console for details.');
+
 			var $button = $(this);
 			var $spinner = $button.next('.spinner');
 			var $results = $('#informatiq-sp-comparison-results');
 			var $tbody = $('#informatiq-sp-comparison-tbody');
+			var $status = $('#informatiq-sp-sync-status');
+
+			console.log('Button:', $button.length);
+			console.log('Spinner:', $spinner.length);
+			console.log('Results container:', $results.length);
+			console.log('informatiqSP:', informatiqSP);
+
+			// Show loading status
+			$status
+				.removeClass('notice-success notice-error')
+				.addClass('notice-info')
+				.html('<p><strong>Loading product comparison...</strong> This may take a moment.</p>')
+				.show();
 
 			// Disable button and show spinner
 			$button.prop('disabled', true);
 			$spinner.addClass('is-active');
 
+			console.log('Making AJAX request to:', informatiqSP.ajaxUrl);
+			console.log('With nonce:', informatiqSP.nonce);
+
 			// Make AJAX request
 			$.ajax({
 				url: informatiqSP.ajaxUrl,
 				type: 'POST',
+				timeout: 120000, // 2 minute timeout
 				data: {
 					action: 'informatiq_sp_compare_products',
 					nonce: informatiqSP.nonce
 				},
+				beforeSend: function(xhr) {
+					console.log('AJAX beforeSend - request starting');
+				},
 				success: function(response) {
+					console.log('AJAX success callback');
+					console.log('AJAX response:', response);
+					$status.hide();
+
 					if (response.success) {
 						var data = response.data;
 						var html = '';
@@ -245,13 +285,23 @@
 						$button.after('<p class="description" style="margin-top: 10px;">' + summary + '</p>');
 
 					} else {
-						alert('Error: ' + (response.data.message || 'Unknown error'));
+						$status
+							.removeClass('notice-info notice-success')
+							.addClass('notice-error')
+							.html('<p>Error: ' + (response.data.message || 'Unknown error') + '</p>')
+							.show();
 					}
 				},
 				error: function(jqXHR, textStatus, errorThrown) {
-					alert('Error: ' + errorThrown);
+					console.error('AJAX error:', textStatus, errorThrown, jqXHR.responseText);
+					$status
+						.removeClass('notice-info notice-success')
+						.addClass('notice-error')
+						.html('<p>Error: ' + errorThrown + ' - ' + textStatus + '</p>')
+						.show();
 				},
 				complete: function() {
+					console.log('AJAX request complete');
 					$button.prop('disabled', false);
 					$spinner.removeClass('is-active');
 				}