@pasko70/pibo 1.9.8 → 1.9.9

package/dist/debug/web-snapshot-browser-scripts.js

@@ -1,303 +0,0 @@
-export function buildSnapshotExpression(options) {
-    return `(() => {
-  const options = ${JSON.stringify(options)};
-  ${browserSnapshotLibrary()}
-  return captureSnapshot(options);
-})()`;
-}
-export function buildWatchExpression(options) {
-    return `(async () => {
-  const options = ${JSON.stringify(options)};
-  ${browserSnapshotLibrary()}
-  return await runWatch(options);
-})()`;
-}
-function browserSnapshotLibrary() {
-    return String.raw `
-function nowIso() { return new Date().toISOString(); }
-function safeString(value) { return typeof value === 'string' ? value : ''; }
-function short(value, limit) {
-  const text = safeString(value).replace(/\s+/g, ' ').trim();
-  return text.length > limit ? text.slice(0, Math.max(0, limit - 1)) + '…' : text;
-}
-function redactText(element, options) {
-  const tag = element.tagName.toLowerCase();
-  const debug = element.getAttribute('data-pibo-debug') || '';
-  if (tag === 'textarea' || tag === 'input' || debug === 'composer') {
-    const value = 'value' in element ? String(element.value || '') : '';
-    return value ? '[redacted:' + value.length + ' chars]' : '';
-  }
-  const text = element.innerText || element.textContent || '';
-  if (!options.includeText && /message|trace|terminal|composer/i.test(debug)) return text ? '[redacted]' : '';
-  return short(text, options.textLimit);
-}
-function classSummary(element) {
-  const value = safeString(element.getAttribute('class'));
-  if (!value) return undefined;
-  const parts = value.split(/\s+/).filter(Boolean);
-  const useful = parts.filter((part) => /selected|active|hidden|opacity|translate|animate|border|bg-|text-|ring|disabled|pointer|sr-only/.test(part));
-  return (useful.length ? useful : parts.slice(0, 6)).slice(0, 10).join(' ');
-}
-function attrMap(element) {
-  const attrs = {};
-  const allow = /^(id|role|aria-|data-pibo-|data-testid$|disabled$|checked$|selected$|hidden$|tabindex$|title$)/;
-  for (const attr of Array.from(element.attributes || [])) {
-    if (!allow.test(attr.name)) continue;
-    if (/token|cookie|authorization|secret|password/i.test(attr.name)) {
-      attrs[attr.name] = '[redacted]';
-    } else {
-      attrs[attr.name] = short(attr.value, 120);
-    }
-  }
-  if (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement) {
-    attrs.value = element.value ? '[redacted:' + element.value.length + ' chars]' : '';
-    attrs.disabled = Boolean(element.disabled);
-  }
-  return attrs;
-}
-function roleOf(element) {
-  const explicit = element.getAttribute('role');
-  if (explicit) return explicit;
-  const tag = element.tagName.toLowerCase();
-  if (tag === 'button') return 'button';
-  if (tag === 'a') return 'link';
-  if (tag === 'textarea') return 'textbox';
-  if (tag === 'input') return 'input';
-  if (tag === 'select') return 'combobox';
-  if (tag === 'main') return 'main';
-  if (tag === 'aside') return 'complementary';
-  if (tag === 'nav') return 'navigation';
-  return undefined;
-}
-function nameOf(element, options) {
-  const aria = element.getAttribute('aria-label');
-  if (aria) return short(aria, options.textLimit);
-  const title = element.getAttribute('title');
-  if (title) return short(title, options.textLimit);
-  const tag = element.tagName.toLowerCase();
-  if (tag === 'input' || tag === 'textarea') return short(element.getAttribute('placeholder') || '', options.textLimit);
-  const debug = element.getAttribute('data-pibo-debug');
-  if (debug === 'session-row') return short(element.getAttribute('data-pibo-title') || element.innerText || '', options.textLimit);
-  return undefined;
-}
-function elementPath(element) {
-  const parts = [];
-  let current = element;
-  while (current && current.nodeType === Node.ELEMENT_NODE && current !== document.documentElement) {
-    const tag = current.tagName.toLowerCase();
-    const parent = current.parentElement;
-    if (!parent) {
-      parts.unshift(tag);
-      break;
-    }
-    const index = Array.from(parent.children).filter((child) => child.tagName === current.tagName).indexOf(current) + 1;
-    parts.unshift(tag + ':nth-of-type(' + index + ')');
-    current = parent;
-  }
-  return parts.join('>');
-}
-function identityOf(element) {
-  const debug = element.getAttribute('data-pibo-debug');
-  const session = element.getAttribute('data-pibo-session-id');
-  const room = element.getAttribute('data-pibo-room-id');
-  const view = element.getAttribute('data-pibo-view-id');
-  const testId = element.getAttribute('data-testid');
-  const id = element.id;
-  if (debug && session) return { identity: debug + ':' + session, kind: 'pibo-session' };
-  if (debug && room) return { identity: debug + ':' + room, kind: 'pibo-room' };
-  if (debug && view) return { identity: debug + ':' + view, kind: 'pibo-view' };
-  if (debug) return { identity: debug, kind: 'pibo-debug' };
-  if (testId) return { identity: 'testid:' + testId, kind: 'testid' };
-  if (id) return { identity: 'id:' + id, kind: 'id' };
-  const role = roleOf(element);
-  const name = nameOf(element, { textLimit: 40 }) || '';
-  if (role && name) return { identity: role + ':' + name, kind: 'role-name' };
-  return { identity: 'path:' + elementPath(element), kind: 'path' };
-}
-function boxOf(element) {
-  const rect = element.getBoundingClientRect();
-  return { x: Math.round(rect.x), y: Math.round(rect.y), w: Math.round(rect.width), h: Math.round(rect.height) };
-}
-function isImportantElement(element, depth) {
-  if (!(element instanceof Element)) return false;
-  const tag = element.tagName.toLowerCase();
-  if (depth === 0) return true;
-  if (['script', 'style', 'svg', 'path', 'rect', 'circle', 'line', 'polyline', 'polygon'].includes(tag)) return false;
-  if (element.hasAttribute('data-pibo-debug') || element.hasAttribute('data-pibo-session-id') || element.hasAttribute('data-testid')) return true;
-  if (element.hasAttribute('aria-label') || element.hasAttribute('title') || element.hasAttribute('role')) return true;
-  if (['button', 'a', 'input', 'textarea', 'select', 'option', 'main', 'aside', 'nav'].includes(tag)) return true;
-  if (element === document.activeElement) return true;
-  if (element.getAttribute('aria-selected') === 'true' || element.getAttribute('data-pibo-selected') === 'true' || element.hasAttribute('hidden')) return true;
-  const text = (element.innerText || element.textContent || '').replace(/\s+/g, ' ').trim();
-  if (text && element.children.length === 0 && depth <= 4) return true;
-  return false;
-}
-function summarizeElement(element, depth, ref, options) {
-  const ident = identityOf(element);
-  const node = {
-    ref,
-    identity: ident.identity,
-    identityKind: ident.kind,
-    depth,
-    tag: element.tagName.toLowerCase(),
-    attributes: attrMap(element),
-    path: elementPath(element),
-  };
-  const role = roleOf(element); if (role) node.role = role;
-  const name = nameOf(element, options); if (name) node.name = name;
-  const text = redactText(element, options); if (text) node.text = text;
-  const classes = classSummary(element); if (classes) node.classSummary = classes;
-  if (document.activeElement === element) node.focused = true;
-  if (options.includeLayout) node.box = boxOf(element);
-  return node;
-}
-function captureSnapshot(options) {
-  const root = document.querySelector(options.scope);
-  const nodes = [];
-  const omitted = { nodes: 0, depth: 0, budget: false };
-  let refSeq = 0;
-  function walk(element, depth) {
-    if (!(element instanceof Element)) return;
-    if (depth > options.maxDepth) { omitted.depth += 1; return; }
-    if (isImportantElement(element, depth)) {
-      if (nodes.length >= options.maxNodes) { omitted.nodes += 1; omitted.budget = true; return; }
-      const node = summarizeElement(element, depth, '@n' + (++refSeq), options);
-      nodes.push(node);
-    }
-    for (const child of Array.from(element.children)) walk(child, depth + 1);
-  }
-  if (root) walk(root, 0);
-  const active = document.activeElement instanceof Element ? summarizeElement(document.activeElement, 0, '@focus', options) : undefined;
-  return {
-    kind: 'snapshot',
-    createdAt: nowIso(),
-    url: location.href,
-    title: document.title || '',
-    scope: options.scope,
-    rootFound: Boolean(root),
-    root: nodes[0],
-    activeElement: active ? { identity: active.identity, tag: active.tag, name: active.name, path: active.path } : undefined,
-    nodes,
-    omitted,
-  };
-}
-function mutationTarget(mutation, options) {
-  const target = mutation.target instanceof Element ? mutation.target : mutation.target.parentElement;
-  return target ? summarizeElement(target, 0, '@target', options) : undefined;
-}
-function pushEvent(events, omitted, maxEvents, event) {
-  if (events.length >= maxEvents) { omitted.events += 1; return; }
-  events.push(event);
-}
-function findNewSessionButton() {
-  const candidates = Array.from(document.querySelectorAll('button'));
-  return candidates.find((button) => {
-    const label = [button.getAttribute('aria-label'), button.getAttribute('title'), button.textContent].filter(Boolean).join(' ');
-    return /New Session/i.test(label);
-  });
-}
-async function runWatch(options) {
-  const root = document.querySelector(options.scope);
-  const events = [];
-  const omitted = { events: 0, nodes: 0, depth: 0, budget: false };
-  const start = performance.now();
-  const at = () => Math.max(0, Math.round(performance.now() - start));
-  const originalPushState = history.pushState;
-  const originalReplaceState = history.replaceState;
-  let action = undefined;
-  const routeEvent = (kind, beforeUrl, afterUrl) => {
-    if (beforeUrl !== afterUrl) pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'route', kind, before: beforeUrl, after: afterUrl });
-  };
-  history.pushState = function(...args) {
-    const beforeUrl = location.href;
-    const result = originalPushState.apply(this, args);
-    routeEvent('pushState', beforeUrl, location.href);
-    return result;
-  };
-  history.replaceState = function(...args) {
-    const beforeUrl = location.href;
-    const result = originalReplaceState.apply(this, args);
-    routeEvent('replaceState', beforeUrl, location.href);
-    return result;
-  };
-  const onPopState = () => pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'route', kind: 'popstate', after: location.href });
-  const onFocusIn = (event) => {
-    if (!(event.target instanceof Element)) return;
-    if (root && !root.contains(event.target)) return;
-    const node = summarizeElement(event.target, 0, '@focus', options);
-    pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'focus', kind: 'focusin', target: node.identity, node });
-  };
-  const observer = root ? new MutationObserver((mutations) => {
-    for (const mutation of mutations) {
-      if (mutation.type === 'childList') {
-        for (const added of Array.from(mutation.addedNodes)) {
-          if (!(added instanceof Element)) continue;
-          const node = summarizeElement(added, 0, '@added', options);
-          pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'dom', kind: 'added', target: node.identity, node });
-        }
-        for (const removed of Array.from(mutation.removedNodes)) {
-          if (!(removed instanceof Element)) continue;
-          const node = summarizeElement(removed, 0, '@removed', options);
-          pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'dom', kind: 'removed', target: node.identity, node });
-        }
-      } else if (mutation.type === 'attributes') {
-        const node = mutationTarget(mutation, options);
-        if (!node) continue;
-        const name = mutation.attributeName || 'attribute';
-        const after = mutation.target instanceof Element ? mutation.target.getAttribute(name) : undefined;
-        pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'dom', kind: 'attr', target: node.identity, detail: name, before: mutation.oldValue || '', after: after || '', node });
-      } else if (mutation.type === 'characterData') {
-        const node = mutationTarget(mutation, options);
-        pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'dom', kind: 'text', target: node ? node.identity : undefined, before: short(mutation.oldValue || '', options.textLimit), after: short(mutation.target.textContent || '', options.textLimit), node });
-      }
-    }
-  }) : undefined;
-  if (observer && root) observer.observe(root, { childList: true, subtree: true, attributes: true, attributeOldValue: true, characterData: true, characterDataOldValue: true, attributeFilter: ['class', 'style', 'hidden', 'aria-selected', 'aria-expanded', 'data-pibo-selected', 'data-pibo-session-id', 'data-pibo-selected-session-id', 'data-pibo-state', 'data-pibo-debug'] });
-  document.addEventListener('focusin', onFocusIn, true);
-  window.addEventListener('popstate', onPopState, true);
-  const before = captureSnapshot(options);
-  omitted.nodes += before.omitted.nodes;
-  omitted.depth += before.omitted.depth;
-  omitted.budget = omitted.budget || before.omitted.budget;
-  if (options.action === 'new-session') {
-    try {
-      const button = findNewSessionButton();
-      action = { requested: 'new-session', performed: Boolean(button) };
-      if (button) {
-        const node = summarizeElement(button, 0, '@action', options);
-        pushEvent(events, omitted, options.maxEvents, { t: at(), source: 'action', kind: 'click', target: node.identity, detail: 'New Session', node });
-        button.click();
-      } else {
-        action.error = 'New Session button not found';
-      }
-    } catch (error) {
-      action = { requested: 'new-session', performed: false, error: String(error && error.message ? error.message : error) };
-    }
-  }
-  await new Promise((resolve) => setTimeout(resolve, options.durationMs));
-  observer?.disconnect();
-  document.removeEventListener('focusin', onFocusIn, true);
-  window.removeEventListener('popstate', onPopState, true);
-  history.pushState = originalPushState;
-  history.replaceState = originalReplaceState;
-  const after = captureSnapshot(options);
-  omitted.nodes += after.omitted.nodes;
-  omitted.depth += after.omitted.depth;
-  omitted.budget = omitted.budget || after.omitted.budget || omitted.events > 0;
-  return {
-    kind: 'watch',
-    createdAt: nowIso(),
-    url: location.href,
-    title: document.title || '',
-    scope: options.scope,
-    durationMs: options.durationMs,
-    rootFound: Boolean(before.rootFound || after.rootFound),
-    events,
-    before,
-    after,
-    omitted,
-    action,
-  };
-}
-`;
-}