test(creators): add integration test for search no-results state by Nife-tanny · Pull Request #1100 · accesslayerorg/accesslayer-client

Nife-tanny · 2026-10-16T20:11:29Z

Summary

Adds an integration test for the marketplace creator list on LandingPage. When a creator search returns zero matches, the page must show a dedicated no-results state that references the search term, separate from the generic empty state.

The no-results UI already existed, so this PR is test-only and has no production code changes:

Search active, no matches: EmptyState with the status label "No creators found" and the description We couldn't find any creators matching "<term>"…
No search term, empty list: ClearedFiltersEmptyState with the status label "No creators available" and the heading "Nothing here yet"

Closes #675

Changes

New: src/pages/__tests__/LandingPage.searchNoResults.integration.test.tsx

Test 1: shows a no-results state referencing the search term and removes it when the search is cleared

Mocks courseService.getCourses to return [] when called with search: 'zzznomatch', and one creator otherwise.
Waits for the unfiltered list to settle, with neither empty state present.
Enters zzznomatch in the search input and waits for the debounced API call with that search param. It uses waitFor, with no sleeps or fake timers.
Asserts the "No creators found" status is visible and contains "zzznomatch", and that no creator cards are rendered.
Asserts the generic "No creators available" / "Nothing here yet" state is not present.
Clears the input, then waits for the refetch without a search param. Asserts the no-results state is gone and the creator list is back.

Test 2: renders the generic empty state without search-term copy when no search term is active

Renders with ?category=Nonexistent and no search term. Asserts the "No creators available" state appears, contains none of the no-results copy, and the no-results state is absent. Together with test 1, this checks the two states are separate in both directions.

The test follows the existing LandingPage.*.integration.test.tsx conventions: vi.mock for the service and heavy children, a QueryClientProvider plus MemoryRouter wrapper, and accessible getByRole / getByPlaceholderText queries. It adds no new dependencies or test ids.

Notes on test design

Live queries inside waitFor: while a fetch is in flight, SearchBar replaces its <input> with a skeleton, and the list briefly shows "Updating results...". A small waitForSettledList helper waits for both to clear and asserts against live queries, never stored element references. Without this the test was flaky.
One fireEvent.change instead of per-key userEvent.type: this matches the other LandingPage search tests. With per-key typing, rendering this page in jsdom is slow enough (about 250ms per key) to reach the 300ms debounce mid-word. The input then unmounts, and later keystrokes hit <body>; the t in "zzznomatch" opens the trade dialog through the T shortcut.

Testing

Check	Result
`sh ./scripts/check-no-package-lock.sh`	✅ pass
`pnpm lint`	✅ 0 errors (1 existing warning, unrelated)
`pnpm build` (`tsc -b && vite build`)	✅ pass
New test file type-checked separately (`tsconfig.app.json` excludes tests)	✅ no errors
`prettier --check` on the new file	✅ pass
New test, 5 consecutive runs	✅ 2/2 passing each run
Mutation check: forced `LandingPage` to always render the generic empty state	✅ test fails as expected (change reverted)
`pnpm test` (full suite)	✅ new test passes. ⚠️ 62 test files already fail on `dev` (see below)

Unrelated test failures already on `dev`

This PR changes no source files, so these failures are already on dev and are unrelated to #675. I haven't touched them.

The full pnpm test run took about 41 minutes locally, because vitest.config.ts forces maxWorkers: 1 and fileParallelism: false. Final result:

Test Files  62 failed | 348 passed (410)
     Tests  161 failed | 2701 passed | 1 skipped (2863)
    Errors  12 errors

The new LandingPage.searchNoResults.integration.test.tsx passed in the full run. None of the 12 unhandled errors come from it. Those errors come from LandingPage.buyFlowEndToEnd, holdingsTradeSequence, sellConfirmationModal, sellFlow and tradeConfirmToast.

62 failing test files (click to expand)

