NoeVault Snip Quick Start

NoeVault Snip Quick Start

NoeVault Snip Quick Start

NoeVault Snip Quick Start

Audience: Application developers embedding NoeVault Snip
Package: @noevault/snap 1.1.3
Reference host: KitchenPro.Web
Contract: snap-integration.v1

What you get

NoeVault Snip lets authenticated users of your application report issues with optional screenshot evidence, track My Requests, and continue conversation — without logging into the NoeVault Panel and without becoming NoeVault seat users.

Your app (authenticated session)
        │
        ▼
Trusted bootstrap BFF  ──AppKey stays server-side──►  NoeVault API
        │
        ▼
@noevault/snap (browser)  →  SupportTicket SoR

Prerequisites

Requirement Notes
Organisation + Solution in NoeVault Controlled consumer solution (see Organisation Onboarding)
Snap commercial product support_snap entitled for the organisation
Runtime capability support.snap (and published grains such as support.snap.report)
Trusted host bootstrap Server endpoint that returns browser-safe bootstrap (never expose AppKey)
Categories Effective categories available to the solution (inheritance)

Minimal host pattern (KitchenPro-shaped)

  1. Serve UMD + CSS from your static assets (or CDN of your build):
<link rel="stylesheet" href="/lib/noevault-snap/noevault-snap.css" asp-append-version="true" />
<script src="/lib/noevault-snap/noevault-snap.umd.js" asp-append-version="true"></script>
<script src="/js/your-app-snap.js" asp-append-version="true"></script>
  1. Expose a same-origin bootstrap BFF that requires your app session:
GET /noevault/snap/bootstrap
Cookie: <your app auth>
→ 200 application/json  (SnapBrowserBootstrap)
→ 401 SNAP_APP_SESSION_REQUIRED when anonymous
  1. Initialize the SDK only after bootstrap succeeds:
// Browser — AppKey never appears here
const bootstrap = await fetch('/noevault/snap/bootstrap', {
  credentials: 'same-origin',
  headers: { Accept: 'application/json' }
}).then(r => {
  if (!r.ok) throw new Error('bootstrap_failed');
  return r.json();
});

const snap = window.NoeVaultSnap.createNoeVaultSnap({
  /* host chrome callbacks */
});
await snap.initialize(bootstrap);
snap.mount(/* launcher / host element */);

What “done” looks like

Check Expected
Anonymous bootstrap 401 + SNAP_APP_SESSION_REQUIRED
Authenticated open Composer with categories, priority, attachments, Capture screen
Submit SupportTicket created; attachment actors use empty UserUID (Model B)
My Requests List/detail for the same ExternalRequester continuity
Actor display ExternalRequester label (e.g. application name / trusted profile) — not “(system)”

Next reading