Update the selected indices in Dropdown when value changes programmatically (#6425)

* dropdown fix'

* add changeset

* typo

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
This commit is contained in:
Abubakar Abid 2023-11-15 09:55:19 -08:00 committed by GitHub
parent f816136a03
commit b3ba17dd11
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 50 additions and 1 deletions

View File

@ -0,0 +1,6 @@
---
"@gradio/dropdown": patch
"gradio": patch
---
fix:Update the selected indices in `Dropdown` when value changes programmatically

View File

@ -326,4 +326,43 @@ describe("Dropdown", () => {
await item.blur();
expect(item.value).toBe("applepie");
});
test("setting a value should update the displayed value and selected indices", 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,
interactive: true
}
);
const item: HTMLInputElement = getByLabelText(
"Dropdown"
) as HTMLInputElement;
expect(item.value).toBe("apple");
await item.focus();
let options = getAllByTestId("dropdown-option");
expect(options[0]).toHaveClass("selected");
await component.$set({ value: "zebra" });
expect(item.value).toBe("zebra");
options = getAllByTestId("dropdown-option");
expect(options[0]).toHaveClass("selected");
await component.$set({ value: undefined });
expect(item.value).toBe("");
options = getAllByTestId("dropdown-option");
expect(options[0]).not.toHaveClass("selected");
});
});

View File

@ -105,12 +105,16 @@
function set_input_text(): void {
if (value === undefined) {
input_text = "";
selected_index = null;
} else if (choices_values.includes(value as string)) {
input_text = choices_names[choices_values.indexOf(value as string)];
selected_index = choices_values.indexOf(value as string);
} else if (allow_custom_value) {
input_text = value as string;
selected_index = null;
} else {
input_text = "";
selected_index = null;
}
}

View File

@ -1,4 +1,4 @@
lockfileVersion: '6.0'
lockfileVersion: '6.1'
settings:
autoInstallPeers: true