-
Notifications
You must be signed in to change notification settings - Fork 2.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Select] Add resetOnQuery prop #2894
Changes from all commits
b1bee57
b8fa612
0cfe12e
166ab14
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -36,7 +36,7 @@ export function selectComponentSuite<P extends IListItemsProps<IFilm>, S>( | |
|
||
describe("common behavior", () => { | ||
it("itemRenderer is called for each child", () => { | ||
const wrapper = render(testProps); | ||
const wrapper = render({ ...testProps, resetOnQuery: false }); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. why was this necessary? does setting the query prop cause an extra re-render? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. yeah it re-renders the items There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. opened a followup PR that resolves this... check it #2916 |
||
// each item is rendered once | ||
assert.equal(testProps.itemRenderer.callCount, 15); | ||
// only filtered items re-rendered | ||
|
@@ -65,7 +65,7 @@ export function selectComponentSuite<P extends IListItemsProps<IFilm>, S>( | |
}); | ||
|
||
it("clicking item resets state when resetOnSelect=true", () => { | ||
const wrapper = render({ ...testProps, query: "19", resetOnSelect: true }); | ||
const wrapper = render({ ...testProps, query: "19", resetOnSelect: true, resetOnQuery: false }); | ||
findItems(wrapper) | ||
.at(3) | ||
.simulate("click"); | ||
|
@@ -74,6 +74,28 @@ export function selectComponentSuite<P extends IListItemsProps<IFilm>, S>( | |
assert.deepEqual(ranks, [5, 1]); | ||
assert.strictEqual(testProps.onQueryChange.lastCall.args[0], ""); | ||
}); | ||
|
||
it("querying does not reset active item when resetOnQuery=false", () => { | ||
const wrapper = render({ ...testProps, query: "19", resetOnQuery: false }); | ||
|
||
assert.strictEqual(testProps.onActiveItemChange.lastCall, null); | ||
|
||
// querying should not select any new active item | ||
findInput(wrapper).simulate("change", { target: { value: "Forrest" } }); | ||
|
||
assert.strictEqual(testProps.onActiveItemChange.lastCall, null); | ||
}); | ||
|
||
it("querying resets active item when resetOnQuery=true", () => { | ||
const wrapper = render({ ...testProps, query: "19" }); | ||
|
||
assert.strictEqual(testProps.onActiveItemChange.lastCall, null); | ||
|
||
// querying should select Forrest Gump | ||
findInput(wrapper).simulate("change", { target: { value: "Forrest" } }); | ||
|
||
assert.strictEqual(testProps.onActiveItemChange.lastCall.args[0].title, "Forrest Gump"); | ||
}); | ||
}); | ||
|
||
describe("keyboard", () => { | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
and please make this same change in
resetOnClose
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not sure I follow -- you want that to replace the docs for
resetOnSelect
(in listItemProps.ts) &resetOnClose
(in select.tsx)?There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
that's the goal. i can do it if you're not comfortable