Quiz exercises: Prevent misleading post-quiz UI states after working time expiration

[jerrycai0006]

Summary

This PR improves the quiz UI after working time expiration to avoid misleading states when results are not yet available, while keeping the overall UI behavior consistent with the previous implementation.

Checklist

General

• I tested all changes and their related features with all corresponding user types on a test server.

• Language: I followed the guidelines for inclusive, diversity-sensitive, and appreciative language.
• I chose a title conforming to the naming conventions for pull requests.

Client

• Important: I implemented the changes with a very good performance, prevented too many (unnecessary) REST calls and made sure the UI is responsive, even with large data (e.g. using paging).

• I strictly followed the client coding guidelines.
• I strictly followed the AET UI-UX guidelines.

• I added multiple integration tests (Jest) related to the features (with a high test coverage), while following the test guidelines.

• I documented the TypeScript code using JSDoc style.
• I added multiple screenshots/screencasts of my UI changes.

Motivation and Context

After the working time of a quiz expires, participations without a manual submit keep submission.submitted = false until the due date, where the server finalizes the submission during result calculation.

Since the quiz UI heavily relies on this flag, affected students can see misleading post-quiz states such as
“The quiz has ended. Please wait. If the results do not load automatically within 60s, please refresh the page.”
, even though results are intentionally not available until the due date.
By contrast, students who submit manually immediately see a clear indication of when results will become available.

This discrepancy is confusing from a student’s perspective, as in both cases answers may already be saved, but the UI presents different states depending on the submit path.

Related issue: #12001

Description

This PR applies a UI-only fix to improve the post-quiz state handling without changing server semantics.

The client no longer treats submission.submitted as the sole indicator for post-quiz UI states. Instead, it distinguishes between untouched participations, answered but not manually submitted quizzes, and finalized submissions.

In particular, the UI:

• treats answered participations as submitted for UI purposes when the working time expires, using a client-side auto-submit
• displays “Results available: ” only for participations with at least one provided answer, preserving consistency with the previous UI behavior
• shows the same success banner for timeout auto-submit as for manual submit

The overall UI behavior is kept as close as possible to the previous implementation, while preventing misleading or dead post-quiz states.

Steps for Testing

Prerequisites

• 1 Instructor account
• A course with quiz exercises enabled

Setup

1. Log in to Artemis as an instructor.
2. Navigate to Course Administration.
3. Create a new quiz exercise.
4. Set the quiz mode to Batched or Individual.
5. Set the Due Date to a time in the future.
6. Set the Duration to a short value (e.g. 10–20 seconds).
7. Start the quiz.

Test Scenarios

A. Manual submit

1. Join the quiz as a student.
2. Select at least one answer.
3. Click Submit before the working time expires.

Expected result:

• A success banner is shown.
• The top-right area displays
  “Results available: ”.

---

B. Timeout auto-submit with answers

1. Join the quiz as a student.
2. Select at least one answer.
3. Do not manually submit.
4. Wait until the working time expires.

Expected result:

• The submission is auto-submitted.
• A success banner is shown.
• The top-right area displays
  “Results available: ”.

---

C. Close tab after answering (no manual submit)

C1. Short duration (10–20s, autosave may not complete)

1. Join the quiz as a student.
2. Select at least one answer.
3. Close the browser tab before submitting.
4. Reopen the quiz after the working time expires.

Expected result:

• The quiz is treated as not successfully participated.
• The UI displays
  “The quiz has ended and you did not participate. There are no results to display.”
• The top-right area shows
  “Time left: Quiz has ended!”.

---

C2. Longer duration (40s, autosave completed)

1. Set the quiz Duration to 40 seconds.
2. Join the quiz as a student.
3. Select at least one answer.
4. Wait until the autosave indicator in the bottom-left changes from
   “Saved never” to “Saved just now”.
5. Close the browser tab without manually submitting.
6. Reopen the quiz after the working time expires.

Expected result:

• The previous answers are present.
• The submission is treated as answered for UI purposes.
• The top-right area displays
  “Results available: ” (e.g. Jan 30, 2026 21:55).

---

D. No interaction

1. Join the quiz as a student.
2. Do not select any answer.
3. Wait until the working time expires.

