Skip to content

integrate-supportkori-widget

skillLast commit

Audits or integrates one theme-consistent SupportKori trigger across website and browser-extension surfaces.

Role
Agent workflow design and automation engineering
Scope
Frontend Quality, deterministic validation, and portable distribution
Status
Published npm package v0.1.0

Problem

A support widget can technically load while still conflicting with a site's design, mounting more than once, violating CSP, or failing inside browser-extension surfaces.

Constraints

  1. C1

    Integration must use the repository's established SupportKori contract rather than inventing a generic embed.

  2. C2

    Websites and extensions have different lifecycle, CSP, permission, and iframe boundaries.

  3. C3

    Remote configuration and publication remain outside an ordinary local integration request.

Architecture

Host-surface and existing-integration audit; lifecycle-safe trigger and panel integration; CSP, extension, visual, and runtime verification.

01

Discovery

Identify framework lifecycle, existing widget code, theme tokens, CSP, and extension constraints.

02

Integration

Mount one native-looking trigger and preserve the established embedded-panel contract.

03

Verification

Check duplication, cleanup, focus, responsive placement, CSP, and runtime behavior.

Decisions

D1

Integrate at the lifecycle boundary

Place initialization and cleanup where the host framework can guarantee one active widget instance.

D2

Match the host interface

Reuse local tokens and interaction patterns so support feels native to the product.

D3

Treat extensions as a separate environment

Validate manifest permissions, CSP, and extension-page behavior instead of assuming website rules apply.

Contribution

  • Codified SupportKori-specific discovery and integration rules.
  • Defined lifecycle and duplicate-mount safeguards.
  • Documented CSP and browser-extension constraints.
  • Added portable packaging and contract tests.

Outcomes

  • Agents can audit or integrate SupportKori without replacing an existing valid setup.
  • The widget follows host visual and interaction conventions.
  • Extension-specific security boundaries remain explicit.
  • Verification covers both rendered behavior and integration safety.

Verified stack

  • Agent Skills
  • JavaScript
  • Node.js
  • npm
  • Content Security Policy
  • Browser Extensions
  • GitHub Actions
  • CI/CD

Working through something similar?

Share your challenge, scope, and timeline to start a focused conversation.