src/components/common/__tests__/ConnectWalletButton.test.tsx: 21 tests | 14 failed
src/components/common/__tests__/CreatorCard.accessibility.test.tsx: 2 tests | 2 failed
src/components/common/__tests__/CreatorCard.props.test.tsx: 5 tests | 2 failed
src/components/common/__tests__/CreatorCard.sparkline.test.tsx: 4 tests | 4 failed
src/components/common/__tests__/CreatorProfileHeader.copy.test.tsx: 2 tests | 2 failed
src/components/common/__tests__/DeprecationBanner.test.tsx: 5 tests | 5 failed
src/components/common/__tests__/EmptySearchSuggestions.test.tsx: 5 tests | 1 failed
src/components/common/__tests__/GlobalSearch.test.tsx: 12 tests | 1 failed
src/components/common/__tests__/GraduatedCurvePanel.test.tsx: 3 tests | 3 failed
src/components/common/__tests__/ReferralLinkPanel.test.tsx: 1 test | 1 failed
src/components/common/__tests__/StakeForm.test.tsx: 9 tests | 1 failed
src/components/common/__tests__/TradeConfirmationModal.test.tsx: 4 tests | 1 failed
src/components/common/__tests__/TradeDialog.circuitBreaker.test.tsx: 6 tests | 1 failed
src/components/common/__tests__/TradeDialog.clamp.integration.test.tsx: 8 tests | 2 failed
src/components/common/__tests__/TradeDialog.confirmationFees.integration.test.tsx: 7 tests | 1 failed
src/components/common/__tests__/TradeDialog.features.test.tsx: 7 tests | 3 failed
src/components/common/__tests__/TradeDialog.holdingCap.test.tsx: 10 tests | 8 failed
src/components/common/__tests__/TradeDialog.mobileSheet.test.tsx: 5 tests | 2 failed
src/components/common/__tests__/TradeDialog.slippageControls.test.tsx: 7 tests | 3 failed
src/components/common/__tests__/WalletActivityFeed.infiniteScroll.integration.test.tsx: 4 tests | 4 failed
src/components/creator/__tests__/FundRewardPoolForm.test.tsx: 5 tests | 1 failed
src/hooks/__tests__/useRecentlyViewed.test.ts: 8 tests | 1 failed
src/hooks/__tests__/useTheme.test.ts: 15 tests | 10 failed
src/hooks/__tests__/useTradeKeyboardShortcuts.test.ts: 19 tests | 1 failed
src/lib/web3/format.test.ts: 4 tests | 2 failed
src/pages/__tests__/CreatorDetailPage.buyKeyFlow.integration.test.tsx: 3 tests | 1 failed
src/pages/__tests__/CreatorDetailPage.integration.test.tsx: 8 tests | 1 failed
src/pages/__tests__/CreatorDetailPage.tradeCooldown.integration.test.tsx: 3 tests | 2 failed | 1 skipped
src/pages/__tests__/CreatorDetailPage.whitelist.test.tsx: 5 tests | 1 failed
src/pages/__tests__/CreatorProfilePage.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.apiErrorToast.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.buyFlowEndToEnd.integration.test.tsx: 4 tests | 1 failed
src/pages/__tests__/LandingPage.cardCount.integration.test.tsx: 7 tests | 7 failed
src/pages/__tests__/LandingPage.debouncedSearchClear.integration.test.tsx: 2 tests | 2 failed (expects getCourses(undefined) / { search }, but the page now always sends sort)
src/pages/__tests__/LandingPage.emptyState.integration.test.tsx: 3 tests | 3 failed (its @/hooks/useWallet mock is missing useSelfFreezeMutation)
src/pages/__tests__/LandingPage.holdings.test.tsx: 3 tests | 3 failed
src/pages/__tests__/LandingPage.holdingsCount.integration.test.tsx: 3 tests | 3 failed
src/pages/__tests__/LandingPage.holdingsEmptyState.test.tsx: 2 tests | 2 failed
src/pages/__tests__/LandingPage.holdingsEmptyStateSkeleton.integration.test.tsx: 2 tests | 2 failed
src/pages/__tests__/LandingPage.holdingsGrandTotal.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.holdingsGrandTotalSum.integration.test.tsx: 4 tests | 4 failed
src/pages/__tests__/LandingPage.holdingsLoadingSkeleton.integration.test.tsx: 2 tests | 2 failed
src/pages/__tests__/LandingPage.holdingsSellBalanceUpdate.integration.test.tsx: 4 tests | 4 failed
src/pages/__tests__/LandingPage.holdingsWalletSwitch.integration.test.tsx: 3 tests | 3 failed
src/pages/__tests__/LandingPage.portfolio.test.tsx: 9 tests | 9 failed
src/pages/__tests__/LandingPage.portfolioHistory.integration.test.tsx: 3 tests | 3 failed
src/pages/__tests__/LandingPage.portfolioPnl.integration.test.tsx: 4 tests | 4 failed
src/pages/__tests__/LandingPage.priceFilters.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.scrollRestoreBackNav.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.searchAndSort.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.searchDebounceUnit.test.tsx: 3 tests | 3 failed
src/pages/__tests__/LandingPage.sharePerformance.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.sort.integration.test.tsx: 2 tests | 2 failed
src/pages/__tests__/LandingPage.sortResetPage.integration.test.tsx: 2 tests | 1 failed
src/pages/__tests__/LandingPage.tradeConfirmToast.integration.test.tsx: 2 tests | 1 failed
src/pages/__tests__/LandingPage.tradeShortcut.test.tsx: 4 tests | 4 failed
src/pages/__tests__/LandingPage.tradeShortcutUnmount.integration.test.tsx: 1 test | 1 failed
src/pages/__tests__/LandingPage.tradeSubmitDisabled.integration.test.tsx: 4 tests | 4 failed
src/pages/__tests__/NotFoundPage.integration.test.tsx: 1 test | 1 failed
src/providers/__tests__/Web3Provider.test.tsx: 1 test | 1 failed
src/utils/__tests__/portfolioValue.pnl.test.ts: 40 tests | 1 failed
src/utils/__tests__/toast.transactionSuccess.test.tsx: 7 tests | 2 failed

