Repository navigation
Add a web feedback widget (agentback/web and widget.js), release 0.3.0 - #3
Merged
Merged
Conversation
agentback/web exports createFeedbackWidget, and the build also emits dist/widget.js, a script-tag bundle that Agentback serves at /widget.js. The panel sends reports with source web and the page's origin and path, defaults to Agentback orange with presets or any hex colour, follows light and dark, uses the page's font, and becomes a bottom sheet on phones. Customers can hide the floating button and open it from their own menu with data-agentback-open, relabel or hide the types, and attach a signed account. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DuYf7tYxMy7gcDTagH5hjC
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Requested by fatwang2 · project thread
Customers had no way to collect feedback from the people using their web app. This adds a feedback widget to the SDK, in two forms built from one source:
agentback/web:createFeedbackWidget({ projectKey, ... })for apps with a bundler.agentback/widget.js: a minified IIFE (about 8.7 KB gzipped) that readsdata-attributes from its script tag. Agentback serves it athttps://agentback.app/widget.jsfrom the installed package (fatwang2/agentback, separate PR).What it does
webandpage(origin and path, never the query string).neutral,blue,violetor any hex colour, with readable text picked by contrast. Follows light/dark (theme), takes the page's font, Shadow DOM so neither side's CSS leaks.launcher: falseplusdata-agentback-openon the customer's own menu item opens the panel next to that element.categoriesrelabels, reorders or hides the types; stored values stay the fixed four.identity/identify({ account, signature }), ordata-accountanddata-signature. An unsigned account is dropped with a console warning instead of failing the send.enandzhbuilt in, picked from the page'slang; every string can be overridden withtext.Sourcegainsweb, andFeedbackgainspage.The server must accept
webandpagebefore this is released; that change is in the Agentback PR.Checks
npm run format:check,npm run typecheck,npm test(newtest/web.test.tson happy-dom: submission body, rate-limit state, relabelled and hidden types, own-menu trigger, signed and unsigned identity, Chinese locale, colour contrast) andnpm run check:package(now also importsagentback/webin a clean Node consumer and resolvesagentback/widget.js) all pass. Rendered in Chromium on desktop, dark mode and a 390px phone, and run end to end against a local Agentback: the report arrived in the inbox with sourceweband the page path.Version bumped to 0.3.0. After merge, run the Release workflow on main.
Generated by Claude Code