docs(README): 更新项目文档并添加新功能说明

.github/workflows/lint.yml

@@ -0,0 +1,20 @@
+name: Lint
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: '16'
+    - run: npm ci
+    - run: npm run lint:type

.github/workflows/release.yml

@@ -0,0 +1,39 @@
+name: Release
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: '16'
+    - run: npm ci
+    - run: npm run build
+    - name: Zip Extension
+      run: zip -r juejin-book-downloader.zip dist
+    - name: Create Release
+      id: create_release
+      uses: actions/create-release@v1
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      with:
+        tag_name: ${{ github.ref }}
+        release_name: Release ${{ github.ref }}
+        draft: false
+        prerelease: false
+    - name: Upload Release Asset
+      uses: actions/upload-release-asset@v1
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      with:
+        upload_url: ${{ steps.create_release.outputs.upload_url }}
+        asset_path: ./juejin-book-downloader.zip
+        asset_name: juejin-book-downloader.zip
+        asset_content_type: application/zip

.github/workflows/test.yml

@@ -0,0 +1,20 @@
+name: Test
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: '16'
+    - run: npm ci
+    - run: npm test

LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2023 h7ml <[email protected]>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

README.md

@@ -1,82 +1,128 @@
-# 掘金小册下载器 (Juejin Book Downloader)
+# 掘金小册下载器
 
