QUYVN/I150
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
63b8c1ea8b6e2b159ef6aac621c4bf915d6700f6
I150/srcs/RobotNet10/Components/RobotNet10.ScriptEditor/FILE_EXPLORER_TEST_CASES.md
QUYVN 63b8c1ea8b Initial commit
2026-07-03 16:37:12 +07:00

21 KiB
Raw Blame History

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.

Reference in New Issue View Git Blame Copy Permalink