Initial commit

2026-07-03 16:37:12 +07:00
commit 63b8c1ea8b
1931 changed files with 640587 additions and 0 deletions
--- a/srcs/RobotNet10/Components/RobotNet10.ScriptEditor/FILE_EXPLORER_TEST_CASES.md
+++ b/srcs/RobotNet10/Components/RobotNet10.ScriptEditor/FILE_EXPLORER_TEST_CASES.md
@@ -0,0 +1,691 @@
+# FileExplorer Test Cases
+
+## Tổng quan
+FileExplorer là component chính để hiển thị và quản lý cây thư mục và file trong ScriptEditor. Tài liệu này mô tả các test case cần thiết để đảm bảo component hoạt động đúng.
+
+---
+
+## 1. Test Cases - Hiển thị và Navigation
+
+### TC-001: Hiển thị cây thư mục ban đầu
+**Mô tả:** Kiểm tra FileExplorer hiển thị đúng cấu trúc thư mục và file khi khởi tạo.
+
+**Các bước:**
+1. Khởi động ứng dụng
+2. Quan sát FileExplorer trong sidebar
+
+**Kết quả mong đợi:**
+- Tất cả folders và files ở root level được hiển thị
+- Folders được sắp xếp theo tên (alphabetical)
+- Files được sắp xếp theo tên (alphabetical)
+- Badge warning/error/modified hiển thị đúng cho từng item
+
+---
+
+### TC-002: Expand/Collapse folder
+**Mô tả:** Kiểm tra chức năng mở/đóng folder.
+
+**Các bước:**
+1. Click vào icon expand (▶) của một folder có children
+2. Quan sát folder được expand
+3. Click lại vào icon expand
+4. Quan sát folder được collapse
+
+**Kết quả mong đợi:**
+- Icon expand xoay và đổi thành ▼ khi expanded
+- Icon folder đổi thành mdi-folder-open khi expanded
+- Children (subfolders và files) được hiển thị khi expanded
+- Children được ẩn khi collapsed
+- State expanded/collapsed được giữ nguyên khi folder được re-render
+
+---
+
+### TC-003: Expand/Collapse folder bằng click chuột trái
+**Mô tả:** Kiểm tra logic expand/collapse khi click vào folder.
+
+**Các bước:**
+1. Click chuột trái vào một folder chưa được selected
+2. Click chuột trái lại vào cùng folder đó (đã selected)
+3. Quan sát hành vi expand/collapse
+
+**Kết quả mong đợi:**
+- Click lần 1: Folder được select, không expand/collapse
+- Click lần 2: Folder đã selected, toggle expand/collapse (nếu có children)
+
+---
+
+### TC-004: Click chuột phải vào folder
+**Mô tả:** Kiểm tra context menu khi click chuột phải vào folder.
+
+**Các bước:**
+1. Click chuột phải vào một folder
+2. Quan sát context menu
+
+**Kết quả mong đợi:**
+- Context menu hiển thị với các options:
+  - Create Folder
+  - Create File
+  - Rename
+  - Delete
+- Folder được select
+- Không toggle expand/collapse
+
+---
+
+## 2. Test Cases - Selection
+
+### TC-005: Select folder
+**Mô tả:** Kiểm tra chức năng select folder.
+
+**Các bước:**
+1. Click chuột trái vào một folder
+2. Quan sát UI
+
+**Kết quả mong đợi:**
+- Radio button của folder được checked
+- `Workspace.SelectedFolder` được set đúng
+- Radio button của các folder khác được uncheck
+
+---
+
+### TC-006: Select file
+**Mô tả:** Kiểm tra chức năng select file.
+
+**Các bước:**
+1. Click chuột trái vào một file
+2. Quan sát UI
+
+**Kết quả mong đợi:**
+- Radio button của file được checked
+- `Workspace.SelectedFile` được set đúng
+- Radio button của các file/folder khác được uncheck
+
+---
+
+### TC-007: Clear selection khi click vào phần trống
+**Mô tả:** Kiểm tra clear selection khi click vào phần trống của FileExplorer.
+
+**Các bước:**
+1. Select một folder hoặc file
+2. Click chuột trái vào phần trống trong FileExplorer (không phải folder/file)
+3. Quan sát UI
+
+**Kết quả mong đợi:**
+- `Workspace.SelectedFolder` = null
+- `Workspace.SelectedFile` = null
+- Tất cả radio buttons được uncheck
+
+---
+
+### TC-008: Reset selection bằng Esc key
+**Mô tả:** Kiểm tra reset selection khi nhấn Esc.
+
+**Các bước:**
+1. Select một folder hoặc file
+2. Nhấn phím Esc
+3. Quan sát UI
+
+**Kết quả mong đợi:**
+- `Workspace.SelectedFolder` = null
+- `Workspace.SelectedFile` = null
+- Tất cả radio buttons được uncheck
+- Hoạt động từ mọi nơi trong ứng dụng (không chỉ trong FileExplorer)
+
+---
+
+## 3. Test Cases - Tạo mới Folder/File
+
+### TC-009: Tạo folder từ header button
+**Mô tả:** Kiểm tra tạo folder từ button "Add Folder" ở header.
+
+**Các bước:**
+1. Click vào button "Add Folder" (folder-plus icon) ở header
+2. Nhập tên folder trong dialog
+3. Click "Create"
+
+**Kết quả mong đợi:**
+- Folder được tạo trong `SelectedFolder` nếu có, nếu không thì ở root level
+- Folder xuất hiện trong FileExplorer ngay lập tức
+- Folder được sắp xếp đúng vị trí (alphabetical)
+- Nếu folder cha đang collapsed, tự động expand để hiển thị folder mới
+
+---
+
+### TC-010: Tạo file từ header button
+**Mô tả:** Kiểm tra tạo file từ button "Add File" ở header.
+
+**Các bước:**
+1. Click vào button "Add File" (file-plus icon) ở header
+2. Nhập tên file trong dialog (phải có extension .cs)
+3. Click "Create"
+
+**Kết quả mong đợi:**
+- File được tạo trong `SelectedFolder` nếu có, nếu không thì ở root level
+- File xuất hiện trong FileExplorer ngay lập tức
+- File được sắp xếp đúng vị trí (alphabetical)
+- Nếu folder cha đang collapsed, tự động expand để hiển thị file mới
+
+---
+
+### TC-011: Tạo folder từ context menu của folder
+**Mô tả:** Kiểm tra tạo folder từ context menu khi click chuột phải vào folder.
+
+**Các bước:**
+1. Click chuột phải vào một folder
+2. Chọn "Create Folder" từ context menu
+3. Nhập tên folder trong dialog
+4. Click "Create"
+
+**Kết quả mong đợi:**
+- Folder được tạo trong folder được click chuột phải
+- Folder xuất hiện trong FileExplorer ngay lập tức
+- Folder cha tự động expand nếu đang collapsed
+
+---
+
+### TC-012: Tạo file từ context menu của folder
+**Mô tả:** Kiểm tra tạo file từ context menu khi click chuột phải vào folder.
+
+**Các bước:**
+1. Click chuột phải vào một folder
+2. Chọn "Create File" từ context menu
+3. Nhập tên file trong dialog
+4. Click "Create"
+
+**Kết quả mong đợi:**
+- File được tạo trong folder được click chuột phải
+- File xuất hiện trong FileExplorer ngay lập tức
+- Folder cha tự động expand nếu đang collapsed
+
+---
+
+### TC-013: Tạo folder từ context menu phần trống
+**Mô tả:** Kiểm tra tạo folder ở root level từ context menu khi click chuột phải vào phần trống.
+
+**Các bước:**
+1. Click chuột phải vào phần trống trong FileExplorer (không phải folder/file)
+2. Chọn "Create Folder" từ context menu
+3. Nhập tên folder trong dialog
+4. Click "Create"
+
+**Kết quả mong đợi:**
+- Folder được tạo ở root level (`Workspace.Folders`)
+- Folder xuất hiện trong FileExplorer ngay lập tức
+- Không phụ thuộc vào `SelectedFolder`
+
+---
+
+### TC-014: Tạo file từ context menu phần trống
+**Mô tả:** Kiểm tra tạo file ở root level từ context menu khi click chuột phải vào phần trống.
+
+**Các bước:**
+1. Click chuột phải vào phần trống trong FileExplorer (không phải folder/file)
+2. Chọn "Create File" từ context menu
+3. Nhập tên file trong dialog
+4. Click "Create"
+
+**Kết quả mong đợi:**
+- File được tạo ở root level (`Workspace.Files`)
+- File xuất hiện trong FileExplorer ngay lập tức
+- Không phụ thuộc vào `SelectedFolder`
+
+---
+
+## 4. Test Cases - Xóa Folder/File
+
+### TC-015: Xóa file
+**Mô tả:** Kiểm tra xóa file từ context menu.
+
+**Các bước:**
+1. Click chuột phải vào một file
+2. Chọn "Delete" từ context menu
+3. Xác nhận xóa trong dialog
+4. Quan sát UI
+
+**Kết quả mong đợi:**
+- File được xóa khỏi server
+- File biến mất khỏi FileExplorer ngay lập tức (không cần refresh)
+- Parent folder cập nhật `IsModified`, `WarningCount`, `ErrorCount` đúng
+- Nếu file đang được mở trong editor, editor được clear
+
+---
+
+### TC-016: Xóa folder
+**Mô tả:** Kiểm tra xóa folder từ context menu.
+
+**Các bước:**
+1. Click chuột phải vào một folder
+2. Chọn "Delete" từ context menu
+3. Xác nhận xóa trong dialog
+4. Quan sát UI
+
+**Kết quả mong đợi:**
+- Folder và tất cả nội dung bên trong được xóa khỏi server
+- Folder biến mất khỏi FileExplorer ngay lập tức
+- Parent folder cập nhật `IsModified`, `WarningCount`, `ErrorCount` đúng
+
+---
+
+### TC-017: Xóa file từ client khác
+**Mô tả:** Kiểm tra UI cập nhật khi file được xóa từ client khác (SignalR event).
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, xóa một file
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- File biến mất khỏi FileExplorer trên client 2
+- Parent folder cập nhật đúng
+
+---
+
+### TC-018: Xóa folder từ client khác
+**Mô tả:** Kiểm tra UI cập nhật khi folder được xóa từ client khác (SignalR event).
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, xóa một folder
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- Folder biến mất khỏi FileExplorer trên client 2
+- Parent folder cập nhật đúng
+
+---
+
+## 5. Test Cases - Rename
+
+### TC-019: Rename folder
+**Mô tả:** Kiểm tra đổi tên folder.
+
+**Các bước:**
+1. Click chuột phải vào một folder
+2. Chọn "Rename" từ context menu
+3. Nhập tên mới trong dialog
+4. Click "Rename"
+
+**Kết quả mong đợi:**
+- Folder được rename trên server
+- Tất cả files và subfolders bên trong được di chuyển đến folder mới
+- Folder cũ được xóa
+- UI cập nhật với tên mới
+- Path của tất cả children được cập nhật đúng
+
+---
+
+### TC-020: Rename file
+**Mô tả:** Kiểm tra đổi tên file.
+
+**Các bước:**
+1. Click chuột phải vào một file
+2. Chọn "Rename" từ context menu
+3. Nhập tên mới trong dialog (phải có extension .cs)
+4. Click "Rename"
+
+**Kết quả mong đợi:**
+- File được rename trên server
+- UI cập nhật với tên mới
+- Path của file được cập nhật đúng
+- Nếu file đang được mở trong editor, editor cập nhật đúng
+
+---
+
+## 6. Test Cases - Badge và Status
+
+### TC-021: Hiển thị warning badge
+**Mô tả:** Kiểm tra badge warning hiển thị đúng.
+
+**Các bước:**
+1. Tạo một file có warning (ví dụ: unused variable)
+2. Quan sát badge warning
+
+**Kết quả mong đợi:**
+- Badge warning hiển thị trên file có warning
+- Số lượng warning hiển thị đúng
+- Badge warning hiển thị trên tất cả parent folders với tổng số warning từ children
+
+---
+
+### TC-022: Hiển thị error badge
+**Mô tả:** Kiểm tra badge error hiển thị đúng.
+
+**Các bước:**
+1. Tạo một file có error (ví dụ: syntax error)
+2. Quan sát badge error
+
+**Kết quả mong đợi:**
+- Badge error hiển thị trên file có error
+- Số lượng error hiển thị đúng
+- Badge error hiển thị trên tất cả parent folders với tổng số error từ children
+
+---
+
+### TC-023: Hiển thị modified badge
+**Mô tả:** Kiểm tra badge modified hiển thị đúng.
+
+**Các bước:**
+1. Mở một file và sửa nội dung
+2. Quan sát badge modified
+
+**Kết quả mong đợi:**
+- Badge modified (●) hiển thị trên file đã modified
+- Badge modified hiển thị trên tất cả parent folders nếu có file/folder con đã modified
+- Badge modified biến mất sau khi save file
+
+---
+
+### TC-024: Cập nhật badge khi file được sửa
+**Mô tả:** Kiểm tra badge được cập nhật khi file được sửa.
+
+**Các bước:**
+1. Mở một file trong editor
+2. Sửa nội dung file (thêm warning hoặc error)
+3. Quan sát badge trên file và parent folders
+
+**Kết quả mong đợi:**
+- Badge warning/error được cập nhật ngay lập tức trên file
+- Badge trên parent folders được cập nhật ngay lập tức
+- Tất cả grandparent folders cũng được cập nhật
+
+---
+
+### TC-025: Cập nhật badge khi file được save
+**Mô tả:** Kiểm tra badge modified biến mất sau khi save.
+
+**Các bước:**
+1. Sửa một file
+2. Save file (Ctrl+S)
+3. Quan sát badge modified
+
+**Kết quả mong đợi:**
+- Badge modified biến mất trên file
+- Badge modified biến mất trên parent folders nếu không còn file/folder con nào modified
+
+---
+
+## 7. Test Cases - Event Handling
+
+### TC-026: FileCreated event từ SignalR
+**Mô tả:** Kiểm tra UI cập nhật khi file được tạo từ client khác.
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, tạo một file mới
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- File xuất hiện trong FileExplorer trên client 2
+- Parent folder tự động expand nếu đang collapsed
+
+---
+
+### TC-027: FolderCreated event từ SignalR
+**Mô tả:** Kiểm tra UI cập nhật khi folder được tạo từ client khác.
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, tạo một folder mới
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- Folder xuất hiện trong FileExplorer trên client 2
+- Parent folder tự động expand nếu đang collapsed
+
+---
+
+### TC-028: FileDeleted event từ SignalR
+**Mô tả:** Kiểm tra UI cập nhật khi file được xóa từ client khác.
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, xóa một file
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- File biến mất khỏi FileExplorer trên client 2
+- Parent folder cập nhật badge đúng
+
+---
+
+### TC-029: FolderDeleted event từ SignalR
+**Mô tả:** Kiểm tra UI cập nhật khi folder được xóa từ client khác.
+
+**Các bước:**
+1. Mở ứng dụng trên 2 clients
+2. Trên client 1, xóa một folder
+3. Quan sát UI trên client 2
+
+**Kết quả mong đợi:**
+- Folder biến mất khỏi FileExplorer trên client 2
+- Parent folder cập nhật badge đúng
+
+---
+
+## 8. Test Cases - Edge Cases và Bug Fixes
+
+### TC-030: IsExpanded state được giữ khi folder được re-render
+**Mô tả:** Kiểm tra state expanded/collapsed được giữ đúng khi folder được tái sử dụng.
+
+**Các bước:**
+1. Expand một folder
+2. Tạo một file mới trong folder khác
+3. Quan sát folder đã expand vẫn giữ nguyên state
+
+**Kết quả mong đợi:**
+- Folder đã expand vẫn giữ nguyên state expanded
+- State không bị nhầm lẫn với folder khác
+
+---
+
+### TC-031: Aggregation của badges khi load ban đầu
+**Mô tả:** Kiểm tra badges được tổng hợp đúng khi load workspace ban đầu.
+
+**Các bước:**
+1. Khởi động ứng dụng với workspace có nhiều folders và files
+2. Quan sát badges trên các folders
+
+**Kết quả mong đợi:**
+- Tất cả folders hiển thị đúng tổng số warning/error từ children
+- Tất cả folders hiển thị đúng trạng thái modified nếu có children modified
+
+---
+
+### TC-032: Propagation của IsModified lên parent folders
+**Mô tả:** Kiểm tra IsModified được propagate đúng lên tất cả parent folders.
+
+**Các bước:**
+1. Mở một file trong subfolder (nested nhiều level)
+2. Sửa file
+3. Save file
+4. Quan sát badges trên tất cả parent folders
+
+**Kết quả mong đợi:**
+- File hiển thị modified badge khi sửa
+- Tất cả parent folders hiển thị modified badge khi file được sửa
+- Tất cả parent folders biến mất modified badge khi file được save
+
+---
+
+### TC-033: Propagation của WarningCount và ErrorCount lên parent folders
+**Mô tả:** Kiểm tra WarningCount và ErrorCount được propagate đúng lên tất cả parent folders.
+
+**Các bước:**
+1. Tạo một file có warning/error trong subfolder (nested nhiều level)
+2. Quan sát badges trên tất cả parent folders
+
+**Kết quả mong đợi:**
+- File hiển thị đúng số lượng warning/error
+- Tất cả parent folders hiển thị tổng số warning/error từ tất cả children
+- Grandparent folders cũng được cập nhật đúng
+
+---
+
+### TC-034: Context menu không hiển thị context menu của browser
+**Mô tả:** Kiểm tra context menu của browser không hiển thị khi click chuột phải vào phần trống.
+
+**Các bước:**
+1. Click chuột phải vào phần trống trong FileExplorer
+2. Quan sát
+
+**Kết quả mong đợi:**
+- Chỉ hiển thị context menu của ứng dụng
+- Không hiển thị context menu của browser
+
+---
+
+### TC-035: Context menu hiển thị đúng vị trí click chuột phải
+**Mô tả:** Kiểm tra context menu hiển thị tại vị trí click chuột phải.
+
+**Các bước:**
+1. Click chuột phải vào phần trống ở các vị trí khác nhau
+2. Quan sát vị trí context menu
+
+**Kết quả mong đợi:**
+- Context menu hiển thị tại vị trí con trỏ chuột
+- Vị trí chính xác, không bị lệch
+
+---
+
+### TC-036: Esc key hoạt động từ mọi nơi
+**Mô tả:** Kiểm tra Esc key reset selection từ mọi nơi trong ứng dụng.
+
+**Các bước:**
+1. Select một file hoặc folder
+2. Click vào editor hoặc console
+3. Nhấn Esc
+4. Quan sát FileExplorer
+
+**Kết quả mong đợi:**
+- Selection được reset
+- Radio buttons được uncheck
+- Hoạt động từ mọi nơi, không chỉ trong FileExplorer
+
+---
+
+## 9. Test Cases - Performance
+
+### TC-037: UI không bị lag khi gõ text trong editor
+**Mô tả:** Kiểm tra UI không bị lag khi gõ text.
+
+**Các bước:**
+1. Mở một file trong editor
+2. Gõ text liên tục
+3. Quan sát UI
+
+**Kết quả mong đợi:**
+- UI không bị lag hoặc freeze
+- Text hiển thị ngay lập tức khi gõ
+- Badges được cập nhật mượt mà
+
+---
+
+### TC-038: Performance khi có nhiều files và folders
+**Mô tả:** Kiểm tra performance khi workspace có nhiều items.
+
+**Các bước:**
+1. Tạo nhiều folders và files (100+ items)
+2. Expand/collapse folders
+3. Scroll trong FileExplorer
+4. Quan sát performance
+
+**Kết quả mong đợi:**
+- UI vẫn responsive
+- Scroll mượt mà
+- Expand/collapse không bị lag
+
+---
+
+## 10. Test Cases - Integration
+
+### TC-039: Tích hợp với Editor
+**Mô tả:** Kiểm tra FileExplorer tích hợp đúng với Editor.
+
+**Các bước:**
+1. Click vào một file trong FileExplorer
+2. Quan sát Editor
+
+**Kết quả mong đợi:**
+- File được mở trong Editor
+- Editor hiển thị đúng nội dung file
+- CurrentFile được set đúng
+
+---
+
+### TC-040: Tích hợp với Workspace
+**Mô tả:** Kiểm tra FileExplorer đồng bộ đúng với Workspace state.
+
+**Các bước:**
+1. Thực hiện các thao tác (tạo, xóa, rename) trong FileExplorer
+2. Kiểm tra Workspace state
+
+**Kết quả mong đợi:**
+- Workspace.Folders và Workspace.Files được cập nhật đúng
+- Workspace.SelectedFolder và Workspace.SelectedFile được set đúng
+- Workspace.RootChanged event được trigger đúng
+
+---
+
+## Checklist Test Execution
+
+### Pre-conditions
+- [ ] Ứng dụng đã được build thành công
+- [ ] Server đang chạy
+- [ ] Database có dữ liệu test (folders và files)
+
+### Test Environment
+- [ ] Browser: Chrome/Firefox/Edge (latest version)
+- [ ] Screen resolution: 1920x1080 hoặc tương đương
+- [ ] Network: Stable connection
+
+### Test Execution Notes
+- Ghi chú các bug phát hiện trong quá trình test
+- Ghi lại screenshots cho các test case failed
+- Ghi lại performance metrics nếu có vấn đề
+
+---
+
+## Known Issues và Limitations
+
+### Đã Fix
+- ✅ IsModified không propagate lên parent folders khi save file
+- ✅ WarningCount và ErrorCount không được tổng hợp đúng khi load ban đầu
+- ✅ UI không cập nhật khi xóa file/folder
+- ✅ IsExpanded state bị nhầm lẫn giữa các folder instances
+- ✅ Context menu hiển thị sai vị trí và hiển thị cả browser context menu
+- ✅ Esc key không uncheck radio buttons
+
+### Cần theo dõi
+- Performance khi có quá nhiều files/folders (>1000 items)
+- Memory leak khi tạo/xóa nhiều items liên tục
+
+---
+
+## Test Priority
+
+### High Priority (P0)
+- TC-001, TC-002, TC-005, TC-006, TC-009, TC-010, TC-015, TC-016, TC-031, TC-032, TC-033
+
+### Medium Priority (P1)
+- TC-003, TC-004, TC-007, TC-008, TC-011, TC-012, TC-013, TC-014, TC-019, TC-020, TC-021, TC-022, TC-023, TC-024, TC-025
+
+### Low Priority (P2)
+- TC-017, TC-018, TC-026, TC-027, TC-028, TC-029, TC-030, TC-034, TC-035, TC-036, TC-037, TC-038, TC-039, TC-040
+
+---
+
+## Test Results Template
+
+```
+Test Case ID: TC-XXX
+Test Date: YYYY-MM-DD
+Tester: [Name]
+Status: Pass/Fail/Blocked
+Notes: [Any additional notes]
+Screenshots: [If applicable]
+```
+
+---
+
+*Tài liệu này được tạo tự động và cần được cập nhật khi có thay đổi trong FileExplorer component.*
+