Skip to content

Add component tests for CommitmentDetailNftSection copy and action callbacks #591

@1nonlypiece

Description

@1nonlypiece

📌 Description

src/components/dashboard/CommitmentDetailNftSection.tsx renders NFT metadata
rows and exposes six action callbacks (onCopyTokenId, onCopyOwner,
onCopyContract, onViewDetails, onViewOnExplorer, onTransfer) but has no
tests. Copy-to-clipboard and explorer actions are easy to regress silently.

This issue adds RTL tests for rendering and every action callback.

Goal: verify the NFT section renders all metadata and invokes each action
callback exactly once on the right control.

🎯 Requirements and Context

  • Render-test token id, owner, contract, and mint date display.
  • Assert each callback fires when its control is activated.
  • Verify accessible names on copy/explorer/transfer controls.
  • Cover truncation/formatting of long addresses if present.

🛠️ Suggested Execution

1. Create a branch

git checkout -b feature/nft-section-tests

2. Implement changes

  • Add src/components/__tests__/CommitmentDetailNftSection.test.tsx.

3. Test and commit

  • Run npm test.
  • Edge cases: empty/missing mint date, very long token id, repeated clicks.

Example commit message

test: cover CommitmentDetailNftSection rendering and action callbacks

✅ Guidelines

  • Minimum 95% test coverage on the component.
  • Clear, descriptive test names.
  • Timeframe: 96 hours.

🏷️ Labels

type-testing · area-frontend · MAYBE REWARDED · GRANTFOX OSS · OFFICIAL CAMPAIGN

💬 Community & Support

  • Join the CommitLabs contributor Discord: https://discord.gg/WV7tdYkJk
  • Introduce yourself before starting to avoid duplicate work.
  • Maintainers triage actively and review fast.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No fields configured for Task.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions