fantasia-electron-preload
Extends or fixes renderer-facing Electron APIs exposed through the preload script and contextBridge. Use when adding IPC-like surface area, typing window.faContentBridgeAPIs, or editing files under src-electron/ contentBridgeAPIs.
Best use case
fantasia-electron-preload is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Extends or fixes renderer-facing Electron APIs exposed through the preload script and contextBridge. Use when adding IPC-like surface area, typing window.faContentBridgeAPIs, or editing files under src-electron/ contentBridgeAPIs.
Teams using fantasia-electron-preload should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/fantasia-electron-preload/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How fantasia-electron-preload Compares
| Feature / Agent | fantasia-electron-preload | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Extends or fixes renderer-facing Electron APIs exposed through the preload script and contextBridge. Use when adding IPC-like surface area, typing window.faContentBridgeAPIs, or editing files under src-electron/ contentBridgeAPIs.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Fantasia Archive — preload and content bridge
## Architecture
- **Preload**: `src-electron/electron-preload.ts` builds `apiObject` and calls `contextBridge.exposeInMainWorld('faContentBridgeAPIs', apiObject)`.
- **Renderer access**: `window.faContentBridgeAPIs` — typed in `src/globals.d.ts`.
- **Implementations**: One module per API under `src-electron/contentBridgeAPIs/` (e.g. `faWindowControlAPI.ts`, `appDetailsAPI.ts`).
## Adding a new API surface
1. Define the contract in `types/I_<Name>.ts` (or extend an existing interface).
2. Implement functions in `src-electron/contentBridgeAPIs/<name>.ts` exporting a plain object matching that interface.
3. Import the implementation in `electron-preload.ts` and add it to `apiObject` with a stable key (camelCase, consistent with existing keys).
4. Extend `Window['faContentBridgeAPIs']` in `src/globals.d.ts` with the new key and interface.
5. Add Vitest coverage under `src-electron/contentBridgeAPIs/tests/` following existing `*.vitest.test.ts` patterns.
## Security and boundaries
- Prefer **narrow, explicit** methods on the bridge object over passing raw Node/Electron objects to the renderer.
- Do not enable broad `nodeIntegration` in the renderer to “just make it work”; keep privileged code in main or preload as appropriate.
- Some APIs use `@electron/remote` (e.g. `BrowserWindow` in `faWindowControlAPI`); when changing that pattern, consider security and testability implications.
## Related skills
- [fantasia-electron-main](../fantasia-electron-main/SKILL.md) for main-process lifecycle and windows.
- [fantasia-sqlite-main](../fantasia-sqlite-main/SKILL.md) for database access from main.Related Skills
fantasia-worldbuilding-domain
Aligns AI suggestions with Fantasia Archive as a worldbuilding database manager: projects, documents, and in-app concepts. Use when designing UX, data models, menus, or copy that should match the product purpose.
fantasia-testing
Runs and extends Fantasia Archive tests: Vitest unit tests vs Playwright component and E2E tests, including rebuild-before-Playwright rules and file naming. Use when writing tests, debugging CI, or when the user mentions Vitest, Playwright, component tests, or e2e.
fantasia-sqlite-main
Designs SQLite usage in Fantasia Archive’s Electron main process: file locations under userData, native sqlite3 module constraints, and migrations. Use when editing electron-main database code, schema, or persistence paths.
fantasia-release-build
Produces production Electron builds for Fantasia Archive with electron- builder and Quasar. Use when changing build scripts, packaging, or publish flags, or when the user asks how to ship the desktop app.
fantasia-quasar-vue
Builds Vue 3 + Quasar UI for Fantasia Archive: layouts, pages, router, Pinia, and boot files. Use when editing .vue files, Quasar components, routes, or stores under src/.
fantasia-plan-documents
Creates and updates local plan documents in .cursor/plans with required timestamp and package version metadata in both file body and filename.
fantasia-markdown-dialogs
Implements or edits markdown-backed dialogs using Quasar QMarkdown and i18n- sourced document strings. Use when changing DialogMarkdownDocument, help docs, or changelog/license content shown in-app.
fantasia-i18n
Manages vue-i18n messages and locale structure for Fantasia Archive. Use when adding or changing user-facing strings, locale files under src/i18n, or markdown-backed documents wired into i18n.
fantasia-electron-main
Works on Fantasia Archive Electron main process: app lifecycle, window management, platform tweaks, and native integrations. Use when editing electron-main.ts, src-electron/mainScripts/, or main-side tests.
fantasia-dev-setup
Sets up and runs Fantasia Archive locally using Yarn, Node.js 22.22 or newer, and Quasar Electron mode. Use when installing dependencies, choosing dev vs production build commands, or when the user mentions environment setup, CLI, or first run.
fantasia-changelog-en-us
Maintains the English in-app changelog at src/i18n/en-US/documents/changeLog.md in strict sync with package.json version, without any automatic version bumping. Changelog text must be user- or release-relevant only—never internal QA (lint/build/test runs, “all gates passed”). Use after substantive app, UX, or user-facing docs changes, or when the user asks for release notes.
git-conventional-commits
Splits working tree changes into logical Git commits with conventional messages (feat, fix, test, chore, refactor, style, docs). Proposes commits one at a time and waits for explicit user approval before each git commit. Use when the user asks to commit, split commits, stage by topic, or use conventional / semantic commit messages.