Skip to content

test: realign onboarding + upload component tests with current UI - #52

Merged
Tatenda merged 1 commit into
developfrom
chore/fix-ui-component-tests
May 26, 2026
Merged

test: realign onboarding + upload component tests with current UI#52
Tatenda merged 1 commit into
developfrom
chore/fix-ui-component-tests

Conversation

@Tatenda

@Tatenda Tatenda commented May 26, 2026

Copy link
Copy Markdown
Contributor

Summary

Realigns three failing Jest suites with the current UI in develop. No production code changes — drift between the tests and the components was the entire problem.

  • FileUpload: button is now "Choose File" (singular) and only opens a hidden <input type="file">, the file input — not the button — is the right target for userEvent.upload. The upload button on the second screen was renamed to "Upload Track". The component no longer performs JS-level type/size validation, so the two validation tests were replaced with one that pins the input's accept attribute and one that confirms large files are accepted as-is.
  • ClaimProfileStep: description text changed to "Search for your existing artist profile...". Also locally mocks @heroui/ripple + @heroui/dom-animation so clicking the Claim button doesn't hit the framer-motion dynamic-import error in jsdom.
  • ArtistProfileWizard: existing @heroui/ripple mock returned pointer handlers, but the current HeroUI Button destructures { onPress, onClear, ripples } — so onRipplePressHandler was undefined and every button click threw. Fixed the mock shape.

Also switched fetch.mockClear() -> fetch.mockReset() in the two suites that use mockResolvedValueOnce, so leftover queue entries don't bleed between cases (caused "search failed" / "track artwork" / "upload errors" to flake when the suite ran end-to-end).

Test plan

  • yarn test src/components/upload/__tests__/FileUpload.test.tsx --ci — 7/7 pass
  • yarn test src/components/onboarding/__tests__/ArtistProfileWizard.test.tsx --ci — 11/11 pass
  • yarn test src/components/onboarding/steps/__tests__/ClaimProfileStep.test.tsx --ci — 8/8 pass
  • All three suites together — 26/26 pass
  • yarn tsc --noEmit — only pre-existing error about generated docs-index.generated.json, unchanged by this PR

🤖 Generated with Claude Code

FileUpload:
- Component button is "Choose File" (singular) and only opens the hidden
  <input type="file" />, so target the input directly with user.upload
  instead of getByRole('button', /choose files/i).
- "Upload to Cloud Storage" was renamed to "Upload Track".
- Heading is "Drag & drop your music" with subtext "or click below to
  browse your files".
- The component performs no JS-level type/size validation in
  handleFileSelect; type filtering is just the input's `accept`
  attribute and size limits are enforced server-side. Replaced the two
  validation cases with one assertion on `accept` and one that confirms
  large files are accepted as-is.
- Switched fetch mockClear -> mockReset so leftover
  mockResolvedValueOnce queue entries don't bleed across tests.
- Mock @heroui/ripple + @heroui/dom-animation locally so HeroUI Button
  clicks don't trigger framer-motion's dynamic import (jsdom can't
  resolve it without --experimental-vm-modules).

ClaimProfileStep:
- Mock @heroui/ripple + @heroui/dom-animation so the Claim button click
  doesn't hit the framer-motion dynamic-import error.
- Description text is now "Search for your existing artist profile...",
  not "Already have music on Flemoji".
- Switched fetch mockClear -> mockReset to clear leftover
  mockResolvedValueOnce queue entries between tests (was causing the
  "search failed" and "track artwork" cases to flake when the suite ran
  end-to-end).

ArtistProfileWizard:
- HeroUI Button destructures useRipple() as { onPress, onClear, ripples }.
  The old mock returned pointer handlers (onMouseDown/Up/etc.), so
  onRipplePressHandler was undefined and every click threw
  "onRipplePressHandler is not a function". Updated mock shape.
@vercel

vercel Bot commented May 26, 2026

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
music-next Building Building Preview, Comment May 26, 2026 7:26pm

@coderabbitai

coderabbitai Bot commented May 26, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 2cf1e601-d078-48b2-9b47-885dcf7582d6

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch chore/fix-ui-component-tests

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

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

@Tatenda
Tatenda merged commit 12a2b17 into develop May 26, 2026
3 of 5 checks passed
@Tatenda
Tatenda deleted the chore/fix-ui-component-tests branch May 26, 2026 19:28
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.

1 participant