Skip to content

v2026.06.10 feat(options): Shopify Admin Access Token Generator - #67

Open
junaidkbr wants to merge 2 commits into
mainfrom
feat/access-token-generator
Open

v2026.06.10 feat(options): Shopify Admin Access Token Generator#67
junaidkbr wants to merge 2 commits into
mainfrom
feat/access-token-generator

Conversation

@junaidkbr

@junaidkbr junaidkbr commented Jun 10, 2026

Copy link
Copy Markdown
Member

Closes #47

What

Automates the Shopify Admin OAuth flow from inside the browser. A new Access Tokens page in the options app lets you enter a custom app's credentials, pick scopes from a searchable checklist (with quick-select bundles), and generate an Admin API access token without Postman or manual URL construction.

How it works

  1. The options page builds the /admin/oauth/authorize URL with a random state param, saves a pending session (local:oauth_pending_session), and opens the approval tab.
  2. The background service worker captures the redirect via webNavigation.onBeforeNavigate: this fires before any connection attempt, so the ?code= is captured even when the redirect URI is http://localhost/ with nothing listening.
  3. The state param is validated (CSRF guard + proof the navigation is our callback; unrelated navigations and forged callbacks are ignored without disturbing the in-flight session).
  4. The background exchanges the code at /admin/oauth/access_token (CORS-free thanks to existing <all_urls> host permissions), saves the token to the vault, deletes the pending session, and redirects the tab back to the options page with the outcome.
  5. The vault (local:access_tokens) lists tokens by store with granted scopes and age; one-click copy, per-token delete, and delete-all. The options page updates reactively via storage.watch.

Security

  • Client secret is held only in the pending session while the flow is in flight and is deleted the moment the callback is captured (or after the 10-minute expiry, matching Shopify's code lifetime).
  • Tokens live in their own storage key, never synced and structurally excluded from preset import/export.
  • Stored scopes are the granted set parsed from the exchange response, not the requested set.
  • Generic error messages: credentials never appear in errors or logs.

Scope (v1, per discussion)

Core flow + token vault, options page only. Deferred to follow-ups: user-saved scope presets, Partner Dashboard credential auto-detect, context-menu trigger.

Changes

  • utils/oauth.ts: shared types, session/vault storage, URL build/parse, token exchange
  • utils/adminScopes.ts: static Admin API scope registry + quick-select bundles
  • entrypoints/background/oauth.ts: redirect capture + exchange state machine
  • entrypoints/options/components/pages/AccessTokens.svelte, access-tokens/TokenGenerator.svelte, access-tokens/TokenVault.svelte: new page UI (Polaris web components)
  • Navigation/App routing, analytics actions, version bump to 2026.06.10 + changelog

Testing

  • tsc --noEmit, oxlint, oxfmt clean; production wxt build succeeds
  • No new manifest permissions required

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: Shopify Admin Access Token Generator — automate the OAuth flow from the browser

1 participant