diff --git a/package.json b/package.json index 8d69947..a00fc4d 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,8 @@ "scripts": { "build": "slidev build", "dev": "slidev --open", - "export": "slidev export" + "export": "slidev export", + "export:pptx": "slidev export --format pptx --output slides-export.pptx" }, "dependencies": { "@iconify-json/logos": "^1.2.11", @@ -15,5 +16,8 @@ "slidev-theme-penguin": "^2.3.1", "vite-svg-loader": "^5.1.1", "vue": "^3.5.33" + }, + "devDependencies": { + "playwright-chromium": "^1.60.0" } } diff --git a/pages/closing.md b/pages/closing.md index b649568..318c560 100644 --- a/pages/closing.md +++ b/pages/closing.md @@ -15,7 +15,3 @@ Chrome 更新不是新闻流，而是 Web 产品能力池。 - - diff --git a/pages/demo/adoption-plan.md b/pages/demo/adoption-plan.md index 995a030..6d59fad 100644 --- a/pages/demo/adoption-plan.md +++ b/pages/demo/adoption-plan.md @@ -33,7 +33,3 @@
打开总入口：/demo/index.html。正式 demo 入口都从这里进入。
- - diff --git a/pages/demo/devtools-agents.md b/pages/demo/devtools-agents.md index 50ea977..cd98651 100644 --- a/pages/demo/devtools-agents.md +++ b/pages/demo/devtools-agents.md @@ -34,17 +34,5 @@
-讲解结论：DevTools for agents 不是页面 API，而是把真实浏览器运行时交给 coding agent，让它不再只根据源码猜问题。 +核心结论：DevTools for agents 不是页面 API，而是把真实浏览器运行时交给 coding agent，让它不再只根据源码猜问题。
- - diff --git a/pages/demo/devtools-workflow.md b/pages/demo/devtools-workflow.md index 77ece2c..c468ac4 100644 --- a/pages/demo/devtools-workflow.md +++ b/pages/demo/devtools-workflow.md @@ -37,14 +37,3 @@ flowchart LR
示例任务：创建“订单管理”模块，包括词条、菜单、角色权限绑定。案例数据只说明趋势，不承诺所有项目都有相同收益。
- - diff --git a/pages/demo/html-in-canvas.md b/pages/demo/html-in-canvas.md index 7fe6991..41e6d0a 100644 --- a/pages/demo/html-in-canvas.md +++ b/pages/demo/html-in-canvas.md @@ -31,10 +31,3 @@
运行条件：Chrome Canary 149+，开启 chrome://flags/#canvas-draw-element；Chrome 官方说明该 API 在 Chrome 148-150 处于 origin trial。
- - diff --git a/pages/demo/modern-web-guidance.md b/pages/demo/modern-web-guidance.md index a0a1bdf..c91f870 100644 --- a/pages/demo/modern-web-guidance.md +++ b/pages/demo/modern-web-guidance.md @@ -13,7 +13,7 @@ npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"
-
讲什么
+
演示重点
- AI coding agent 容易写旧方案 @@ -29,13 +29,3 @@ npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"
本地辅助页：/demo/modern-web-guidance/index.html；脚本：scripts/demo-modern-web-guidance.sh。
- - diff --git a/pages/demo/platform-api.md b/pages/demo/platform-api.md index 3bef8fb..e6be8f8 100644 --- a/pages/demo/platform-api.md +++ b/pages/demo/platform-api.md @@ -30,18 +30,5 @@
-最后用这页收束：Chrome 新能力不是孤立 API，而是同时升级 Agent 交互、开发工作流和用户体验。 +收束判断：Chrome 新能力不是孤立 API，而是同时升级 Agent 交互、开发工作流和用户体验。
- - diff --git a/pages/demo/release-scan.md b/pages/demo/release-scan.md index 938ec90..21e5d60 100644 --- a/pages/demo/release-scan.md +++ b/pages/demo/release-scan.md @@ -3,7 +3,7 @@
-
PPT 讲什么
+
幻灯片内容
- 分别介绍新增能力 @@ -45,15 +45,3 @@
原则：WebMCP 是主 demo；Modern Web Guidance 和 DevTools for agents 按官方流程演示；HTML-in-Canvas 和 View Transitions 用本地页面辅助展示。
- - diff --git a/pages/demo/view-transitions.md b/pages/demo/view-transitions.md index 1fb6f0a..247d495 100644 --- a/pages/demo/view-transitions.md +++ b/pages/demo/view-transitions.md @@ -28,10 +28,5 @@
-讲解结论：View Transitions 把“状态变化”从手写动画提升为浏览器级能力，适合渐进增强。 +核心结论：View Transitions 把“状态变化”从手写动画提升为浏览器级能力，适合渐进增强。
- - diff --git a/pages/demo/webmcp-contract.md b/pages/demo/webmcp-contract.md index f08ff50..ad4c137 100644 --- a/pages/demo/webmcp-contract.md +++ b/pages/demo/webmcp-contract.md @@ -32,12 +32,3 @@ navigator.modelContext.registerTool(...)
实验边界：Chrome 官方文档标注 WebMCP 仍处于 proposed / origin trial / flag 阶段；现场 demo 必须有 mock 兜底。
- - diff --git a/pages/demo/webmcp-project.md b/pages/demo/webmcp-project.md index 8f925ba..7f3e73d 100644 --- a/pages/demo/webmcp-project.md +++ b/pages/demo/webmcp-project.md @@ -29,12 +29,5 @@ public/demo/webmcp/
-这页要现场打开工程，不只讲链接。观众能看到“页面 UI”和“Agent 工具视角”同时存在。 +现场打开工程，不只展示链接；页面 UI 和 Agent 工具视角需要同时呈现。
- - diff --git a/pages/demo/webmcp-script.md b/pages/demo/webmcp-script.md index b89579d..8f7d1f6 100644 --- a/pages/demo/webmcp-script.md +++ b/pages/demo/webmcp-script.md @@ -33,9 +33,5 @@
-讲解结论：WebMCP 不是让 Agent 更会点击，而是让网页直接声明“我有哪些可调用能力”。敏感动作仍然要保留用户确认、权限和审计。 +核心结论：WebMCP 不是让 Agent 更会点击，而是让网页直接声明“我有哪些可调用能力”。敏感动作仍然要保留用户确认、权限和审计。
- - diff --git a/pages/outline.md b/pages/outline.md index 986bd7c..19fd42d 100644 --- a/pages/outline.md +++ b/pages/outline.md @@ -27,7 +27,3 @@
- - diff --git a/pages/overview.md b/pages/overview.md index 864fd12..50cf51c 100644 --- a/pages/overview.md +++ b/pages/overview.md @@ -1,14 +1,14 @@ -# 这次分享解决什么问题？ +# 这次分享的目标
-
听众能获得
+
核心收获
- 理解 AI Agent 操作网页为什么困难 - 看懂 Chrome 新增能力各自解决什么问题 -- 知道 PPT 与项目代码分别如何演示这些能力 +- 知道幻灯片与项目代码如何配合演示 - 建立实验能力的风险边界
@@ -27,7 +27,3 @@
- - diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c091b0c..95bd797 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,7 +13,7 @@ importers: version: 1.2.11 '@slidev/cli': specifier: ^52.16.0 - version: 52.16.0(@nuxt/kit@3.21.8)(@types/markdown-it@14.1.2)(@types/node@22.19.21)(@vue/compiler-sfc@3.5.38)(esbuild@0.23.1)(lightningcss@1.32.0)(markdown-it@14.2.0)(postcss@8.5.15)(rolldown@1.0.3)(sass@1.101.0)(tsx@4.22.4) + version: 52.16.0(@nuxt/kit@3.21.8)(@types/markdown-it@14.1.2)(@types/node@22.19.21)(@vue/compiler-sfc@3.5.38)(esbuild@0.23.1)(lightningcss@1.32.0)(markdown-it@14.2.0)(playwright-chromium@1.60.0)(postcss@8.5.15)(rolldown@1.0.3)(sass@1.101.0)(tsx@4.22.4) '@slidev/theme-default': specifier: latest version: 0.25.0 @@ -29,6 +29,10 @@ importers: vue: specifier: ^3.5.33 version: 3.5.38(typescript@6.0.3) + devDependencies: + playwright-chromium: + specifier: ^1.60.0 + version: 1.60.0 packages: @@ -3327,6 +3331,16 @@ packages: plantuml-encoder@1.4.0: resolution: {integrity: sha512-sxMwpDw/ySY1WB2CE3+IdMuEcWibJ72DDOsXLkSmEaSzwEUaYBT6DWgOfBiHGCux4q433X6+OEFWjlVqp7gL6g==} + playwright-chromium@1.60.0: + resolution: {integrity: sha512-xxz9pc2HIxQW/Qg9ijG2fZOHRT//KhLo0KfvJRa45YYRrcA7ZONoilgJR40SW5pmecb6HkuROaeViXoCaXTZyQ==} + engines: {node: '>=18'} + hasBin: true + + playwright-core@1.60.0: + resolution: {integrity: sha512-9bW6zvX/m0lEbgTKJ6YppOKx8H3VOPBMOCFh2irXFOT4BbHgrx5hPjwJYLT40Lu+4qtD36qKc/Hn56StUW57IA==} + engines: {node: '>=18'} + hasBin: true + points-on-curve@0.2.0: resolution: {integrity: sha512-0mYKnYYe9ZcqMCWhUjItv/oHjvgEsfKvnUTg8sAtnHr3GVy7rGkXCb6d5cSyqrWqL4k81b9CPg3urd+T7aop3A==} @@ -5095,7 +5109,7 @@ snapshots: '@shikijs/vscode-textmate@10.0.2': {} - '@slidev/cli@52.16.0(@nuxt/kit@3.21.8)(@types/markdown-it@14.1.2)(@types/node@22.19.21)(@vue/compiler-sfc@3.5.38)(esbuild@0.23.1)(lightningcss@1.32.0)(markdown-it@14.2.0)(postcss@8.5.15)(rolldown@1.0.3)(sass@1.101.0)(tsx@4.22.4)': + '@slidev/cli@52.16.0(@nuxt/kit@3.21.8)(@types/markdown-it@14.1.2)(@types/node@22.19.21)(@vue/compiler-sfc@3.5.38)(esbuild@0.23.1)(lightningcss@1.32.0)(markdown-it@14.2.0)(playwright-chromium@1.60.0)(postcss@8.5.15)(rolldown@1.0.3)(sass@1.101.0)(tsx@4.22.4)': dependencies: '@antfu/ni': 30.1.0 '@antfu/utils': 9.3.0 @@ -5168,6 +5182,8 @@ snapshots: vue: 3.5.38(typescript@6.0.3) yaml: 2.9.0 yargs: 18.0.0 + optionalDependencies: + playwright-chromium: 1.60.0 transitivePeerDependencies: - '@modelcontextprotocol/sdk' - '@nuxt/kit' @@ -7825,6 +7841,12 @@ snapshots: plantuml-encoder@1.4.0: {} + playwright-chromium@1.60.0: + dependencies: + playwright-core: 1.60.0 + + playwright-core@1.60.0: {} + points-on-curve@0.2.0: {} points-on-path@0.2.1: diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index 5729ed8..746de0f 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -1,4 +1,5 @@ allowBuilds: '@parcel/watcher': true esbuild: true + playwright-chromium: true vue-demi: true diff --git a/slides-export.pptx b/slides-export.pptx new file mode 100644 index 0000000..b3cf9a9 Binary files /dev/null and b/slides-export.pptx differ