mirror/gradio
2
0
Fork 0
mirror of https://github.com/gradio-app/gradio.git synced 2025-04-06 12:30:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixes dropdown breaking if a user types in invalid value and presses enter (#5544)

Browse Source 
* fix dropdown behavior

* tests

* tweak

* add changeset

* format

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
This commit is contained in:
Abubakar Abid 2023-09-14 00:03:59 -07:00 committed by GitHub
parent 301c787821
commit a0cc9ac931
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 66 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.changeset/sour-falcons-marry.md Normal file
View File

@ -0,0 +1,6 @@
---
"@gradio/dropdown": patch
"gradio": patch
---
fix:Fixes dropdown breaking if a user types in invalid value and presses enter

58
js/dropdown/dropdown.test.ts
View File

@ -258,4 +258,62 @@ describe("Dropdown", () => {
const options_new = getAllByTestId("dropdown-option");
expect(options_new).toHaveLength(3);
});
test("setting a custom value when allow_custom_choice is false should revert to the first valid choice", async () => {
const { getByLabelText, getAllByTestId, component } = await render(
Dropdown,
{
show_label: true,
loading_status,
value: "",
allow_custom_value: false,
label: "Dropdown",
choices: [
["apple", "apple"],
["zebra", "zebra"],
["pony", "pony"]
],
filterable: true
}
);
const item: HTMLInputElement = getByLabelText(
"Dropdown"
) as HTMLInputElement;
await item.focus();
await event.keyboard("pie");
expect(item.value).toBe("applepie");
await item.blur();
expect(item.value).toBe("apple");
});
test("setting a custom value when allow_custom_choice is true should keep the value", async () => {
const { getByLabelText, getAllByTestId, component } = await render(
Dropdown,
{
show_label: true,
loading_status,
value: "",
allow_custom_value: true,
label: "Dropdown",
choices: [
["apple", "apple"],
["zebra", "zebra"],
["pony", "pony"]
],
filterable: true
}
);
const item: HTMLInputElement = getByLabelText(
"Dropdown"
) as HTMLInputElement;
await item.focus();
await event.keyboard("pie");
expect(item.value).toBe("applepie");
await item.blur();
expect(item.value).toBe("applepie");
});
});

4
js/dropdown/shared/Dropdown.svelte
View File

@ -74,7 +74,7 @@
dispatch("select", {
index: selected_index,
value: choices_values[selected_index],
selected: true,
selected: true
});
}
}
@ -97,7 +97,7 @@
filtered_indices = handle_filter(choices, input_text);
old_choices = choices;
old_input_text = input_text;
if (!allow_custom_value) {
if (!allow_custom_value && filtered_indices.length > 0) {
active_index = filtered_indices[0];
}
}