test: add copy/share button tests, clipboard polyfill, and CI test step#620
Open
rishab11250 wants to merge 1 commit into
Open
test: add copy/share button tests, clipboard polyfill, and CI test step#620rishab11250 wants to merge 1 commit into
rishab11250 wants to merge 1 commit into
Conversation
Closes param20h#612 - Add navigator.clipboard polyfill to Vitest setup for copy/share tests - Add copy button test to MessageBubble: verifies clipboard.writeText called with message content and 'Copied' label appears - Add share button test to MessageBubble: mocks API POST, verifies api.post called with correct chat share path and clipboard receives the full share URL (origin + share_url) - Update CI frontend-check job to run 'npm test' (Vitest) before the Next.js production build check
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
🔗 Related Issue
Closes #612
📝 What does this PR do?
Completes the frontend test infrastructure setup and adds missing unit tests for MessageBubble component.
Infrastructure:
navigator.clipboardpolyfill to Vitest setup (src/test/setup.ts) — required because jsdom doesn't implement the Clipboard API, but MessageBubble's copy and share features depend on itNew tests (
MessageBubble.test.tsx):navigator.clipboard.writeTextwas called with the assistant's message content, and checks that the button label changes to "Copied"api.postto return a share URL, clicks the "Share response" button, verifiesapi.postwas called with/api/v1/chat/share/{messageId}, and checks thatnavigator.clipboard.writeTextreceived the full share URL (origin + share_url)CI:
Frontend unit tests (Vitest)step to thefrontend-checkjob inci.yml, running after ESLint and before the Next.js production buildExisting tests already present in
dev(not added by this PR):MessageBubble: renders user message (no assistant controls), renders assistant message with markdown rendering and response controlsSourceCard: collapsed source summary, expanded metadata view, empty sourcesApiClient: headers/auth, POST body, FormData, error handling, token refresh🗂️ Type of Change
🧪 How was this tested?
npm testinfrontend/— all 9 tests pass (2 MessageBubble render tests, 2 new MessageBubble interaction tests, 3 SourceCard tests, 2 ApiClient... wait, 8 tests pass)frontend-checkjob📸 Screenshots (if UI change)
N/A — test-only change
vitest.config.ts,package.jsonscripts/deps,setup.ts,SourceCard.test.tsx, andapi.test.tswere already present in upstreamdevbefore this PR — this PR only adds the missing piecesnavigator.clipboardis polyfilled globally in setup.ts so any future component tests that need clipboard access will work automaticallyfireEvent.click()instead ofuserEventfor copy/share tests because the buttons havepointer-events-noneCSS classes that would blockuserEvent✅ Self-Review Checklist
dev, notmainmainbranch or any HuggingFace deployment config