Open
Conversation
WalkthroughA new documentation file introduces AI-Extension capabilities, covering architecture using the MCP protocol and Skills system, core features, typical use cases including web automation and domain-specific AI assistants, onboarding procedures for extension installation and workspace setup, and advanced customization workflows. Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~4 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (12)
docs/guide/ai-extension-intro.md (12)
90-94: Add security notice for unpacked extension installation.The instructions guide users to install an unpacked extension from a downloaded ZIP file, bypassing the Chrome Web Store. While this is necessary for development/testing, there's no mention of the security implications.
Consider adding a brief security note, such as:
- Only install extensions from trusted sources
- Unpacked extensions don't receive automatic updates
- Users should verify the source and integrity of downloaded files
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 90 - 94, Add a brief security notice after the unpacked-extension installation steps (after step referencing chrome://extensions/ and enabling "User Scripts") warning users to only install extensions from trusted sources, that unpacked extensions bypass the Chrome Web Store and do not receive automatic updates, and to verify the source and integrity of downloaded ZIPs before enabling developer mode or loading unpacked extensions.
21-23: Add security context for "User Scripts" permission.The documentation mentions enabling "User Scripts" permission (line 94) without explaining what this permission does or its security implications. Users should understand that this grants the extension significant privileges.
Consider adding a brief explanation or link to documentation about what "User Scripts" means and why it's required for this extension to function.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 21 - 23, Update the "1. 零侵入，插上即用" section to include a concise security note explaining what the "User Scripts" permission does and its implications: mention that it allows the extension to run custom scripts on web pages (granting broad access to page content and potential sensitive data), why the extension needs it for its features, and recommend security best practices (e.g., only enable for trusted sites or review extension source). Add a link to official docs about User Scripts or browser extension permissions for further reading and reference the exact phrase "User Scripts" so users can find it easily.
206-206: Clarify hot reload behavior in different environments.The documentation states "Vite 热更新自动生效，无需重启" but doesn't clarify whether this applies only to development mode or also to production builds. Users following the earlier instructions installed a production build from a ZIP file.
Clarify the hot reload behavior:
- In development mode (
pnpm dev): hot reload works automatically- In production builds: users need to rebuild (
pnpm build:wxt) and reload the extension inchrome://extensions/🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` at line 206, Update the line under "第四步：保存文件" to clarify hot reload behavior by stating that Vite's hot reload applies only in development mode (run with `pnpm dev`) and will auto-apply changes, whereas for production builds installed from a ZIP you must rebuild with `pnpm build:wxt` and then reload the extension in chrome://extensions/ to see changes; reference the existing step text ("第四步：保存文件") so the update edits that sentence to include both development and production instructions.
231-231: Consider version-agnostic download link strategy.The download link is hardcoded to version 0.0.6. This documentation will become outdated with each release unless the URL is updated.
Consider:
- Using a "latest" redirect URL that always points to the newest version
- Adding a note that users should check the GitHub releases page for the latest version
- Linking to the GitHub releases page instead:
https://github.com/opentiny/next-sdk/releases/latest🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` at line 231, Replace the hardcoded versioned download URL in the "立即体验" link (currently pointing to https://docs.opentiny.design/download/extension-0.0.6.zip) with a version-agnostic approach: either use a "latest" redirect URL if available, or change the href to the GitHub releases latest URL (https://github.com/opentiny/next-sdk/releases/latest) and update the link text to indicate "Download AI-Extension (latest)" ; additionally add a short parenthetical note next to the link advising users to check the GitHub releases page for the most recent version.
46-50: Clarify "WebMCP Proxy" service.Line 48 references "WebMCP Proxy 代理服务器" without any prior explanation of what this service is, how to set it up, or where it runs (user-hosted vs cloud service).
Add a brief explanation or link to documentation about the WebMCP Proxy service, including:
- What it is and its purpose
- Whether it's self-hosted or cloud-hosted
- Security and privacy implications of routing MCP messages through a proxy
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 46 - 50, Add a short explanatory paragraph after the mention of "WebMCP Proxy 代理服务器" that defines what the WebMCP Proxy service is (a message-proxy that relays MCP protocol messages between clients and the host browser session), states whether it is provided as a user-hosted option or a cloud-hosted service (clarify if users must self-host or provide a link to the hosted offering), and briefly notes security/privacy implications (e.g., end-to-end encryption, what metadata is routed, and recommendation to self-host for sensitive use), and include a link to the setup/configuration docs or repo for WebMCP Proxy so readers can find installation and configuration steps; update the surrounding text (the paragraph around "远程控制，手机扫码操作电脑") to reference this new explanatory paragraph.
96-99: Add troubleshooting guidance or FAQ section.The documentation provides installation and usage instructions but lacks troubleshooting guidance. Users who encounter issues during setup or usage won't have clear next steps.
Consider adding:
- A troubleshooting section covering common issues (extension not loading, tools not working, connection failures)
- A FAQ section
- Links to community support channels or issue tracker
- Common error messages and their solutions
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 96 - 99, Add a new "故障排除与常见问题" section after the "第二步：打开侧边栏，开始对话" heading that covers common problems (extension not loading, sidebar not opening, tools failing to respond, connection/timeouts), include specific troubleshooting steps (reload/ reinstall, check permissions, network checks, console logs), a short FAQ with answers to 5–8 frequent questions (how to grant permissions, supported browsers, data privacy, updating), links to the project issue tracker and community/support channel, and a small table of common error messages with their likely causes and fixes to make it easy for users to self-diagnose.
147-162: Clarify schema validation library usage.The code example uses
z.string().describe()without explaining thatzis a Zod schema validator parameter passed by the framework. This may confuse developers unfamiliar with the pattern.Consider adding a brief comment explaining the schema definition:
// mcp-servers/your-site.com/index.ts export default ({ server, z }) => { // z is Zod schema validator provided by framework server.registerTool( 'my-tool', { title: '我的工具', description: '工具的功能描述，AI 根据这里判断何时调用', inputSchema: { text: z.string().describe('输入文本') // Define input validation schema } },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 147 - 162, Add a short inline comment to the example explaining that the second parameter "z" in the export default signature is the Zod schema validator provided by the framework and that inputSchema uses it for runtime validation; modify the export default ({ server, z }) => { ... } snippet and the inputSchema line (referencing the export default and server.registerTool entries and the text: z.string().describe(...) usage) to include that brief explanatory note so readers understand where z comes from and why it's used.
81-100: Consider adding system requirements and prerequisites.The installation section jumps directly into installation steps without specifying:
- Supported browsers and minimum versions (Chrome version? Edge version?)
- Operating system compatibility (Windows/Mac/Linux?)
- Prerequisites (Do users need an API key? Which AI providers are supported out-of-box?)
- Expected setup time
Consider adding a "System Requirements" or "Prerequisites" subsection before the installation steps to help users determine if they can use this extension.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 81 - 100, Add a "System Requirements" or "Prerequisites" subsection above "### 第一步：安装扩展" (under "## 四、上手有多简单？") that lists supported browsers and minimum versions (e.g., Chrome/Edge and version numbers), supported OSes (Windows/Mac/Linux), required prerequisites (API key requirement, login, or enabled features), which AI providers are supported out-of-box, and an estimated setup time (e.g., ~5 minutes); keep it concise and use bullet points for clarity.
33-34: Consider adding security warning for Main World execution.The "Main World" execution environment is described as having direct access to page JavaScript, React/Vue component state, and internal methods. This is powerful but also carries security implications that aren't mentioned.
Consider adding a note that Main World execution should be used carefully and only when necessary, as it has access to sensitive page data and can potentially conflict with page scripts.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 33 - 34, Add a concise security warning next to the "主世界（Main World）" bullet: explain that Main World has full access to page JavaScript, component state and internal methods, so it should be used only when necessary, avoid running untrusted code there, and highlight risks like exposure of sensitive data and potential conflicts with page scripts; update the "主世界（Main World）" bullet (the one describing direct access to page JS/React/Vue state and internal methods) to include this short cautionary sentence.
134-143: Add guidance for choosing execution environment type.The code shows two options (
'contentScriptMcpServer'or'pageMcpServer') with a brief comment about when to usepageMcpServer, but doesn't explain when to usecontentScriptMcpServeror the tradeoffs between them.Consider adding a more detailed explanation or a decision matrix, such as:
- Use
contentScriptMcpServerwhen: only need DOM access, want maximum safety/isolation- Use
pageMcpServerwhen: need to access page JavaScript state, call page functions, read framework component state- Tradeoffs: security, potential for conflicts, performance implications
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 134 - 143, Replace the brief inline comment next to the type field in the meta.ts example with a short decision matrix that explains when to choose each execution environment: explicitly document that type: 'contentScriptMcpServer' is for DOM-only access and provides stronger isolation/safety and fewer conflicts, while type: 'pageMcpServer' is for accessing page JS state, calling page functions, or reading framework component state; also list tradeoffs (security/isolation vs. ability to access page runtime, potential conflict surface, and small performance implications) so readers can pick between the 'type' values in the exported meta object (name, type, url, isAlwaysEnabled, version).
166-169: Explain build output path for new developers.Line 168 references the path
packages/next-wxt/.output/chrome-mv3-open-prodwithout explaining that this directory will be created by the build command. First-time developers might be confused looking for a directory that doesn't exist yet.Add a note that this directory is created by the build process:
pnpm build:wxt # 构建完成后，在 chrome://extensions/ 中重新加载 # packages/next-wxt/.output/chrome-mv3-open-prod 目录（该目录由 build 命令生成）🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 166 - 169, Add a brief note after the pnpm build:wxt example that the packages/next-wxt/.output/chrome-mv3-open-prod directory is created by the build process, e.g. update the snippet to include a comment like "该目录由 build 命令生成" so new developers know the directory will appear only after running pnpm build:wxt; modify the block around the pnpm build:wxt command and the referenced packages/next-wxt/.output/chrome-mv3-open-prod path to include this clarifying comment.
85-88: Clarify download instructions format.The download URL is placed in a bash code block but as a comment, which may confuse users who try to copy-paste. Since there's no actual bash command to execute for downloading (users need to download via browser), this could be formatted differently.
Consider either:
- Remove the bash code block and present the URL as a regular markdown link
- Provide an actual command like
curl -O https://docs.opentiny.design/download/extension-0.0.6.zip🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/guide/ai-extension-intro.md` around lines 85 - 88, The current bash code block contains a commented URL ("https://docs.opentiny.design/download/extension-0.0.6.zip") which can confuse readers; replace that block with either a plain markdown link to the URL or a real download command. Specifically, locate the code block containing the URL string and change it to a regular markdown link (e.g., present the URL inline or as [Extension 0.0.6](https://docs.opentiny.design/download/extension-0.0.6.zip)) or, if you want a terminal option, replace the commented lines with an actual command such as curl -O https://docs.opentiny.design/download/extension-0.0.6.zip so users can copy-paste directly.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@docs/guide/ai-extension-intro.md`:
- Around line 90-94: Add a brief security notice after the unpacked-extension
installation steps (after step referencing chrome://extensions/ and enabling
"User Scripts") warning users to only install extensions from trusted sources,
that unpacked extensions bypass the Chrome Web Store and do not receive
automatic updates, and to verify the source and integrity of downloaded ZIPs
before enabling developer mode or loading unpacked extensions.
- Around line 21-23: Update the "1. 零侵入，插上即用" section to include a concise
security note explaining what the "User Scripts" permission does and its
implications: mention that it allows the extension to run custom scripts on web
pages (granting broad access to page content and potential sensitive data), why
the extension needs it for its features, and recommend security best practices
(e.g., only enable for trusted sites or review extension source). Add a link to
official docs about User Scripts or browser extension permissions for further
reading and reference the exact phrase "User Scripts" so users can find it
easily.
- Line 206: Update the line under "第四步：保存文件" to clarify hot reload behavior by
stating that Vite's hot reload applies only in development mode (run with `pnpm
dev`) and will auto-apply changes, whereas for production builds installed from
a ZIP you must rebuild with `pnpm build:wxt` and then reload the extension in
chrome://extensions/ to see changes; reference the existing step text
("第四步：保存文件") so the update edits that sentence to include both development and
production instructions.
- Line 231: Replace the hardcoded versioned download URL in the "立即体验" link
(currently pointing to
https://docs.opentiny.design/download/extension-0.0.6.zip) with a
version-agnostic approach: either use a "latest" redirect URL if available, or
change the href to the GitHub releases latest URL
(https://github.com/opentiny/next-sdk/releases/latest) and update the link text
to indicate "Download AI-Extension (latest)" ; additionally add a short
parenthetical note next to the link advising users to check the GitHub releases
page for the most recent version.
- Around line 46-50: Add a short explanatory paragraph after the mention of
"WebMCP Proxy 代理服务器" that defines what the WebMCP Proxy service is (a
message-proxy that relays MCP protocol messages between clients and the host
browser session), states whether it is provided as a user-hosted option or a
cloud-hosted service (clarify if users must self-host or provide a link to the
hosted offering), and briefly notes security/privacy implications (e.g.,
end-to-end encryption, what metadata is routed, and recommendation to self-host
for sensitive use), and include a link to the setup/configuration docs or repo
for WebMCP Proxy so readers can find installation and configuration steps;
update the surrounding text (the paragraph around "远程控制，手机扫码操作电脑") to reference
this new explanatory paragraph.
- Around line 96-99: Add a new "故障排除与常见问题" section after the "第二步：打开侧边栏，开始对话"
heading that covers common problems (extension not loading, sidebar not opening,
tools failing to respond, connection/timeouts), include specific troubleshooting
steps (reload/ reinstall, check permissions, network checks, console logs), a
short FAQ with answers to 5–8 frequent questions (how to grant permissions,
supported browsers, data privacy, updating), links to the project issue tracker
and community/support channel, and a small table of common error messages with
their likely causes and fixes to make it easy for users to self-diagnose.
- Around line 147-162: Add a short inline comment to the example explaining that
the second parameter "z" in the export default signature is the Zod schema
validator provided by the framework and that inputSchema uses it for runtime
validation; modify the export default ({ server, z }) => { ... } snippet and the
inputSchema line (referencing the export default and server.registerTool entries
and the text: z.string().describe(...) usage) to include that brief explanatory
note so readers understand where z comes from and why it's used.
- Around line 81-100: Add a "System Requirements" or "Prerequisites" subsection
above "### 第一步：安装扩展" (under "## 四、上手有多简单？") that lists supported browsers and
minimum versions (e.g., Chrome/Edge and version numbers), supported OSes
(Windows/Mac/Linux), required prerequisites (API key requirement, login, or
enabled features), which AI providers are supported out-of-box, and an estimated
setup time (e.g., ~5 minutes); keep it concise and use bullet points for
clarity.
- Around line 33-34: Add a concise security warning next to the "主世界（Main
World）" bullet: explain that Main World has full access to page JavaScript,
component state and internal methods, so it should be used only when necessary,
avoid running untrusted code there, and highlight risks like exposure of
sensitive data and potential conflicts with page scripts; update the "主世界（Main
World）" bullet (the one describing direct access to page JS/React/Vue state and
internal methods) to include this short cautionary sentence.
- Around line 134-143: Replace the brief inline comment next to the type field
in the meta.ts example with a short decision matrix that explains when to choose
each execution environment: explicitly document that type:
'contentScriptMcpServer' is for DOM-only access and provides stronger
isolation/safety and fewer conflicts, while type: 'pageMcpServer' is for
accessing page JS state, calling page functions, or reading framework component
state; also list tradeoffs (security/isolation vs. ability to access page
runtime, potential conflict surface, and small performance implications) so
readers can pick between the 'type' values in the exported meta object (name,
type, url, isAlwaysEnabled, version).
- Around line 166-169: Add a brief note after the pnpm build:wxt example that
the packages/next-wxt/.output/chrome-mv3-open-prod directory is created by the
build process, e.g. update the snippet to include a comment like "该目录由 build
命令生成" so new developers know the directory will appear only after running pnpm
build:wxt; modify the block around the pnpm build:wxt command and the referenced
packages/next-wxt/.output/chrome-mv3-open-prod path to include this clarifying
comment.
- Around line 85-88: The current bash code block contains a commented URL
("https://docs.opentiny.design/download/extension-0.0.6.zip") which can confuse
readers; replace that block with either a plain markdown link to the URL or a
real download command. Specifically, locate the code block containing the URL
string and change it to a regular markdown link (e.g., present the URL inline or
as [Extension 0.0.6](https://docs.opentiny.design/download/extension-0.0.6.zip))
or, if you want a terminal option, replace the commented lines with an actual
command such as curl -O
https://docs.opentiny.design/download/extension-0.0.6.zip so users can
copy-paste directly.
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
1 participant
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.
Pull Request (OpenTiny NEXT-SDKs)
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit