Skip to content

Add a copy button to the final report - #457

Open
yansawu wants to merge 2 commits into
sysprog21:mainfrom
yansawu:add-report-copy-code
Open

yansawu wants to merge 2 commits into
sysprog21:mainfrom
yansawu:add-report-copy-code

Conversation

@yansawu

@yansawu yansawu commented Oct 23, 2026 •

Copy link
Copy Markdown

User currently have to select their submitted code manually to copy it from the final report. Add a Copy code button beside Your final code, preserve the original whitespace and line breaks, and show brief success or error feedback.

Hide the button when code is unavailable, including reports containing the unsaved-code placeholder. Code persistence remains unchanged.

Automated tests cover successful copying, clipboard errors, unavailable code, and repeated clicks while copying.

Closes #318


Summary by cubic

Adds a Copy code button next to "Your final code" in the report so candidates no longer have to select their submission manually. The button copies the original submission text, preserving whitespace and line breaks, and shows "Copied!" feedback or an error message when clipboard access fails.

  • Shows a "Copying..." state and a disabled appearance while a copy is pending, and ignores duplicate clicks.
  • Hides the button when code is unavailable, including reports with the unsaved-code placeholder. Code persistence is unchanged.

Written for commit fc8b143. Summary will update on new commits.

View guided diff

Candidates must select their submission manually to copy it from the
report. Provide a copy action using the original text, with feedback
when clipboard access fails and no action when saved code is
unavailable.

Closes sysprog21#318
cubic-dev-ai[bot]

This comment was marked as resolved.

The copy action already ignores duplicate activation, but its appearance
does not reflect that state. Reuse the waiting style and describe the
mocked interaction test according to the behavior it actually checks.
Comment thread web/render.js
const available =
typeof code === "string" &&
code.trim() !== "" &&
code !== "(final code was not saved)";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The button's visibility depends on matching the literal "(final code was not saved)", which is also hard-coded in the Past attempts card (web/app.js, which calls reportMarkup with that string and never calls mountFinalCodeCopy) and in reportMarkdown. If any of those copies changes its wording, Past attempts shows a "Copy code" button with no handler, so clicking it does nothing. Export one constant from render.js and use it in all three places (or have app.js pass code: null and treat null as not saved here).

@jserv

jserv commented Oct 24, 2026

Copy link
Copy Markdown
Contributor

Add screenshots to the pull request description to illustrate your work, as @ColtenOuO suggests. Example: #349

Comment on lines +23 to +24
querySelector: (selector) =>
selector === "[data-copy-code]" ? button : status,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This stub hands back status for any selector other than [data-copy-code], and every test mounts on the stub rather than on what reportMarkup emits, so nothing ties data-copy-code-status in the markup to the selector mountFinalCodeCopy queries. If the two drift, status is null, the click throws at status.textContent before the try, and the button stays aria-disabled for good while every test here still passes. Mount at least one test on the real reportMarkup output (for example parse it with the DOM the other browser tests use) and assert the status text changes there.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add a Copy code button to the final report

2 participants