forked from downshift-js/downshift
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix: validate that getMenuProps has set the ref correctly (downshift-…
…js#525) * fix: validate that getMenuProps has set the ref correctly * fixup! fix: validate that getMenuProps has set the ref correctly * fixup! fix: validate that getMenuProps has set the ref correctly
- Loading branch information
1 parent
bf87684
commit 2360777
Showing
4 changed files
with
169 additions
and
2 deletions.
There are no files selected for viewing
This file contains 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
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| // Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
|
||
| exports[`not applying the ref prop results in an error 1`] = `"downshift: The ref prop \\"ref\\" from getMenuProps was not applied correctly on your menu element."`; | ||
|
|
||
| exports[`using a composite component and calling getMenuProps without a refKey results in an error 1`] = `"downshift: The ref prop \\"ref\\" from getMenuProps was not applied correctly on your menu element."`; |
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,114 @@ | ||
| import React from 'react' | ||
| import {render} from 'react-testing-library' | ||
| import Downshift from '../' | ||
|
|
||
| const oldError = console.error | ||
|
|
||
| beforeEach(() => { | ||
| console.error = jest.fn() | ||
| }) | ||
|
|
||
| afterEach(() => { | ||
| console.error = oldError | ||
| }) | ||
|
|
||
| const Menu = ({innerRef, ...rest}) => <div ref={innerRef} {...rest} /> | ||
|
|
||
| test('using a composite component and calling getMenuProps without a refKey results in an error', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => ( | ||
| <div> | ||
| <Menu {...getMenuProps()} /> | ||
| </div> | ||
| )} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).toThrowErrorMatchingSnapshot() | ||
| }) | ||
|
|
||
| test('not applying the ref prop results in an error', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => { | ||
| getMenuProps() | ||
| return ( | ||
| <div> | ||
| <ul /> | ||
| </div> | ||
| ) | ||
| }} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).toThrowErrorMatchingSnapshot() | ||
| }) | ||
|
|
||
| test('renders fine when rendering a composite component and applying getMenuProps properly', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => ( | ||
| <div> | ||
| <Menu {...getMenuProps({refKey: 'innerRef'})} /> | ||
| </div> | ||
| )} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).not.toThrow() | ||
| }) | ||
|
|
||
| test('using a composite component and calling getMenuProps without a refKey does not result in an error if suppressRefError is true', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => ( | ||
| <div> | ||
| <Menu {...getMenuProps({}, {suppressRefError: true})} /> | ||
| </div> | ||
| )} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).not.toThrow() | ||
| }) | ||
|
|
||
| test('returning a DOM element and calling getMenuProps with a refKey does not result in an error if suppressRefError is true', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => ( | ||
| <div> | ||
| <ul {...getMenuProps({refKey: 'blah'}, {suppressRefError: true})} /> | ||
| </div> | ||
| )} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).not.toThrow() | ||
| }) | ||
|
|
||
| test('not applying the ref prop results in an error does not result in an error if suppressRefError is true', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => { | ||
| getMenuProps({}, {suppressRefError: true}) | ||
| return ( | ||
| <div> | ||
| <ul /> | ||
| </div> | ||
| ) | ||
| }} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).not.toThrow() | ||
| }) | ||
|
|
||
| test('renders fine when rendering a composite component and applying getMenuProps properly even if suppressRefError is true', () => { | ||
| const MyComponent = () => ( | ||
| <Downshift | ||
| children={({getMenuProps}) => ( | ||
| <div> | ||
| <Menu | ||
| {...getMenuProps({refKey: 'innerRef'}, {suppressRefError: true})} | ||
| /> | ||
| </div> | ||
| )} | ||
| /> | ||
| ) | ||
| expect(() => render(<MyComponent />)).not.toThrow() | ||
| }) |
This file contains 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