What happened?
Neither field on the join screen is trimmed.
apps/frontend/src/screens/JoinQuiz.tsx:74:
onChange={e => setCode(e.target.value.toUpperCase())}
The value is uppercased but never trimmed, and the input has maxLength={6}.
So a code copied from chat or a slide as "XY3F12 " becomes "XY3F12" plus a
space — except the space consumes one of the six allowed characters, leaving
"XY3F12" truncated to "XY3F1 ". The lookup then fails.
The error the participant sees is "Quiz not found", which tells them the code
is wrong. It is not wrong; it is their clipboard. They will re-type it, possibly
several times, while the quiz starts without them.
The same applies to the nickname at line 86 — " bob" is accepted and shows up
padded on the leaderboard.
Fix. Trim on input or on submit:
onChange={e => setCode(e.target.value.trim().toUpperCase())}
Trim the username too, and reject one that is empty after trimming — currently
" " passes the if (!code || !username) check because a whitespace string is
truthy.
Consider also stripping non-alphanumeric characters from the code, since the
generated alphabet is A-Z0-9 only (apps/http-server/src/utils/code.ts).
Steps to reproduce
Definition of done:
- A code pasted with leading or trailing whitespace joins successfully
- A whitespace-only nickname is rejected with a clear message
- Leaderboard names have no stray padding
Small and self-contained, but it fixes a real point where first-time users give
up. Worth trimming server-side as well — see the note in the backend list.
Which part of Rexial?
frontend (React)
How are you running Rexial?
Docker Compose (docker-compose up)
Logs or error output
Environment
No response
Before submitting
What happened?
Neither field on the join screen is trimmed.
apps/frontend/src/screens/JoinQuiz.tsx:74:The value is uppercased but never trimmed, and the input has
maxLength={6}.So a code copied from chat or a slide as
"XY3F12 "becomes"XY3F12"plus aspace — except the space consumes one of the six allowed characters, leaving
"XY3F12"truncated to"XY3F1 ". The lookup then fails.The error the participant sees is "Quiz not found", which tells them the code
is wrong. It is not wrong; it is their clipboard. They will re-type it, possibly
several times, while the quiz starts without them.
The same applies to the nickname at line 86 —
" bob"is accepted and shows uppadded on the leaderboard.
Fix. Trim on input or on submit:
Trim the username too, and reject one that is empty after trimming — currently
" "passes theif (!code || !username)check because a whitespace string istruthy.
Consider also stripping non-alphanumeric characters from the code, since the
generated alphabet is
A-Z0-9only (apps/http-server/src/utils/code.ts).Steps to reproduce
Definition of done:
Small and self-contained, but it fixes a real point where first-time users give
up. Worth trimming server-side as well — see the note in the backend list.
Which part of Rexial?
frontend (React)
How are you running Rexial?
Docker Compose (docker-compose up)
Logs or error output
Environment
No response
Before submitting