feat: rework engine and CLI for dnstraverse parity
Port the traversal engine to the Ruby dnstraverse model so behaviour and output match dns.squish.net: - dns: single RD=0 query path (RD=1 only for upstream root discovery), per-run packet cache, EDNS0 512-fallback with warnings, UDP->TCP on truncation; fix --retries 0 and --root-server IP-literal handling; drop all hardcoded 127.0.0.1:53 resolvers - traverse: hierarchical per-branch InfoCache, 7-step response classification with the full 10-status vocabulary, bailiwick partitioning, strictly-deeper lame-referral rule, refid grammar with .0 resolve subtrees and childset digits, per-IP branching at 1/n weight, cache-based glue resolution with noglue/loop dead ends, CNAME restarts from the deepest cached zone, fast-mode memoization, probability aggregation with Ruby-identical stats keys (sums to 1.0) - output: byte-for-byte reference text format pinned by a golden test, reference CLI defaults, working --quiet/--show-X=false, TTY-aware colour, deduplicated deterministic JSON - web: adapt API/SPA to the new engine, SSE events carry refid/status, fix subscribe/snapshot duplicate-event race and a statusCls TDZ bug, align SPA type list with the backend - delete the old engine and dead code (net -4,350 lines) Verified against live runs of the reference Ruby engine across five domains (answers, NXDOMAIN, null MX, CNAME restart, glueless resolve) with no divergences beyond the documented typo fixes. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Gary Hansen
co-authored by
Claude Fable 5
Claude Fable 5
parent
af15c9c2d4
commit
d71c7fbef2
+209
-155
@@ -285,22 +285,28 @@
|
||||
content: 'Awaiting traversal…';
|
||||
color: var(--text-dim);
|
||||
}
|
||||
.pe { display: flex; gap: 0.5rem; }
|
||||
.pe { display: flex; gap: 0.5rem; align-items: baseline; }
|
||||
.pe-badge {
|
||||
flex-shrink: 0;
|
||||
min-width: 70px;
|
||||
text-align: center;
|
||||
font-size: 0.65rem;
|
||||
padding: 1px 5px;
|
||||
border-radius: 3px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
background: rgba(139,143,168,0.15);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.pe-badge.start { background: rgba(74,124,246,0.18); color: var(--primary); }
|
||||
.pe-badge.complete { background: rgba(62,207,142,0.18); color: var(--success); }
|
||||
.pe-badge.resolve { background: rgba(56,189,248,0.18); color: var(--info); }
|
||||
.pe-depth { color: var(--text-dim); }
|
||||
.pe-name { color: var(--text); }
|
||||
.pe-server { color: var(--text-muted); }
|
||||
.pe-badge.st-working { background: rgba(74,124,246,0.18); color: var(--primary); }
|
||||
.pe-badge.st-answered { background: rgba(62,207,142,0.18); color: var(--success); }
|
||||
.pe-badge.st-resolve { background: rgba(56,189,248,0.18); color: var(--info); }
|
||||
.pe-badge.st-warn { background: rgba(245,166,35,0.18); color: var(--warning); }
|
||||
.pe-badge.st-err { background: rgba(240,68,56,0.18); color: var(--danger); }
|
||||
/* Progress lines mirror the CLI: "<refid> <server> (<ips>)" — keep the
|
||||
spacing intact. */
|
||||
.pe-text { color: var(--text); white-space: pre; }
|
||||
|
||||
/* ── Results tree ───────────────────────────────────────────────── */
|
||||
.results-section h2 {
|
||||
@@ -318,57 +324,44 @@
|
||||
color: var(--text-dim);
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.result-item {
|
||||
/* Aggregated leaves rendered like the CLI Results section: fixed-width
|
||||
text with significant leading spaces, so white-space must be pre. */
|
||||
.result-block {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.8rem;
|
||||
font-size: 0.78rem;
|
||||
line-height: 1.5;
|
||||
white-space: pre;
|
||||
overflow-x: auto;
|
||||
margin: 0 0 0.5rem;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border-radius: var(--radius-sm);
|
||||
border: 1px solid var(--border);
|
||||
margin-bottom: 0.5rem;
|
||||
border-left-width: 3px;
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--bg-card);
|
||||
transition: border-color 0.12s;
|
||||
color: var(--text);
|
||||
}
|
||||
.result-item:hover { border-color: var(--border-focus); }
|
||||
.result-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.result-indent { color: var(--text-dim); flex-shrink: 0; }
|
||||
.rtype-badge {
|
||||
font-size: 0.65rem;
|
||||
padding: 1px 5px;
|
||||
border-radius: 3px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.rtype-answer { background: rgba(62,207,142,0.15); color: var(--success); }
|
||||
.rtype-referral { background: rgba(74,124,246,0.15); color: var(--primary); }
|
||||
.rtype-nxdomain,
|
||||
.rtype-servfail { background: rgba(240,68,56,0.15); color: var(--danger); }
|
||||
.rtype-timeout { background: rgba(245,166,35,0.15); color: var(--warning); }
|
||||
.rtype-nodata { background: rgba(56,189,248,0.15); color: var(--info); }
|
||||
.rtype-cname { background: rgba(168,85,247,0.15); color: #c084fc; }
|
||||
.rtype-other { background: rgba(139,143,168,0.15);color: var(--text-muted); }
|
||||
.result-block.st-answered { border-left-color: var(--success); }
|
||||
.result-block.st-warn { border-left-color: var(--warning); }
|
||||
.result-block.st-err { border-left-color: var(--danger); }
|
||||
.result-block.st-other { border-left-color: var(--text-dim); }
|
||||
|
||||
.result-prob {
|
||||
color: var(--text-muted);
|
||||
font-size: 0.72rem;
|
||||
}
|
||||
.result-server { color: var(--text-dim); font-size: 0.72rem; margin-left: auto; }
|
||||
.result-answers {
|
||||
margin-top: 0.35rem;
|
||||
padding-left: 1.2rem;
|
||||
color: var(--text-muted);
|
||||
/* ── Summary Results ───────────────────────────────────────────── */
|
||||
.summary-pre {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.6;
|
||||
white-space: pre;
|
||||
overflow-x: auto;
|
||||
margin: 0 0 1rem;
|
||||
padding: 0.6rem 0.75rem;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
}
|
||||
.result-answers span { display: block; }
|
||||
.cname-chain {
|
||||
color: #c084fc;
|
||||
font-size: 0.72rem;
|
||||
margin-top: 0.2rem;
|
||||
padding-left: 1.2rem;
|
||||
.summary-pre:empty::before {
|
||||
content: 'No summary yet.';
|
||||
color: var(--text-dim);
|
||||
}
|
||||
|
||||
/* ── Stats panel ────────────────────────────────────────────────── */
|
||||
@@ -478,17 +471,16 @@
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
/>
|
||||
<!-- Options must match config.ParseQueryType exactly. -->
|
||||
<select id="typeSelect" class="type-select" title="DNS record type">
|
||||
<option>A</option>
|
||||
<option>AAAA</option>
|
||||
<option>MX</option>
|
||||
<option>NS</option>
|
||||
<option>CNAME</option>
|
||||
<option>SOA</option>
|
||||
<option>MX</option>
|
||||
<option>TXT</option>
|
||||
<option>SOA</option>
|
||||
<option>PTR</option>
|
||||
<option>SRV</option>
|
||||
<option>CAA</option>
|
||||
<option>ANY</option>
|
||||
</select>
|
||||
<button id="submitBtn" class="submit-btn">
|
||||
@@ -549,14 +541,17 @@
|
||||
<!-- Right: stats panel -->
|
||||
<div>
|
||||
<div class="card">
|
||||
<div class="card-title">📊 Summary</div>
|
||||
<div class="card-title">📊 Summary Results</div>
|
||||
<pre class="summary-pre" id="summaryPre"></pre>
|
||||
|
||||
<div class="card-title">Overview</div>
|
||||
<div class="stat-grid" id="statGrid">
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Status</div>
|
||||
<div class="stat-value" id="statStatus">—</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-label">Steps</div>
|
||||
<div class="stat-label">Results</div>
|
||||
<div class="stat-value" id="statSteps">—</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
@@ -640,6 +635,7 @@
|
||||
const detailType = document.getElementById('detailType');
|
||||
const detailStarted = document.getElementById('detailStarted');
|
||||
const detailFinished= document.getElementById('detailFinished');
|
||||
const summaryPre = document.getElementById('summaryPre');
|
||||
|
||||
// ── State ─────────────────────────────────────────────────────────
|
||||
let currentJobId = null;
|
||||
@@ -647,6 +643,7 @@
|
||||
let startTime = null;
|
||||
let timerInterval = null;
|
||||
let progressItems = [];
|
||||
let progressRows = new Map(); // refid → row elements, updated in place
|
||||
let resultItems = [];
|
||||
|
||||
// ── Theme toggle ──────────────────────────────────────────────────
|
||||
@@ -745,41 +742,57 @@
|
||||
}
|
||||
|
||||
// ── Progress rendering ────────────────────────────────────────────
|
||||
// One row per refid, updated in place as later events (start/answer/
|
||||
// answer_fast) arrive for the same node. Line format mirrors the CLI:
|
||||
// "<refid> <server> (<ips>)" plus resolving / completed-earlier markers.
|
||||
function appendProgress(ev) {
|
||||
progressItems.push(ev);
|
||||
progressCount.textContent = progressItems.length;
|
||||
if (!ev.refid) return;
|
||||
|
||||
const row = document.createElement('div');
|
||||
row.className = 'pe';
|
||||
|
||||
const badgeClass = ev.is_resolve ? 'resolve' : ev.stage;
|
||||
const badge = document.createElement('span');
|
||||
badge.className = `pe-badge ${badgeClass}`;
|
||||
badge.textContent = ev.is_resolve ? 'glue' : ev.stage;
|
||||
|
||||
const depth = document.createElement('span');
|
||||
depth.className = 'pe-depth';
|
||||
depth.textContent = `[d${ev.depth}]`;
|
||||
|
||||
const name = document.createElement('span');
|
||||
name.className = 'pe-name';
|
||||
name.textContent = ev.name + ' (' + ev.qtype + ')';
|
||||
|
||||
row.appendChild(badge);
|
||||
row.appendChild(depth);
|
||||
row.appendChild(name);
|
||||
|
||||
if (ev.server) {
|
||||
const srv = document.createElement('span');
|
||||
srv.className = 'pe-server';
|
||||
srv.textContent = '@ ' + ev.server;
|
||||
row.appendChild(srv);
|
||||
let row = progressRows.get(ev.refid);
|
||||
if (!row) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'pe';
|
||||
const badge = document.createElement('span');
|
||||
badge.className = 'pe-badge';
|
||||
const text = document.createElement('span');
|
||||
text.className = 'pe-text';
|
||||
el.appendChild(badge);
|
||||
el.appendChild(text);
|
||||
row = { el, badge, text };
|
||||
progressRows.set(ev.refid, row);
|
||||
progressFeed.appendChild(el);
|
||||
}
|
||||
|
||||
progressFeed.appendChild(row);
|
||||
const status = ev.status || ev.stage;
|
||||
row.badge.textContent = ev.is_resolve ? 'glue ' + status : status;
|
||||
row.badge.className = 'pe-badge ' + progressBadgeCls(ev);
|
||||
|
||||
let line = ev.refid + ' ' + (ev.server || ev.name);
|
||||
if (ev.ips) line += ' (' + ev.ips + ')';
|
||||
if (ev.completed_earlier) {
|
||||
line += ' -- completed earlier (' + ev.completed_earlier + ')';
|
||||
} else if (ev.stage === 'start' && !ev.ips) {
|
||||
line += ' -- resolving';
|
||||
}
|
||||
row.text.textContent = line;
|
||||
|
||||
progressFeed.scrollTop = progressFeed.scrollHeight;
|
||||
}
|
||||
|
||||
function progressBadgeCls(ev) {
|
||||
if (ev.is_resolve) return 'st-resolve';
|
||||
switch (ev.status) {
|
||||
case 'answered': return 'st-answered';
|
||||
case 'referral_lame': case 'noglue': return 'st-warn';
|
||||
case 'error': case 'exception':
|
||||
case 'loop': case 'cname_loop': return 'st-err';
|
||||
case 'referral': case 'restart': return 'st-working';
|
||||
default: return 'st-working';
|
||||
}
|
||||
}
|
||||
|
||||
// ── Results rendering ─────────────────────────────────────────────
|
||||
function renderResults(job) {
|
||||
detailDomain.textContent = job.domain || '—';
|
||||
@@ -809,98 +822,137 @@
|
||||
resultsEmpty.classList.add('hidden');
|
||||
|
||||
items.forEach(item => {
|
||||
resultsContainer.appendChild(buildResultItem(item));
|
||||
resultsContainer.appendChild(buildResultBlock(item, job));
|
||||
});
|
||||
|
||||
setStatus('complete', `Traversal complete — ${items.length} step${items.length === 1 ? '' : 's'}`);
|
||||
renderSummary(job.summary);
|
||||
|
||||
setStatus('complete', `Traversal complete — ${items.length} result${items.length === 1 ? '' : 's'}`);
|
||||
updateStats(job);
|
||||
}
|
||||
|
||||
function buildResultItem(item) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'result-item';
|
||||
// pct5 renders "%5.1f%%" like the CLI Results head.
|
||||
function pct5(p) {
|
||||
return (p * 100).toFixed(1).padStart(5) + '%';
|
||||
}
|
||||
|
||||
const header = document.createElement('div');
|
||||
header.className = 'result-header';
|
||||
|
||||
// Depth indent
|
||||
const indent = document.createElement('span');
|
||||
indent.className = 'result-indent';
|
||||
indent.textContent = ' '.repeat(item.depth) + (item.depth > 0 ? '└─ ' : '');
|
||||
|
||||
// Type badge
|
||||
const rtype = (item.response_type || 'unknown').toLowerCase();
|
||||
const badge = document.createElement('span');
|
||||
badge.className = `rtype-badge rtype-${rtypeCls(rtype)}`;
|
||||
badge.textContent = item.response_type || '?';
|
||||
|
||||
// Probability
|
||||
const prob = document.createElement('span');
|
||||
prob.className = 'result-prob';
|
||||
if (typeof item.probability === 'number' && item.probability > 0) {
|
||||
prob.textContent = (item.probability * 100).toFixed(1) + '%';
|
||||
}
|
||||
|
||||
// Server
|
||||
const server = document.createElement('span');
|
||||
server.className = 'result-server';
|
||||
server.textContent = item.server || '';
|
||||
|
||||
header.appendChild(indent);
|
||||
header.appendChild(badge);
|
||||
if (prob.textContent) header.appendChild(prob);
|
||||
if (server.textContent) header.appendChild(server);
|
||||
|
||||
el.appendChild(header);
|
||||
|
||||
// CNAME chain
|
||||
if (item.cname_chain && item.cname_chain.length > 0) {
|
||||
const chain = document.createElement('div');
|
||||
chain.className = 'cname-chain';
|
||||
chain.textContent = 'CNAME → ' + item.cname_chain.join(' → ');
|
||||
el.appendChild(chain);
|
||||
}
|
||||
|
||||
// Answers
|
||||
if (item.answers && item.answers.length > 0) {
|
||||
const ansBox = document.createElement('div');
|
||||
ansBox.className = 'result-answers';
|
||||
item.answers.forEach(a => {
|
||||
const s = document.createElement('span');
|
||||
s.textContent = a;
|
||||
ansBox.appendChild(s);
|
||||
});
|
||||
el.appendChild(ansBox);
|
||||
}
|
||||
// pctTrim renders the Summary Results probability: %5.1f%% with a trailing
|
||||
// ".0" trimmed, right-justified to width 5.
|
||||
function pctTrim(p) {
|
||||
let t = (p * 100).toFixed(1) + '%';
|
||||
t = t.replace('.0%', '%');
|
||||
return t.padStart(5);
|
||||
}
|
||||
|
||||
// buildResultBlock renders one aggregated leaf with the CLI Results wording
|
||||
// as a pre block (leading spaces are significant).
|
||||
function buildResultBlock(item, job) {
|
||||
const el = document.createElement('pre');
|
||||
el.className = 'result-block ' + statusCls(item.status);
|
||||
el.textContent = leafLines(item, job).join('\n');
|
||||
return el;
|
||||
}
|
||||
|
||||
function rtypeCls(rtype) {
|
||||
if (rtype.includes('answer')) return 'answer';
|
||||
if (rtype.includes('referral')) return 'referral';
|
||||
if (rtype.includes('nxdomain')) return 'nxdomain';
|
||||
if (rtype.includes('servfail')) return 'servfail';
|
||||
if (rtype.includes('timeout')) return 'timeout';
|
||||
if (rtype.includes('nodata')) return 'nodata';
|
||||
if (rtype.includes('cname')) return 'cname';
|
||||
return 'other';
|
||||
function leafLines(item, job) {
|
||||
const indent = ' '.repeat(12);
|
||||
const head = pct5(item.probability || 0) + ': ';
|
||||
const where = `${item.server || ''} (${item.ip || ''})`;
|
||||
const lines = [];
|
||||
|
||||
switch (item.status) {
|
||||
case 'answered':
|
||||
lines.push(head + 'Answer from ' + where);
|
||||
(item.answers || []).forEach(a => lines.push(indent + a));
|
||||
break;
|
||||
case 'nodata':
|
||||
lines.push(head + 'NODATA (for this type) at ' + where);
|
||||
break;
|
||||
case 'noglue':
|
||||
lines.push(head + `No glue at ${item.parent || ''} (${item.ip || ''}) for ${item.server || ''}`);
|
||||
break;
|
||||
case 'referral_lame':
|
||||
lines.push(head + `Lame referral from ${item.parent || ''} (${item.parent_ip || ''}) to ${where}`);
|
||||
break;
|
||||
case 'loop':
|
||||
lines.push(head + `Loop encountered at ${item.server || ''}`);
|
||||
break;
|
||||
case 'cname_loop':
|
||||
lines.push(head + `CNAME loop encountered at ${item.server || ''}`);
|
||||
break;
|
||||
case 'error':
|
||||
case 'exception':
|
||||
lines.push(head + `${item.message || item.status} at ${where}`);
|
||||
break;
|
||||
default:
|
||||
lines.push(head + 'Stopped at ' + where);
|
||||
}
|
||||
|
||||
if (item.status !== 'answered' && item.qname) {
|
||||
const orig = (job.domain || '').replace(/\.$/, '').toLowerCase();
|
||||
const qn = item.qname.replace(/\.$/, '').toLowerCase();
|
||||
if (qn !== orig || (item.qtype || '') !== (job.query_type || '')) {
|
||||
lines.push(indent + `While querying ${item.qname}/${item.qclass || 'IN'}/${item.qtype || ''}`);
|
||||
}
|
||||
}
|
||||
return lines;
|
||||
}
|
||||
|
||||
function statusCls(status) {
|
||||
switch (status) {
|
||||
case 'answered': return 'st-answered';
|
||||
case 'referral_lame': case 'noglue': return 'st-warn';
|
||||
case 'error': case 'exception':
|
||||
case 'loop': case 'cname_loop': return 'st-err';
|
||||
default: return 'st-other';
|
||||
}
|
||||
}
|
||||
|
||||
// ── Summary Results rendering (CLI Summary Results wording) ───────
|
||||
function renderSummary(summary) {
|
||||
if (!summary) { summaryPre.textContent = ''; return; }
|
||||
const lines = [];
|
||||
(summary.answers || []).forEach(a => {
|
||||
const initial = pctTrim(a.probability) + ' answered with ';
|
||||
const recs = a.records || [];
|
||||
if (recs.length === 0) {
|
||||
lines.push(initial.trimEnd());
|
||||
return;
|
||||
}
|
||||
lines.push(initial + recs[0]);
|
||||
for (let i = 1; i < recs.length; i++) {
|
||||
lines.push(' '.repeat(initial.length) + recs[i]);
|
||||
}
|
||||
});
|
||||
(summary.by_status || []).forEach(s => {
|
||||
lines.push(pctTrim(s.probability) + ' ' + summaryStatusLabel(s.status));
|
||||
});
|
||||
summaryPre.textContent = lines.join('\n');
|
||||
}
|
||||
|
||||
function summaryStatusLabel(status) {
|
||||
switch (status) {
|
||||
case 'nodata': return 'found no such record';
|
||||
case 'referral_lame': return 'resulted in a lame referral';
|
||||
case 'exception': return 'resulted in an exception';
|
||||
case 'error': return 'resulted in an error';
|
||||
case 'noglue': return 'found no glue';
|
||||
case 'loop': return 'resulted in a loop';
|
||||
case 'cname_loop': return 'resulted in a CNAME loop';
|
||||
default: return status;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Stats ─────────────────────────────────────────────────────────
|
||||
function updateStats(job) {
|
||||
const items = job.results || [];
|
||||
const steps = items.length;
|
||||
const answers = items.filter(r => (r.response_type||'').toLowerCase().includes('answer')).length;
|
||||
const errors = items.filter(r => {
|
||||
const t = (r.response_type||'').toLowerCase();
|
||||
return t.includes('error') || t.includes('servfail') || t.includes('timeout') || t.includes('nxdomain');
|
||||
}).length;
|
||||
const answers = items.filter(r => r.status === 'answered').length;
|
||||
const errors = items.filter(r => statusCls(r.status) === 'st-err').length;
|
||||
const maxDepth = items.reduce((m, r) => Math.max(m, r.depth || 0), 0);
|
||||
|
||||
const statusCls = job.status === 'complete' ? 'ok' : job.status === 'error' ? 'err' : '';
|
||||
const jobStateCls = job.status === 'complete' ? 'ok' : job.status === 'error' ? 'err' : '';
|
||||
statStatus.textContent = job.status || '—';
|
||||
statStatus.className = `stat-value ${statusCls}`;
|
||||
statStatus.className = `stat-value ${jobStateCls}`;
|
||||
statSteps.textContent = steps || '—';
|
||||
statAnswers.textContent = answers || '—';
|
||||
statErrors.className = `stat-value ${errors > 0 ? 'warn' : ''}`;
|
||||
@@ -919,7 +971,9 @@
|
||||
errorBox.textContent = '';
|
||||
progressFeed.innerHTML = '';
|
||||
progressItems = [];
|
||||
progressRows = new Map();
|
||||
progressCount.textContent = '0';
|
||||
summaryPre.textContent = '';
|
||||
resultItems = [];
|
||||
resultsCount.textContent = '0';
|
||||
// Remove old result items but keep resultsEmpty
|
||||
|
||||
Reference in New Issue
Block a user