Expected result:

• No auto-submit is triggered.
• The UI displays
  “The quiz has ended and you did not participate. There are no results to display.”
• The top-right area shows
  “Time left: Quiz has ended!”.

E. Synchronized quiz mode

E1. Manual submit

1. Set the quiz mode to Synchronized.
2. Start the quiz.
3. Join the quiz as a student.
4. Select at least one answer.
5. Click Submit before the working time expires.

Expected result:

• A green success banner is shown:

  Your answers have been successfully submitted.
  The results will appear after the quiz has ended.
  If the results are not displayed automatically within 60 seconds after the end of the quiz, please reload the page.

• After a short delay, the results are displayed automatically.

---

E2. Timeout auto-submit with answers

1. Set the quiz mode to Synchronized.
2. Start the quiz.
3. Join the quiz as a student.
4. Select at least one answer.
5. Do not manually submit.
6. Wait until the working time expires.

Expected result:

• A banner is shown:

  The quiz has ended. Please wait. If the results do not load automatically within 60s, please refresh the page.

• After a short delay, the results are displayed automatically.

---

E3. Close tab after answering (no manual submit)

E3.1 Short duration (10–20s, autosave may not complete)

1. Set the quiz mode to Synchronized.
2. Start the quiz.
3. Join the quiz as a student.
4. Select at least one answer.
5. Close the browser tab before submitting.
6. Reopen the quiz after the working time expires.

Expected result:

• Initially, the UI displays:

  The quiz has ended and you did not participate. There are no results to display.

• After a short delay, the results are still displayed.
• This behavior matches the current (existing) Artemis behavior for synchronized quizzes.

---

E3.2 Longer duration (40s, autosave completed)

1. Set the quiz mode to Synchronized.
2. Set the quiz Duration to 40 seconds.
3. Start the quiz.
4. Join the quiz as a student.
5. Select at least one answer.
6. Wait until the autosave indicator in the bottom-left changes from
   “Saved never” to “Saved just now”.
7. Close the browser tab without manually submitting.
8. Reopen the quiz after the working time expires.

Expected result:

• The submission is treated as answered.
• One of the following behaviors is observed:
  • Same behavior as in E2 (opening the quiz before the result is calculated, < 1s — no need to test this explicitly):
    • After a short delay, the results are displayed automatically.
  • Or the results are displayed immediately.

---

E4. No interaction

1. Set the quiz mode to Synchronized.
2. Start the quiz.
3. Join the quiz as a student.
4. Do not select any answer.
5. Wait until the working time expires.

Expected result:

• Initially, the UI displays:

  The quiz has ended and you did not participate. There are no results to display.

• After a short delay, the results are still displayed.
• This behavior matches the current (existing) Artemis behavior for synchronized quizzes.

Testserver States

You can manage test servers using Helios. Check environment statuses in the environment list. To deploy to a test server, go to the CI/CD page, find your PR or branch, and trigger the deployment.

Review Progress

Code Review

• Code Review 1
• Code Review 2

Manual Tests

• Test 1
• Test 2

Test Coverage

Client

Class/File	Line Coverage	Lines	Expects	Ratio
quiz-participation.component.ts	79.64%	786	73	9.3

Last updated: 2026-01-27 01:59:21 UTC

Screenshots

Screenshot for A, B, C2

Screenshot for C1, D, E3.1, E4

Screenshot for E1

Summary by CodeRabbit

• New Features

  • Improved live countdown with time-critical styling and additional overlays for synchronized mode and “successfully submitted” feedback.
  • UI now treats a quiz as submitted after timeout when answers exist, updating button state and submission-related displays.

• Bug Fixes

  • Auto-submit refined to only proceed when answers or submission metadata exist.
  • Due date and result displays adjusted for timing and submission conditions.

• Tests

  • Added unit tests covering answer detection and UI submission state.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[github-actions]

@jerrycai0006 Test coverage has been automatically updated in the PR description.

[coderabbitai]

Walkthrough

Updates adjust quiz participation UI timing and overlay logic, add detection of any provided answers, and introduce a UI-level submitted state getter that alters button/display behavior and success alert logic when time expires or submission exists.

