【前端強化篇】完善 TestCase 編輯器：支持 API 結構化定義與斷言配置
- 前言
- 準備工作
- 第一步：更新前端 `TestCase` 類型定義
- 第二步：改造 `TestCaseEditView.vue` 表單
- 第三步：修改后端代碼中的TestCase模型和序列化器
- 第四步：測試強化后的用例編輯器
- 總結
前言
在之前的后端文章《【測試執行】讓測試跑起來：API 接口測試執行器設計與實現》中，我們對 TestCase 模型進行了重大升級，添加了用于定義 API 測試的結構化字段，如 request_method, request_url, request_headers, request_body 和 assertions。但是，我們的前端測試用例編輯頁面 (TestCaseEditView.vue) 仍是基于早期手動測試用例設計的，主要依賴 steps_text 來描述步驟。
這篇文章的目標是徹底改造 TestCaseEditView.vue，使其能夠：
- 支持用戶輸入和編輯所有新的 API 測試相關字段。
- 提供用戶友好的界面來管理復雜的結構化數據，例如動態的請求頭鍵值對和多條斷言規則。
- 確保前端提交的數據格式與后端
TestCaseSerializer和測試執行器期望的一致。 - 在編輯模式下，能夠正確地從后端加載并回顯這些結構化數據。
一個強大的 API 測試用例編輯器&
