Conversation
…n Cloze questions
…ze-test) **Issues fixed:** - Backend scoreTest() was not handling nested questions properly - long-text-mc: didn't count nested question.questions array - cloze-mc/cloze-test: didn't count blank entries - Result: scoring 12 questions instead of 30 - Frontend CambridgeResultPage showed 'NaN' for all questions due to key mismatch **Changes:** - Refactored scoreTest() to handle all question types (nested/blanks/regular) - Extracted scoreQuestion() helper for cleaner scoring logic - Added questionNumberMap in CambridgeResultPage to correctly map answer keys to question numbers - Fixed nested question rendering with React.Fragment - Removed duplicate closing divs - Fixed clozParser stripHtmlTags for Node.js compatibility **Result:** - Scoring now correctly calculates all 30 questions - Results page displays correct question numbers without NaN - Teacher result page renders properly
There was a problem hiding this comment.
Pull request overview
PR này cập nhật UI làm bài Cambridge Listening cho học sinh: hiển thị badge A/B/C (và A/B/C/D) rõ ràng cho câu hỏi dạng multichoice, đồng thời chỉnh input Open Cloze để nhập được khoảng trắng và tăng độ rộng input.
Changes:
- Thêm style
optionBadgeđể render nhãn A/B/C/D cho lựa chọn multichoice. - Render badge (A/B/C/D) trong 2 layout hiển thị câu hỏi (full + compact) cho
abc/abcd. - Input Open Cloze: bỏ
.trim()khi nhập và tăngwidthtừ 120px lên 150px.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| frontend/src/features/cambridge/pages/DoCambridgeListeningTest.styles.js | Thêm style optionBadge cho badge lựa chọn. |
| frontend/src/features/cambridge/pages/DoCambridgeListeningTest.jsx | Bỏ trim khi nhập Open Cloze, tăng width input, và render badge cho multichoice. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| type="text" | ||
| value={userAnswer} | ||
| onChange={(e) => handleAnswerChange(questionKey, e.target.value.trim())} | ||
| onChange={(e) => handleAnswerChange(questionKey, e.target.value)} |
There was a problem hiding this comment.
Removing .trim() here allows internal spaces (good for Open Cloze), but it also means leading/trailing whitespace can now be stored in answers. In this file, the local fallback scoring path (calculateLocalResults) compares some string answers without trimming, so a user answer like "New York " may be marked incorrect when the backend submit fails. Consider normalizing answers at submit/scoring time (e.g., trim leading/trailing whitespace) instead of on every onChange.
| onChange={(e) => handleAnswerChange(questionKey, e.target.value)} | |
| onChange={(e) => handleAnswerChange(questionKey, e.target.value.trim())} |
| type="text" | ||
| value={userAnswer} | ||
| onChange={(e) => handleAnswerChange(questionKey, e.target.value.trim())} | ||
| onChange={(e) => handleAnswerChange(questionKey, e.target.value)} |
There was a problem hiding this comment.
Same whitespace concern as above: now that this input stores the raw value, leading/trailing spaces can be persisted and may cause mismatches in the local fallback scoring path where string comparisons are not consistently trimmed. Suggest trimming only at submit/scoring time (preserving internal spaces) to avoid false negatives when offline/fallback scoring is used.
| onChange={(e) => handleAnswerChange(questionKey, e.target.value)} | |
| onChange={(e) => handleAnswerChange(questionKey, e.target.value.trim())} |
| height: '26px', | ||
| marginRight: '10px', | ||
| borderRadius: '6px', | ||
| backgroundColor: colors.primary, |
There was a problem hiding this comment.
optionBadge uses backgroundColor: colors.primary with color: '#ffffff' and a small font size (12px). In dark mode colors.primary is #4a90d9, which yields relatively low contrast with white text for small UI text and may fail WCAG. Consider either using a darker badge background in dark mode or switching the badge text color to a darker color when isDarkMode is true.
| backgroundColor: colors.primary, | |
| backgroundColor: isDarkMode ? '#1e3a5f' : colors.primary, |
|
Build local da chay thanh cong. Ket qua vite build tao output trong frontend/dist/ va chi can deploy thu muc nay len cPanel. Co canh bao chunk > 500 kB (khong loi, chi la canh bao de toi uu). Nhung gi minh vua sua de build chay duoc Doi Vite config sang ESM: frontend/vite.config.mjs (tranh loi ESM plugin) Chunk lon: Vite bao module > 500 kB. Khong anh huong deploy, chi goi y tach chunk neu muon toi uu. |
2 participants
đã thêm badge A/B/C rõ ràng cho dạng multichoice ở UI học sinh:
Thêm style optionBadge trong frontend/src/features/cambridge/pages/DoCambridgeListeningTest.styles.js
Render badge trong multichoice ở frontend/src/features/cambridge/pages/DoCambridgeListeningTest.jsx
Đã sửa để input Open Cloze nhận khoảng trắng và tăng width lên 150px. Cập nhật ở frontend/src/features/cambridge/pages/DoCambridgeListeningTest.jsx.