test: enhance BigNumberInput and HashInput coverage (Tier 2)#416
test: enhance BigNumberInput and HashInput coverage (Tier 2)#416gabitoesmiapodo merged 3 commits intotest/utilsfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR expands the unit test coverage for shared input components, focusing on BigNumberInput parsing/validation behavior and HashInput search/loading/render customization behavior.
Changes:
- Added helper render functions and additional interaction tests for
HashInput(typing, clearing, loading callbacks, customrenderInput). - Added additional interaction and validation tests for
BigNumberInput(placeholder/disabled, parsing, min/max, decimal precision).
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| src/components/sharedComponents/HashInput.test.tsx | Adds interaction tests around search callbacks, loading state, and custom renderInput. |
| src/components/sharedComponents/BigNumberInput.test.tsx | Adds tests for parsing, validation bounds, placeholder/disabled behavior, and decimal precision handling. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| const onSearch = vi.fn() | ||
| detectHashMock.mockResolvedValueOnce({ type: 'ENS', data: '0x123' }) | ||
| renderHashInput({ onSearch, debounceTime: 0 }) | ||
| const input = screen.getByTestId('hash-input') | ||
| await userEvent.type(input, 'vitalik.eth') | ||
| await waitFor(() => { | ||
| expect(onSearch).toHaveBeenCalledWith({ type: 'ENS', data: '0x123' }) | ||
| }) |
There was a problem hiding this comment.
Despite the name, this doesn’t currently verify debouncing behavior: debounceTime: 0 effectively disables the debounce window, and userEvent.type will trigger multiple searches (one per keystroke), so the expectation can pass even if the debounce logic is broken. Consider using fake timers with a non-zero debounce, asserting detectHashMock is called once with the final input value, then advancing timers and asserting the final onSearch call.
| const onSearch = vi.fn() | |
| detectHashMock.mockResolvedValueOnce({ type: 'ENS', data: '0x123' }) | |
| renderHashInput({ onSearch, debounceTime: 0 }) | |
| const input = screen.getByTestId('hash-input') | |
| await userEvent.type(input, 'vitalik.eth') | |
| await waitFor(() => { | |
| expect(onSearch).toHaveBeenCalledWith({ type: 'ENS', data: '0x123' }) | |
| }) | |
| vi.useFakeTimers() | |
| try { | |
| const onSearch = vi.fn() | |
| detectHashMock.mockResolvedValueOnce({ type: 'ENS', data: '0x123' }) | |
| const debounceTime = 300 | |
| renderHashInput({ onSearch, debounceTime }) | |
| const input = screen.getByTestId('hash-input') | |
| await userEvent.type(input, 'vitalik.eth') | |
| // Before the debounce window has elapsed, the detection function should not be called. | |
| expect(detectHashMock).not.toHaveBeenCalled() | |
| await vi.advanceTimersByTimeAsync(debounceTime) | |
| // After the debounce window, detection should be called once with the final input value. | |
| expect(detectHashMock).toHaveBeenCalledTimes(1) | |
| const [[detectedValue]] = detectHashMock.mock.calls | |
| expect(detectedValue).toBe('vitalik.eth') | |
| await waitFor(() => { | |
| expect(onSearch).toHaveBeenCalledWith({ type: 'ENS', data: '0x123' }) | |
| }) | |
| } finally { | |
| vi.useRealTimers() | |
| } |
There was a problem hiding this comment.
The fake-timer approach was attempted but conflicts with both userEvent.type (which uses its own timers for key delays) and waitFor (which uses setInterval for polling) in jsdom. All three interfere and the test timed out. The test was renamed to 'calls onSearch with the detected result' and a comment added explaining the constraint. Debounce isolation testing would require a dedicated adapter or direct component instrumentation.
There was a problem hiding this comment.
it's ok, by testing the debounce functionality we'll be testing a third party library, which I assume has tests and does what it's expected from it
gabitoesmiapodo
force-pushed
the
test/enhance-existing
branch
from
8c31105 to
5ce7095
Compare
gabitoesmiapodo
force-pushed
the
test/utils
branch
from
d6f454e to
cf0fdcb
Compare
gabitoesmiapodo
force-pushed
the
test/enhance-existing
branch
from
5ce7095 to
8ddaae3
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
gabitoesmiapodo
force-pushed
the
test/utils
branch
from
cf0fdcb to
7edb47f
Compare
BigNumberInput: add 9 tests covering placeholder, disabled state, onChange with parsed bigint, onError for min/max violations, decimal precision enforcement, and input clearing. HashInput: add 7 tests covering placeholder, typed value reflection, initial value, clear to null, debounced search callback, onLoading lifecycle, and custom renderInput.
- Rename misleading test names in BigNumberInput (onError absence test, maxUint256 constraint test) - Add beforeEach mock clear in HashInput to prevent cross-test contamination from unconsumed mockResolvedValueOnce calls - Add debounceTime: 0 to clear test to avoid real-timer dependency - Rename debounce test to accurately describe what it covers; fake-timer debounce testing conflicts with waitFor + userEvent in jsdom
gabitoesmiapodo
force-pushed
the
test/enhance-existing
branch
from
8ddaae3 to
33e3ca3
Compare
React global namespace is not available without explicit import; use named import from 'react' to avoid 'Cannot find namespace React' errors.
|
|
||
| const system = createSystem(defaultConfig) | ||
|
|
||
| function renderInput( |
| const onSearch = vi.fn() | ||
| detectHashMock.mockResolvedValueOnce({ type: 'ENS', data: '0x123' }) | ||
| renderHashInput({ onSearch, debounceTime: 0 }) | ||
| const input = screen.getByTestId('hash-input') | ||
| await userEvent.type(input, 'vitalik.eth') | ||
| await waitFor(() => { | ||
| expect(onSearch).toHaveBeenCalledWith({ type: 'ENS', data: '0x123' }) | ||
| }) |
There was a problem hiding this comment.
it's ok, by testing the debounce functionality we'll be testing a third party library, which I assume has tests and does what it's expected from it
Summary
BigNumberInputtests with value formatting, min/max validation, decimal precision, and disabled stateHashInputtests with debounce behavior, loading callbacks, and custom renderInput propTest plan
pnpm testpasses on this branchformatUnits/parseUnitsintegration points in BigNumberInput