139 lines
5.6 KiB
HTML
139 lines
5.6 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Protocol Address Debug Test</title>
|
||
|
|
<style>
|
||
|
|
body { font-family: Arial, sans-serif; margin: 20px; }
|
||
|
|
.test-section { margin: 20px 0; padding: 15px; border: 1px solid #ccc; }
|
||
|
|
button { padding: 10px 15px; margin: 5px; background: #007bff; color: white; border: none; border-radius: 4px; cursor: pointer; }
|
||
|
|
button:hover { background: #0056b3; }
|
||
|
|
.debug-output { background: #f8f9fa; padding: 10px; border: 1px solid #dee2e6; margin: 10px 0; font-family: monospace; white-space: pre-wrap; }
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>Protocol Address Auto-fill Debug Test</h1>
|
||
|
|
|
||
|
|
<div class="test-section">
|
||
|
|
<h2>Test 1: Direct Function Call</h2>
|
||
|
|
<p>Test if autoPopulateSignalForm function works directly:</p>
|
||
|
|
<button onclick="testDirectFunction()">Test Direct Function</button>
|
||
|
|
<div id="test1-output" class="debug-output"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="test-section">
|
||
|
|
<h2>Test 2: Simulate "Use This Signal" Button</h2>
|
||
|
|
<p>Simulate clicking a "Use This Signal" button:</p>
|
||
|
|
<button onclick="testUseSignalButton()">Simulate Use Signal Button</button>
|
||
|
|
<div id="test2-output" class="debug-output"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="test-section">
|
||
|
|
<h2>Test 3: Check Modal Elements</h2>
|
||
|
|
<p>Check if modal form elements exist:</p>
|
||
|
|
<button onclick="checkModalElements()">Check Modal Elements</button>
|
||
|
|
<div id="test3-output" class="debug-output"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="test-section">
|
||
|
|
<h2>Test 4: Manual Modal Population</h2>
|
||
|
|
<p>Manually populate modal fields:</p>
|
||
|
|
<button onclick="manualPopulateModal()">Manual Populate</button>
|
||
|
|
<div id="test4-output" class="debug-output"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// Test data
|
||
|
|
const testSignalData = {
|
||
|
|
signal_name: 'Test Booster Pump Flow Rate',
|
||
|
|
tags: ['equipment:pump', 'protocol:modbus_tcp', 'data_point:flow_rate', 'discovered:true'],
|
||
|
|
protocol_type: 'modbus_tcp',
|
||
|
|
protocol_address: '30002',
|
||
|
|
db_source: 'measurements.booster_pump_flow_rate'
|
||
|
|
};
|
||
|
|
|
||
|
|
function logTest(testId, message) {
|
||
|
|
const output = document.getElementById(testId + '-output');
|
||
|
|
if (output) {
|
||
|
|
output.textContent += message + '\n';
|
||
|
|
}
|
||
|
|
console.log(message);
|
||
|
|
}
|
||
|
|
|
||
|
|
function testDirectFunction() {
|
||
|
|
logTest('test1', 'Testing direct function call...');
|
||
|
|
|
||
|
|
if (typeof window.autoPopulateSignalForm === 'function') {
|
||
|
|
logTest('test1', '✓ autoPopulateSignalForm function found');
|
||
|
|
window.autoPopulateSignalForm(testSignalData);
|
||
|
|
logTest('test1', '✓ Function called successfully');
|
||
|
|
} else {
|
||
|
|
logTest('test1', '✗ autoPopulateSignalForm function NOT found');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function testUseSignalButton() {
|
||
|
|
logTest('test2', 'Simulating "Use This Signal" button click...');
|
||
|
|
|
||
|
|
if (window.simplifiedDiscovery && typeof window.simplifiedDiscovery.useDiscoveredEndpoint === 'function') {
|
||
|
|
logTest('test2', '✓ simplifiedDiscovery.useDiscoveredEndpoint found');
|
||
|
|
// Simulate clicking on the first signal (index 0)
|
||
|
|
window.simplifiedDiscovery.useDiscoveredEndpoint(0);
|
||
|
|
logTest('test2', '✓ Function called successfully');
|
||
|
|
} else {
|
||
|
|
logTest('test2', '✗ simplifiedDiscovery.useDiscoveredEndpoint NOT found');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkModalElements() {
|
||
|
|
logTest('test3', 'Checking modal form elements...');
|
||
|
|
|
||
|
|
const elements = [
|
||
|
|
'signal_name', 'tags', 'protocol_type', 'protocol_address', 'db_source',
|
||
|
|
'signal-modal', 'modal-title'
|
||
|
|
];
|
||
|
|
|
||
|
|
elements.forEach(id => {
|
||
|
|
const element = document.getElementById(id);
|
||
|
|
if (element) {
|
||
|
|
logTest('test3', `✓ Element #${id} found`);
|
||
|
|
} else {
|
||
|
|
logTest('test3', `✗ Element #${id} NOT found`);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function manualPopulateModal() {
|
||
|
|
logTest('test4', 'Manually populating modal fields...');
|
||
|
|
|
||
|
|
// First, try to open the modal
|
||
|
|
if (typeof window.showAddSignalModal === 'function') {
|
||
|
|
window.showAddSignalModal();
|
||
|
|
logTest('test4', '✓ Modal opened');
|
||
|
|
} else {
|
||
|
|
logTest('test4', '✗ showAddSignalModal function NOT found');
|
||
|
|
}
|
||
|
|
|
||
|
|
// Wait a bit for modal to open, then populate
|
||
|
|
setTimeout(() => {
|
||
|
|
const fields = {
|
||
|
|
'signal_name': testSignalData.signal_name,
|
||
|
|
'tags': testSignalData.tags.join(', '),
|
||
|
|
'protocol_type': testSignalData.protocol_type,
|
||
|
|
'protocol_address': testSignalData.protocol_address,
|
||
|
|
'db_source': testSignalData.db_source
|
||
|
|
};
|
||
|
|
|
||
|
|
Object.entries(fields).forEach(([id, value]) => {
|
||
|
|
const element = document.getElementById(id);
|
||
|
|
if (element) {
|
||
|
|
element.value = value;
|
||
|
|
logTest('test4', `✓ Set #${id} to: ${value}`);
|
||
|
|
} else {
|
||
|
|
logTest('test4', `✗ Element #${id} NOT found`);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}, 500);
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|