Changes

Cohort / File(s)	Summary
Template UI Display src/main/webapp/app/quiz/overview/participation/quiz-participation.component.html	Tightens countdown guards (requires remainingTimeSeconds >= 0), adds a live countdown branch for time-elapsed-without-answers, moves due-date/result display branches, switches submit button binding to shouldTreatAsSubmittedForUi and updates disable/title logic, refines live/wait instruction conditions, and expands overlay branches (not-participated, synchronized info, successfully-submitted).
Component Logic src/main/webapp/app/quiz/overview/participation/quiz-participation.component.ts	Adds hasAnyAnswer() to detect any user-provided answers and a get shouldTreatAsSubmittedForUi() getter to treat timeout-with-answers or server-submitted as submitted for UI; adds conditional success alert display on quiz end when answers exist and mode is not SYNCHRONIZED.
Test Coverage src/main/webapp/app/quiz/overview/participation/quiz-participation.component.spec.ts	Adds tests for hasAnyAnswer() (false/true cases) and multiple shouldTreatAsSubmittedForUi scenarios (submitted, timeout with/without answers, submissionDate/id cases).

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main change: preventing misleading UI states in quiz exercises after working time expiration, which aligns with the primary objective of the PR.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch bugfix/quiz-auto-submit-on-timeout

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

@jerrycai0006 Test coverage could not be fully measured because some tests failed. Please check the workflow logs for details.

[github-actions]

End-to-End (E2E) Test Results Summary

	Tests	Passed ☑️	Skipped ⚠️	Failed ❌️	Time ⏱
End-to-End (E2E) Test Report	223 ran	221 passed	1 skipped	1 failed	1h 41m 41s 385ms

Test	Result	Time ⏱
End-to-End (E2E) Test Report
e2e/course/CourseMessages.spec.ts
ts.Course messages › Channel messages › Write/edit/delete message in channel › Student should be able to write message in channel	❌ failure	2m 21s 890ms

[github-actions]

@jerrycai0006 Test coverage has been automatically updated in the PR description.

[github-actions]

@jerrycai0006 Test coverage has been automatically updated in the PR description.

[github-actions]

End-to-End (E2E) Test Results Summary

	Tests	Passed ☑️	Skipped ⚠️	Failed ❌️	Time ⏱
End-to-End (E2E) Test Report	223 ran	221 passed	1 skipped	1 failed	1h 45m 17s 329ms

Test	Result	Time ⏱
End-to-End (E2E) Test Report
e2e/atlas/LearningPathManagement.spec.ts
ts.Learning Path Management › Create simple learning path	❌ failure	24s 163ms

[hanna20022005]

Decided to split up this PR testing with the rest of the testing session participants, my part worked fine ^^

Case B - test user 4 on ts 3

Case C - test user 4 on ts 3

Case D - test user 1 on ts 3
https://github.com/user-attachments/assets/e20c909a-661c-4032-81c5-b6d8f2e98ed8

[oTaczkowski]

Tested the steps on TS3, the behaviour matches the expectations.

[lana-ati]

Tested during working session on TS3. Worked as expected.

[kristi-balla]

Tested on t3 with @oTaczkowski @lana-ati and @hanna20022005. This PR took incredibly long to test, the steps were too many and covered too many different edge cases.

[ilgintaseli]

Tested everything myself on TS3. One very small difference was "E2. Timeout auto-submit with answers case" did result in the picture below for me instead of a green banner. I tried it 3 times and each was the same. However after a short delay, the results were displayed automatically as expected.

[jerrycai0006]

Tested everything myself on TS3. One very small difference was "E2. Timeout auto-submit with answers case" did result in the picture below for me instead of a green banner. I tried it 3 times and each was the same. However after a short delay, the results were displayed automatically as expected.

Sorry for the confusion, that was on me.

I re-tested this on Test Server 4 without this PR applied, and locally with this PR applied. After double-checking, I realized that my description of the observed test result was inaccurate and misleading.

The actual behavior is correct. Apologies again for the confusion.

Thanks a lot for testing this and for pointing it out.

[kevinfischer4]

Tested on TS3, all cases have the expected behaviour. Code LGTM 👍🏼