|
| 1 | +<!DOCTYPE html> |
| 2 | +<html> |
| 3 | +<head> |
| 4 | + <title>LNA / Mixed Content Test</title> |
| 5 | + <style> |
| 6 | + body { font-family: monospace; padding: 20px; background: #1e1e1e; color: #d4d4d4; } |
| 7 | + h2 { color: #569cd6; } |
| 8 | + .test { margin: 8px 0; padding: 8px; border-radius: 4px; } |
| 9 | + .pass { background: #1e3a1e; color: #4ec94e; } |
| 10 | + .fail { background: #3a1e1e; color: #e94e4e; } |
| 11 | + .wait { background: #3a3a1e; color: #e9e94e; } |
| 12 | + input, button { font-family: monospace; font-size: 14px; padding: 6px 12px; } |
| 13 | + button { cursor: pointer; background: #569cd6; color: #1e1e1e; border: none; border-radius: 4px; } |
| 14 | + #results { margin-top: 20px; } |
| 15 | + .info { color: #888; font-size: 12px; } |
| 16 | + </style> |
| 17 | +</head> |
| 18 | +<body> |
| 19 | + <h2>Chrome LNA / Mixed Content Integration Test</h2> |
| 20 | + <p class="info"> |
| 21 | + Page protocol: <strong id="pageProto"></strong> | |
| 22 | + Chrome version: <strong id="chromeVer"></strong> |
| 23 | + </p> |
| 24 | + |
| 25 | + <label>Target: <input id="target" value="http://192.168.15.17:7780/api/v1/health" size="60"></label> |
| 26 | + <button onclick="runAll()">Run All Tests</button> |
| 27 | + |
| 28 | + <div id="results"></div> |
| 29 | + |
| 30 | + <script> |
| 31 | + document.getElementById('pageProto').textContent = location.protocol; |
| 32 | + const match = navigator.userAgent.match(/Chrome\/(\d+)/); |
| 33 | + document.getElementById('chromeVer').textContent = match ? match[1] : 'unknown'; |
| 34 | + |
| 35 | + const results = document.getElementById('results'); |
| 36 | + |
| 37 | + function log(id, status, msg) { |
| 38 | + const el = document.getElementById(id); |
| 39 | + if (el) { |
| 40 | + el.className = 'test ' + status; |
| 41 | + el.textContent = `[${status.toUpperCase()}] ${el.dataset.label}: ${msg}`; |
| 42 | + } |
| 43 | + } |
| 44 | + |
| 45 | + function addTest(id, label) { |
| 46 | + const div = document.createElement('div'); |
| 47 | + div.id = id; |
| 48 | + div.dataset.label = label; |
| 49 | + div.className = 'test wait'; |
| 50 | + div.textContent = `[WAIT] ${label}: running...`; |
| 51 | + results.appendChild(div); |
| 52 | + } |
| 53 | + |
| 54 | + async function runTest(id, label, url, init) { |
| 55 | + addTest(id, label); |
| 56 | + const opts = JSON.stringify(init || {}); |
| 57 | + try { |
| 58 | + const start = performance.now(); |
| 59 | + const res = await fetch(url, init); |
| 60 | + const ms = Math.round(performance.now() - start); |
| 61 | + if (res.type === 'opaque') { |
| 62 | + log(id, 'pass', `opaque response (no-cors) — ${ms}ms | opts: ${opts}`); |
| 63 | + } else { |
| 64 | + const body = await res.text().catch(() => ''); |
| 65 | + log(id, 'pass', `${res.status} ${res.statusText} — ${ms}ms | body: ${body.slice(0,100)} | opts: ${opts}`); |
| 66 | + } |
| 67 | + } catch (err) { |
| 68 | + log(id, 'fail', `${err.name}: ${err.message} | opts: ${opts}`); |
| 69 | + } |
| 70 | + } |
| 71 | + |
| 72 | + async function runAll() { |
| 73 | + results.innerHTML = ''; |
| 74 | + const url = document.getElementById('target').value; |
| 75 | + |
| 76 | + // Parse URL to build HTTPS variant |
| 77 | + let httpsUrl; |
| 78 | + try { |
| 79 | + const u = new URL(url); |
| 80 | + u.protocol = 'https:'; |
| 81 | + httpsUrl = u.toString(); |
| 82 | + } catch { httpsUrl = url.replace('http://', 'https://'); } |
| 83 | + |
| 84 | + // Test 1: Plain fetch (no options) |
| 85 | + await runTest('t1', 'Plain fetch (no options)', url); |
| 86 | + |
| 87 | + // Test 2: mode: no-cors |
| 88 | + await runTest('t2', 'mode: no-cors', url, { mode: 'no-cors' }); |
| 89 | + |
| 90 | + // Test 3: targetAddressSpace: private |
| 91 | + await runTest('t3', 'targetAddressSpace: private', url, { targetAddressSpace: 'private' }); |
| 92 | + |
| 93 | + // Test 4: targetAddressSpace: local |
| 94 | + await runTest('t4', 'targetAddressSpace: local', url, { targetAddressSpace: 'local' }); |
| 95 | + |
| 96 | + // Test 5: no-cors + targetAddressSpace: private |
| 97 | + await runTest('t5', 'no-cors + targetAddressSpace: private', url, { mode: 'no-cors', targetAddressSpace: 'private' }); |
| 98 | + |
| 99 | + // Test 6: no-cors + targetAddressSpace: local |
| 100 | + await runTest('t6', 'no-cors + targetAddressSpace: local', url, { mode: 'no-cors', targetAddressSpace: 'local' }); |
| 101 | + |
| 102 | + // Test 7: HTTPS variant (plain) |
| 103 | + await runTest('t7', 'HTTPS variant (plain fetch)', httpsUrl); |
| 104 | + |
| 105 | + // Test 8: HTTPS + no-cors |
| 106 | + await runTest('t8', 'HTTPS variant + no-cors', httpsUrl, { mode: 'no-cors' }); |
| 107 | + |
| 108 | + // Summary |
| 109 | + const summary = document.createElement('div'); |
| 110 | + summary.style.marginTop = '20px'; |
| 111 | + summary.style.color = '#569cd6'; |
| 112 | + summary.innerHTML = '<h2>Done — check DevTools console for additional warnings/errors</h2>'; |
| 113 | + results.appendChild(summary); |
| 114 | + } |
| 115 | + </script> |
| 116 | +</body> |
| 117 | +</html> |
0 commit comments