fix: only allow custom vals and options to be in the options list (#8356)

* only allow customvals and options to be in the options list

*  (general-bugs-dropdown-select-not-in-list.spec.ts): add additional test cases to cover dropdown selection functionality and ensure correct behavior in the frontend application

---------

Co-authored-by: cristhianzl <cristhian.lousa@gmail.com>
This commit is contained in:
Mike Fortman 2025-06-03 16:19:01 -05:00 committed by GitHub
commit c4ca2bb1da
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 78 additions and 3 deletions

View file

@ -122,7 +122,7 @@ export default function Dropdown({
// If search is cleared, show all options
// Preserve any custom values that were in filteredOptions
const customValuesInFiltered = filteredOptions.filter(
(option) => !validOptions.includes(option),
(option) => !validOptions.includes(option) && option === customValue,
);
setFilteredOptions([...validOptions, ...customValuesInFiltered]);
setFilteredMetadata(optionsMetaData);
@ -222,7 +222,7 @@ export default function Dropdown({
if (open) {
// Check if filteredOptions contains any custom values not in validOptions
const customValuesInFiltered = filteredOptions.filter(
(option) => !validOptions.includes(option),
(option) => !validOptions.includes(option) && option === customValue,
);
// If there are custom values, preserve them when resetting filtered options

View file

@ -36,9 +36,84 @@ test(
await page.waitForTimeout(500);
const value = await page
let value = await page
.getByTestId("value-dropdown-dropdown_str_model_name")
.textContent();
expect(value?.trim()).toBe("this is a test langflow");
await page.getByTestId("generic-node-title-arrangement").click();
await page.keyboard.press("Delete");
await page.getByTestId("sidebar-search-input").fill("agent");
await page.getByTestId("agentsAgent").hover();
await page.getByTestId("add-component-button-agent").click();
await page.getByTestId("fit_view").click();
await page.getByTestId("dropdown_str_model_name").click();
await page.getByTestId("dropdown_search_input").click();
await page
.getByTestId("dropdown_search_input")
.fill("this is a test langflow");
await page.keyboard.press("Enter");
await page.waitForTimeout(500);
value = await page
.getByTestId("value-dropdown-dropdown_str_model_name")
.textContent();
expect(value?.trim()).toBe("this is a test langflow");
await page.getByTestId("dropdown_str_model_name").click();
expect(await page.getByText("ollama").count()).toBe(0);
expect(await page.getByText("claude").count()).toBe(0);
expect(await page.getByText("this is a test langflow").count()).toBe(2);
expect(await page.getByText("gpt").count()).toBeGreaterThanOrEqual(1);
await page.waitForTimeout(500);
await page.getByTestId("value-dropdown-dropdown_str_agent_llm").click();
await page.waitForTimeout(500);
await page.getByText("Anthropic").click();
await page.waitForTimeout(500);
await page.getByTestId("fit_view").click();
await page.getByTestId("dropdown_str_model_name").click();
await page.getByTestId("dropdown_search_input").click();
expect(await page.getByText("llama").count()).toBe(0);
expect(await page.getByText("claude").count()).toBeGreaterThanOrEqual(1);
expect(
await page.getByText("this is a test langflow", { exact: true }).count(),
).toBe(0);
expect(await page.getByText("gpt").count()).toBe(0);
await page.waitForTimeout(500);
await page.getByTestId("value-dropdown-dropdown_str_agent_llm").click();
await page.waitForTimeout(500);
await page.getByText("Groq").click();
await page.waitForTimeout(500);
await page.getByTestId("fit_view").click();
await page.getByTestId("dropdown_str_model_name").click();
await page.getByTestId("dropdown_search_input").click();
expect(await page.getByText("llama").count()).toBeGreaterThanOrEqual(0);
expect(await page.getByText("claude").count()).toBe(0);
expect(
await page.getByText("this is a test langflow", { exact: true }).count(),
).toBe(0);
expect(await page.getByText("gpt").count()).toBe(0);
},
);