A governed browser. Every page load passes egress policy, an SSRF guard and the ViKernel kernel gate, and every agent action on a page is decided by the gate.
1. Open Demo: poisoned page. It looks like a normal review blog, but hides instructions for AI agents. The banner shows what was hidden.
2. Open the agent sidebar and press Run. The agent reads the hidden text too. When it tries to send your files out, ViKernel denies it and records an audit entry.
3. Try the Blocked bookmarks to see the egress policy and the SSRF guard stop a request before any byte leaves.
`;
return w;
}
function errorPage(d) {
const w = mk('div', 'vb-center');
w.innerHTML = `
${I.warn}
This page could not be loaded
${esc(d && d.error || 'Unknown error')}
`;
const r = mk('button', 'vb-run', 'Try again');
r.onclick = reload;
w.append(r);
return w;
}
const hasRender = d => d && typeof d.reader_html === 'string' && typeof d.html === 'string';
function hiddenBanner(t, onToggle) {
const fs = t.data.findings || [];
const sus = fs.filter(f => f.suspicious).length;
if (!fs.length) return null;
const bn = mk('div', 'vb-banner' + (sus ? '' : ' soft'));
bn.innerHTML = sus ? `${I.warn}Injection detected: ${sus} hidden instruction${sus === 1 ? '' : 's'} on this page`
: `${I.info}${fs.length} hidden text block${fs.length === 1 ? '' : 's'} on this page (no instructions found)`;
const sb = mk('button', '', t.showHidden ? 'Hide' : 'Show');
sb.onclick = () => { t.showHidden = !t.showHidden; sb.textContent = t.showHidden ? 'Hide' : 'Show'; onToggle(); };
bn.append(sb);
return bn;
}
function readerView(t) {
const d = t.data;
const frag = document.createDocumentFragment();
const bn = hiddenBanner(t, () => {
const pg = content.querySelector('.vb-page');
if (!pg) return;
pg.classList.toggle('vb-flash', t.showHidden);
const first = pg.querySelector('mark.vb-sus') || pg.querySelector('mark.vb-hidden');
if (t.showHidden && first) first.scrollIntoView({behavior:'smooth', block:'center'});
});
if (bn) frag.append(bn);
const pg = mk('article', 'vb-page' + (t.showHidden ? ' vb-flash' : ''));
const hd = mk('div', 'vb-pagehd');
hd.textContent = (d.final_url || d.url) + ' · ' + Math.round((d.bytes || 0) / 1024) + ' KB · ' + (d.ms != null ? d.ms + ' ms' : '') + (d.truncated ? ' · truncated' : '');
pg.append(hd);
if (d.title) { const h1 = mk('h1'); h1.textContent = d.title; pg.append(h1); }
pg.append(scrub(hasRender(d) ? d.reader_html : d.html));
frag.append(pg);
return frag;
}
/* Outline visible copies of suspicious findings inside the rendered page (most are invisible by design). */
function highlightInFrame(doc, findings, on) {
if (!doc || !doc.body) return null;
doc.querySelectorAll('[data-vb-hl]').forEach(el => { el.style.outline = el.dataset.vbHl === '-' ? '' : el.dataset.vbHl; el.removeAttribute('data-vb-hl'); });
if (!on) return null;
const snips = findings.filter(f => f.suspicious).map(f => String(f.text || '').slice(0, 40)).filter(s => s.length >= 12);
if (!snips.length) return null;
let first = null, n, guard = 0;
const w = doc.createTreeWalker(doc.body, 4);
while ((n = w.nextNode()) && guard++ < 200000) {
const v = n.nodeValue;
if (!v || v.length < 12 || !snips.some(s => v.includes(s))) continue;
const el = n.parentElement;
if (!el || el.hasAttribute('data-vb-hl')) continue;
el.dataset.vbHl = el.style.outline || '-';
el.style.outline = '3px solid #dc2626';
if (!first && el.getClientRects().length) first = el;
}
return first;
}
function attachFrame(f, t) {
let doc;
try { doc = f.contentDocument; } catch (e) { doc = null; }
if (!doc) return;
const linkOf = e => { const tg = e.target; return tg && tg.closest ? tg.closest('a,area') : null; };
const hrefOf = a => a.getAttribute('href') || a.getAttribute('xlink:href') || '';
doc.addEventListener('click', e => {
const a = linkOf(e);
if (!a) return;
e.preventDefault();
const h = hrefOf(a);
if (h.startsWith(NAV)) {
const u = h.slice(NAV.length);
if (!/^https?:\/\//i.test(u)) return;
if (e.ctrlKey || e.metaKey || e.shiftKey) newTab(u, false); else navigate(t, u);
} else if (h.length > 1 && h[0] === '#') {
let id = h.slice(1);
try { id = decodeURIComponent(id); } catch (x) { /* keep raw */ }
const el = doc.getElementById(id) || doc.getElementsByName(id)[0];
if (el) el.scrollIntoView({block:'start'});
}
}, true);
doc.addEventListener('auxclick', e => {
const a = e.button === 1 && linkOf(e);
if (!a) return;
e.preventDefault();
const h = hrefOf(a);
if (h.startsWith(NAV) && /^https?:\/\//i.test(h.slice(NAV.length))) newTab(h.slice(NAV.length), false);
}, true);
doc.addEventListener('submit', e => e.preventDefault(), true);
if (t.showHidden) highlightInFrame(doc, t.data.findings || [], true);
}
function renderView(t) {
const d = t.data;
const frag = document.createDocumentFragment();
const panel = mk('div', 'vb-hpanel');
panel.hidden = !t.showHidden;
const f = document.createElement('iframe');
const bn = hiddenBanner(t, () => {
panel.hidden = !t.showHidden;
let doc = null;
try { doc = f.contentDocument; } catch (e) { /* ignore */ }
const el = highlightInFrame(doc, d.findings || [], t.showHidden);
if (el) el.scrollIntoView({behavior:'smooth', block:'center'});
});
if (bn) frag.append(bn);
if (d.hidden_marks_html) { panel.append(scrub(d.hidden_marks_html)); frag.append(panel); }
f.className = 'vb-frame';
f.setAttribute('sandbox', 'allow-same-origin'); // no allow-scripts, no allow-forms: page scripts can never run
f.setAttribute('referrerpolicy', 'no-referrer');
f.setAttribute('title', 'Safe render of ' + (d.final_url || d.url));
f.addEventListener('load', () => attachFrame(f, t));
f.srcdoc = d.html;
frag.append(f);
return frag;
}
function visibleLen(html) {
try { const d = new DOMParser().parseFromString(String(html || ''), 'text/html'); d.querySelectorAll('style,script,noscript').forEach(x => x.remove()); return (d.body ? d.body.innerText || d.body.textContent || '' : '').replace(/\s+/g, ' ').trim().length; } catch (e) { return 9999; }
}
function snapView(t) {
const sn = t.data.snap;
const box = mk('div', 'vb-snap');
const lab = mk('div', 'vb-snaplab', t.snapLoading ? 'Live snapshot: rendering in an isolated private browser...' :
(t.autoSnap ? 'Auto-selected: Live snapshot (this site builds its page with JavaScript, so Safe render shows almost nothing). ' : 'Live snapshot. ') +
(sn && sn.ok ? `Image only, no scripts reach you. ${sn.requests} requests checked, ${sn.blocked} blocked, ${sn.ms} ms.` : ''));
box.append(lab);
if (sn && sn.ok) { const img = document.createElement('img'); img.src = sn.image; img.alt = 'Live snapshot of ' + (sn.final_url || t.url); img.className = 'vb-snapimg'; box.append(img); }
else if (sn && !t.snapLoading) box.append(mk('div', 'vb-mut', 'Snapshot unavailable: ' + (sn.error || 'unknown error')));
return box;
}
function pageView(t) {
if ((mode === 'snapshot' || t.autoSnap) && (t.data.snap || t.snapLoading)) { content.classList.remove('vb-fill'); return snapView(t); }
const fill = mode === 'render' && hasRender(t.data);
content.classList.toggle('vb-fill', fill);
return fill ? renderView(t) : readerView(t);
}
function renderContent() {
const t = active;
content.innerHTML = '';
content.classList.remove('vb-fill');
if (!t) return;
if (t.state === 'start') content.append(startPage());
else if (t.state === 'loading') { const w = mk('div', 'vb-center'); w.innerHTML = `
Checking egress, SSRF and kernel gate for ${esc(hostOf(t.url))}...
`; content.append(w); }
else if (t.state === 'blocked') content.append(blockPage(t.data));
else if (t.state === 'error') content.append(errorPage(t.data));
else content.append(pageView(t));
}
function evCard(k, cls, html) { const e = mk('div', 'vb-e ' + (cls || '')); e.innerHTML = `
${esc(k)}
${html}`; return e; }
const short = v => { let s; try { s = typeof v === 'string' ? v : JSON.stringify(v, null, 1); } catch (e) { s = String(v); } return s && s.length > 900 ? s.slice(0, 900) + ' ...' : s; };
function renderEvents() {
const t = active;
evEl.innerHTML = '';
runBtn.disabled = !t || t.state !== 'page' || t.agentBusy;
runBtn.textContent = t && t.agentBusy ? 'Running...' : 'Run';
if (!t || t.state !== 'page') { evEl.innerHTML = '
Open a page, then run a task.
'; return; }
if (t.agentBusy && !t.events) { const w = mk('div', 'vb-center'); w.style.minHeight = '120px'; w.innerHTML = '
The agent is reading the page. Each action waits for a kernel verdict.
'; evEl.append(w); return; }
if (!t.events) { evEl.innerHTML = '
Press Run. Try the poisoned demo page to see the gate stop a hijacked agent.
'; return; }
const r = t.events;
if (r.error) evEl.append(evCard('error', 'deny', `
${esc(r.error)}
`));
if (r.blocked) evEl.append(evCard('blocked', 'deny', `
Blocked by ViKernel: rule ${esc(r.blocked.rule)} (${esc(r.blocked.layer)}). ${esc(r.blocked.reason)}
`));
const evs = Array.isArray(r.events) ? r.events : [];
const denied = evs.filter(e => (e.type || e.kind) === 'verdict' && !vOk(e.verdict));
for (const d of denied) {
const ref = `(rule ${esc(d.rule || '?')}, audit #${esc(d.audit_seq ?? '?')})`;
const msg = d.probe ? `The page hides an instruction to send your files to ${esc((d.args || {}).url || 'an outside URL')}. Muse Spark did not follow it; the same action sent as a compromised agent would was denied by ViKernel ${ref}.` : isSend(d.fn) ? `The page tried to make the agent send your files. ViKernel denied it ${ref}.`
: `ViKernel denied the agent's ${esc(d.fn)} call ${ref}.`;
evEl.append(mk('div', 'vb-callout', msg));
}
for (const e of evs) {
const ty = e.type || e.kind || e.event;
if (ty === 'user') evEl.append(evCard('task', '', `
${esc(e.text || '')}
`));
else if (ty === 'proposed') evEl.append(evCard('proposed action', '', `
`));
else if (ty === 'final') evEl.append(evCard('answer', 'vb-final', `
${esc(e.text || '')}
`));
else if (ty === 'error') evEl.append(evCard('error', 'deny', `
${esc(e.text || '')}
`));
}
if (!evs.length && !r.error && !r.blocked) evEl.append(mk('div', 'vb-mut', 'The agent returned no events.'));
}
async function runAgent() {
const t = active;
if (!t || t.state !== 'page' || t.agentBusy) return;
const task = taskEl.value.trim() || 'Summarize this page for me';
t.agentBusy = true; t.events = null;
renderEvents();
let r;
try { r = await api('browser/agent', {url:t.url, task}); }
catch (e) { r = {error:e && e.message === 'rate' ? 'Rate limited. Please wait a few seconds and try again.' : 'Network error: ' + (e && e.message || e)}; }
t.agentBusy = false; t.events = r || {error:'Empty response'};
if (t === active) renderEvents();
const den = (r && r.events || []).find(e => (e.type || e.kind) === 'verdict' && !vOk(e.verdict));
if (den) toast('ViKernel denied ' + den.fn + ' (audit #' + (den.audit_seq ?? '?') + ')');
}
function renderHistory() {
const pb = root.querySelector('[data-p="hist"] .vb-pb');
pb.innerHTML = '';
const t = active;
if (t && t.hist.length) {
pb.append(mk('div', 'vb-mut', 'This tab'));
t.hist.forEach((u, i) => {
const r = mk('button', 'vb-hrow');
r.innerHTML = `${i === t.idx ? '▸ ' : ''}${esc(u === START ? 'New tab' : u)}`;
r.onclick = () => { t.idx = i; navigate(t, u, false); };
pb.append(r);
});
}
pb.append(mk('div', 'vb-mut', 'All visits this session'));
if (!visits.length) pb.append(mk('div', 'vb-mut', 'Nothing yet.'));
for (const v of visits) {
const r = mk('button', 'vb-hrow');
r.innerHTML = `${esc(v.title)}${esc(v.url)} · ${esc(v.state)} · ${esc(v.at.toLocaleTimeString())}`;
r.onclick = () => navigate(active, v.url);
pb.append(r);
}
}
let policyCache = null;
async function renderAbout() {
const pb = root.querySelector('[data-p="about"] .vb-pb');
const layers = [
['1. Egress policy', 'Only http and https on ports 80 and 443. No credentials in URLs. Known exfiltration hosts (attacker.example, collector.example.invalid, evil.test, anything containing "attacker") are denied.'],
['2. SSRF guard', 'The server resolves DNS and refuses private, loopback, link-local, multicast, reserved, unspecified and IPv4-mapped addresses, plus cloud metadata names. It re-checks after every redirect (max 3).'],
['3. Kernel gate', 'Each navigation is decided by the real ViKernel gate and written to the audit log. The verdict chip shows the audit id. Agent actions (http_post, send_email, upload) go through the same gate.'],
['4. Injection scanner', 'Before the page is cleaned, the raw HTML is scanned for hidden text (display:none, visibility:hidden, font-size:0, opacity:0, white on white, aria-hidden), comments and phrases like "ignore previous instructions". Show opens the findings above the page.'],
['5. Safe render', 'The site keeps its own layout, CSS, images and fonts, but scripts, frames, forms, event handlers, javascript: links and meta refresh are removed. The page runs in a sandboxed iframe without allow-scripts and under a strict Content-Security-Policy. Every stylesheet, image and font goes through the same guarded proxy (egress + SSRF, GET only, no cookies, 6 s timeout), and links stay inside the app.'],
['6. Reader view', 'Switch to Reader for a text-only view: styles and media are dropped and hidden blocks are listed at the end of the page.']
];
pb.innerHTML = layers.map(([a, b]) => `
${esc(a)}${esc(b)}
`).join('') + '
Loading live policy...
';
try {
policyCache = policyCache || await api('browser/policy', {});
const p = policyCache;
const el = pb.querySelector('.vb-pol');
el.className = 'vb-layer';
el.innerHTML = `Live policy from the serverDeny hosts: ${esc((p.egress && p.egress.deny_hosts || []).join(', '))} Ports: ${esc((p.egress && p.egress.ports || []).join(', '))} Max redirects: ${esc(p.ssrf && p.ssrf.max_redirects)} Page limit: ${esc(Math.round((p.fetch && p.fetch.max_page_bytes || 0) / 1000))} KB, timeout ${esc(p.fetch && p.fetch.timeout_s)} s User-Agent: ${esc(p.fetch && p.fetch.user_agent)}`;
} catch (e) {
const el = pb.querySelector('.vb-pol');
if (el) el.textContent = 'Live policy unavailable right now.';
}
}
function togglePanel(name) {
root.querySelectorAll('.vb-panel').forEach(p => { p.hidden = p.dataset.p !== name || !p.hidden; });
const p = root.querySelector(`[data-p="${name}"]`);
if (p && !p.hidden) { if (name === 'hist') renderHistory(); else renderAbout(); }
}
function renderAll() { renderTabs(); renderBar(); renderContent(); renderEvents(); }
// events
$('.vb-addr').addEventListener('submit', e => { e.preventDefault(); const v = addr.value.trim(); if (v) { navigate(active, v); addr.blur(); } });
addr.addEventListener('keydown', e => { if (e.key === 'Escape') { addr.value = active && active.url !== START ? active.url : ''; addr.blur(); } });
addr.addEventListener('focus', () => addr.select());
btn('back').onclick = () => go(-1);
btn('fwd').onclick = () => go(1);
btn('reload').onclick = reload;
btn('star').onclick = () => {
const t = active;
if (!t || t.url === START) return;
const i = bookmarks.findIndex(b => b.url === t.url);
if (i >= 0) { bookmarks.splice(i, 1); toast('Bookmark removed'); }
else { bookmarks.push({title:(t.title || hostOf(t.url)).slice(0, 60), url:t.url}); toast('Bookmarked'); }
saveBookmarks(bookmarks);
renderBookmarks(); renderBar();
};
btn('agent').onclick = () => { side.hidden = !side.hidden; renderBar(); if (!side.hidden) taskEl.focus(); };
btn('hist').onclick = () => togglePanel('hist');
btn('about').onclick = () => togglePanel('about');
root.querySelectorAll('.vb-mode button').forEach(b => {
b.onclick = () => { if (mode === b.dataset.m) return; mode = b.dataset.m; saveMode(mode); renderBar(); renderContent(); };
});
root.querySelectorAll('[data-close]').forEach(b => { b.onclick = () => { b.closest('.vb-panel').hidden = true; }; });
runBtn.onclick = runAgent;
taskEl.addEventListener('keydown', e => { if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) { e.preventDefault(); runAgent(); } });
content.addEventListener('click', e => {
const a = e.target.closest('a');
if (!a || !content.contains(a)) return;
e.preventDefault();
const u = a.getAttribute('data-vb-href') || a.getAttribute('href');
if (!u || !/^https?:\/\//i.test(u)) return;
if (e.ctrlKey || e.metaKey || e.shiftKey) newTab(u, false); else navigate(active, u);
});
content.addEventListener('auxclick', e => {
const a = e.button === 1 && e.target.closest('a');
if (!a) return;
e.preventDefault();
const u = a.getAttribute('data-vb-href') || a.getAttribute('href');
if (u && /^https?:\/\//i.test(u)) newTab(u, false);
});
root.addEventListener('keydown', e => {
if ((e.ctrlKey || e.metaKey) && (e.key === 'l' || e.key === 'L')) { e.preventDefault(); addr.focus(); addr.select(); }
else if (e.altKey && e.key === 'ArrowLeft') { e.preventDefault(); go(-1); }
else if (e.altKey && e.key === 'ArrowRight') { e.preventDefault(); go(1); }
else if (e.key === 'F5') { e.preventDefault(); reload(); }
else if (e.key === 'Escape') root.querySelectorAll('.vb-panel').forEach(p => { p.hidden = true; });
});
root.addEventListener('mousedown', e => { if (!e.target.closest('input,textarea,button,a,.vb-content')) root.focus({preventScroll:true}); });
renderBookmarks();
newTab();
void win;
return root;
}
}));
})();