CI (.github/workflows/ci.yml) runs only lint and build, both of which pass. It doesn't run pnpm test.

Other observations (not addressed here)

SearchBar replaces its input with a skeleton whenever isLoading is true. A slow typer can pause longer than the 300ms debounce mid-word, and the input then unmounts and loses focus. Later keystrokes go to the page, where single-letter shortcuts (B/S/T) can open the trade dialog. This could deserve its own issue.
TradeDialog calls courseService.getDynamicFeeRate. Tests that mock courseService with only getCourses get an unhandled error if the dialog opens.
vitest.config.ts defines the exclude key twice, which esbuild warns about.

🤖 Generated with Claude Code

Cover the marketplace creator list when a search returns zero matches: the dedicated "No creators found" state references the search term, is distinct from the generic "No creators available" empty state, and is removed once the search input is cleared. Closes accesslayerorg#675 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

drips-wave · 2026-10-16T20:11:34Z

@Nife-tanny Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

Chucks1093 merged commit 60e9281 into accesslayerorg:dev Oct 17, 2026
1 check passed

Navigation Menu

Repository navigation

test(creators): add integration test for search no-results state - #1100

test(creators): add integration test for search no-results state#1100
Chucks1093 merged 1 commit into
accesslayerorg:devfrom
Nife-tanny:test/675-creator-search-no-results-state

Nife-tanny commented Oct 16, 2026 •

edited

Loading

Uh oh!

drips-wave Bot commented Oct 16, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

Nife-tanny commented Oct 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Changes

Notes on test design

Testing

Unrelated test failures already on dev

Other observations (not addressed here)

Uh oh!

drips-wave Bot commented Oct 16, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Nife-tanny commented Oct 16, 2026 •

edited

Loading

Unrelated test failures already on `dev`