-![License](https://img.shields.io/github/license/h7ml/juejin-book-downloader)
-![GitHub stars](https://img.shields.io/github/stars/h7ml/juejin-book-downloader?style=social)
+## 项目简介
 
-一个用于下载掘金小册的Chrome扩展工具。
-
-A Chrome extension tool for downloading books from Juejin.
+掘金小册下载器是一个便捷的浏览器扩展，专为掘金平台用户设计。它允许用户轻松下载已购买的掘金小册内容，支持下载整本小册或单个章节，并将内容保存为多种格式，方便离线阅读和学习。
 
 ## 功能特点
 
-- 支持下载已购买的掘金小册
-- 多种保存格式选择:
-  - PDF
-  - Markdown
-  - HTML
-  - JSON
-- 简单易用的用户界面
-- 支持批量下载
+- 在小册页面智能添加下载按钮
+- 支持下载整本小册
+- 支持下载单个章节
+- 支持多种下载格式：HTML、Markdown、PDF 和 JSON
+- 友好的用户界面和交互体验
+- 支持离线阅读，方便随时学习
+
+## 安装说明
+
+### 方法 1：从 GitHub Release 安装（推荐）
+
+1. 访问项目的 [Releases 页面](https://github.com/h7ml/juejin-book-downloader/releases)。
+2. 下载最新版本的 `juejin-book-downloader.zip` 文件。
+3. 解压下载的 zip 文件。
+4. 在 Chrome 浏览器中，进入 `chrome://extensions/`。
+5. 开启右上角的"开发者模式"。
+6. 点击左上角的"加载已解压的扩展程序"。
+7. 选择刚才解压的文件夹。
+8. 扩展程序现在应该已经安装完成并在浏览器中激活。
 
-## 安装
+### 方法 2：从源代码构建
 
-1. 克隆此仓库到本地:
+如果您想自己构建扩展程序，请按照以下步骤操作：
+
+1. 克隆仓库到本地：
    ```
    git clone https://github.com/h7ml/juejin-book-downloader.git
    ```
 
-2. 进入项目目录:
+2. 进入项目目录：
    ```
    cd juejin-book-downloader
    ```
 
-3. 安装依赖:
+3. 安装依赖：
    ```
    npm install
    ```
 
-4. 构建项目:
+4. 构建项目：
    ```
    npm run build
    ```
 
-5. 在Chrome浏览器中加载扩展:
-   - 打开Chrome浏览器，进入`chrome://extensions/`
+5. 在浏览器中加载扩展：
+   - 打开 Chrome 浏览器，进入 `chrome://extensions/`
    - 开启"开发者模式"
    - 点击"加载已解压的扩展程序"
-   - 选择项目的`dist`目录
+   - 选择项目的 `dist` 目录
+
+## 更新扩展程序
+
+要更新到最新版本：
+
+1. 下载最新的 Release 版本。
+2. 解压新版本的 zip 文件。
+3. 在 Chrome 的扩展管理页面 (`chrome://extensions/`) 中找到"掘金小册下载器"。
+4. 点击"删除"以卸载旧版本。
+5. 按照上述安装步骤重新安装新版本。
+
+注意：更新过程中您的设置和数据可能会丢失。
 
 ## 使用方法
 
-1. 登录掘金网站 (https://juejin.cn/)
-2. 打开您已购买的小册页面
-3. 点击扩展图标，打开下载界面
-4. 选择您想要的保存格式（PDF、Markdown、HTML或JSON）
-5. 点击"开始下载"按钮
-6. 下载完成后，您可以在指定位置找到保存的文件
+1. 安装扩展后，访问掘金小册页面。
+2. 在小册首页或章节页面，您会看到一个新的下载按钮。
+3. 点击下载按钮，选择所需的下载格式（HTML、Markdown、PDF 或 JSON）。
+4. 确认下载，内容将被保存为所选格式的文件。
+
+## 技术栈
+
+- React：用于构建用户界面
+- TypeScript：提供类型安全和更好的开发体验
+- Ant Design：UI 组件库，提供美观的界面元素
+- Chrome Extension API：与浏览器交互，实现扩展功能
+- file-saver：用于保存下载的文件
+- html-to-pdf：用于生成 PDF 文件
+- markdown-it：用于处理 Markdown 格式
 
-## 开发
+## 项目结构
 
-- 运行开发服务器: `npm run dev`
-- 构建项目: `npm run build`
-- 预览构建结果: `npm run preview`
+src/
+├── content-scripts/
+│ ├── juejin.tsx # 注入到掘金页面的主要脚本
+│ └── utils/
+│   ├── sectionDownloader.ts # 处理章节下载的工具函数
+│   ├── htmlConverter.ts # HTML 转换工具
+│   ├── pdfGenerator.ts # PDF 生成工具
+│   └── jsonFormatter.ts # JSON 格式化工具
+├── background/
+│ └── index.ts # 背景脚本，处理扩展的后台逻辑
+└── popup/
+  └── index.tsx # 扩展的弹出窗口界面
 
-## 贡献
+## 贡献指南
 
-欢迎提交问题和合并请求。对于重大更改，请先打开一个问题讨论您想要更改的内容。
+我们欢迎并感谢任何形式的贡献！如果您想为项目做出贡献，请遵循以下步骤：
+
+1. Fork 本仓库
+2. 创建您的特性分支 (`git checkout -b feature/AmazingFeature`)
+3. 提交您的更改 (`git commit -m 'Add some AmazingFeature'`)
+4. 推送到分支 (`git push origin feature/AmazingFeature`)
+5. 开启一个 Pull Request
+
+在提交 Pull Request 之前，请确保您的代码符合我们的编码规范，并且所有测试都已通过。
 
 ## 许可证
 
 本项目采用 MIT 许可证。详情请见 [LICENSE](LICENSE) 文件。
 
-## 作者
-
-- **h7ml** - [GitHub](https://github.com/h7ml)
+## 联系方式
 
-## 致谢
+如有任何问题、建议或反馈，请通过以下方式联系我们：
 
-感谢所有为这个项目做出贡献的开发者。
+- 项目 Issues: [https://github.com/h7ml/juejin-book-downloader/issues](https://github.com/h7ml/juejin-book-downloader/issues)
+- 邮箱: [email protected]
 
----
+## 免责声明
 
-如果您觉得这个项目有用，请给它一个星标 ⭐️
+本扩展程序仅供学习和研究使用。请尊重作者的知识产权，不要将下载的内容用于商业用途或非法传播。使用本扩展程序时，请遵守掘金平台的用户协议和相关法律法规。

e2e/basic.spec.ts

@@ -0,0 +1,23 @@
+import { setupStaticServer } from '@webx-kit/test-utils/playwright';
+import { expect, test } from './context';
+
+const getWebpageURL = setupStaticServer(test);
+
+test('Options Page', async ({ getURL, page }) => {
+  await page.goto(await getURL('options.html'));
+  await expect(page.locator('#root')).toHaveText('Options Page');
+});
+
+test('Popup Page', async ({ getURL, page }) => {
+  await page.goto(await getURL('popup.html'));
+  await expect(page.locator('#root')).toHaveText('Popup Page');
+});
+
+test('Content Scripts', async ({ page }) => {
+  await page.goto(getWebpageURL());
+  await expect(page.locator('webx-root')).toBeInViewport();
+  // await page.locator('body').screenshot({ path: './webx-root.png' });
+  await expect(page.locator('webx-root')).toContainText('Count: 0');
+  await page.locator('webx-root').locator('button').click();
+  await expect(page.locator('webx-root')).toContainText('Count: 1');
+});

e2e/context.ts

@@ -0,0 +1,8 @@
+import path from 'node:path';
+import { createWebxTest } from '@webx-kit/test-utils/playwright';
+
+export const test = createWebxTest({
+  extensionPath: path.resolve(__dirname, '../dist'),
+});
+
+export const { expect } = test;