jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

feat: Enhance FlowMenu name editing experience (#5729)

Browse source 
* ✨ (FlowMenu/index.tsx): improve user experience by enhancing the flow name editing functionality in the appHeaderComponent's FlowMenu component

* ✨ (FlowMenu/index.tsx): add data-testid attribute to span element for flow name in MenuBar component
🐛 (edit-flow-name.spec.ts): fix test cases to use correct data-testid value for input element in edit-flow-name feature

* ✨ (store-shard-2.spec.ts): update selectors to match changes in the frontend code for better test accuracy and reliability
✨ (edit-flow-name.spec.ts): update selectors to match changes in the frontend code for better test accuracy and reliability
✨ (flowSettings.spec.ts): update selectors to match changes in the frontend code for better test accuracy and reliability
✨ (general-bugs-move-flow-from-folder.spec.ts): update selectors to match changes in the frontend code for better test accuracy and reliability

* ✨ (FlowMenu/index.tsx): add useEffect hook to set flow name when currentFlow is present and not editing name

* fix errors

* ✅ (youtube-transcripts.spec.ts): update timeout values for page.waitForSelector to improve test performance and reliability

* ✨ (sliderComponent): Add cn utility function to improve classnames handling in SliderComponent
📝 (floatComponent.spec.ts): Update test descriptions and values for NVIDIA related components
♻️ (sliderComponent.spec.ts): Refactor code to replace FloatInput with SliderInput and update import statements and values for temperature slider

* ✅ (youtube-transcripts.spec.ts): skip the test for youtube transcripts component to prevent it from running during test suite execution
This commit is contained in:
Cristhian Zanforlin Lousa 2025-01-20 16:41:49 -03:00 • committed by GitHub
commit d9a52d5cb8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 96 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/frontend/tests/core/features/store-shard-2.spec.ts
View file

@ -115,7 +115,7 @@ test("should share component with share button", async ({ page }) => {
await page.getByTestId("side_nav_options_all-templates").click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForTimeout(1000);
const flowName = await page.getByTestId("flow_name").innerText();
const flowName = await page.getByTestId("input-flow-name").inputValue();
await page.getByTestId("flow_menu_trigger").click();
await page.getByText("Edit Details").click();
const flowDescription = await page

110
src/frontend/tests/core/unit/floatComponent.spec.ts
View file

@ -13,77 +13,49 @@ test(
});
await page.getByTestId("blank-flow").click();
await page.getByTestId("sidebar-search-input").click();
await page.getByTestId("sidebar-search-input").fill("ollama");
await page.getByTestId("sidebar-search-input").fill("nvidia");
await page.waitForSelector('[data-testid="modelsOllama"]', {
await page.waitForSelector('[data-testid="modelsNVIDIA"]', {
timeout: 30000,
});
await page
.getByTestId("modelsOllama")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await adjustScreenView(page);
.getByTestId("modelsNVIDIA")
.hover()
.then(async () => {
await page.getByTestId("add-component-button-nvidia").click();
});
await page.locator('//*[@id="float_float_temperature"]').click();
await page.locator('//*[@id="float_float_temperature"]').fill("");
await page.locator('//*[@id="float_float_temperature"]').fill("3");
await page.getByTestId("title-NVIDIA").click();
let value = await page
.locator('//*[@id="float_float_temperature"]')
.inputValue();
await page.getByTestId("edit-button-modal").click();
expect(value).toBe("2");
await page.getByTestId("showseed").click();
await page.locator('//*[@id="float_float_temperature"]').click();
await page.locator('//*[@id="float_float_temperature"]').fill("");
await page.locator('//*[@id="float_float_temperature"]').fill("-3");
await page.getByText("Close").last().click();
value = await page
.locator('//*[@id="float_float_temperature"]')
.inputValue();
await page.locator('//*[@id="int_int_seed"]').click();
await page.locator('//*[@id="int_int_seed"]').fill("");
await page.locator('//*[@id="int_int_seed"]').fill("3");
expect(value).toBe("-2");
let value = await page.locator('//*[@id="int_int_seed"]').inputValue();
expect(value).toBe("3");
await page.locator('//*[@id="int_int_seed"]').click();
await page.locator('//*[@id="int_int_seed"]').fill("");
await page.locator('//*[@id="int_int_seed"]').fill("-3");
value = await page.locator('//*[@id="int_int_seed"]').inputValue();
expect(value).toBe("-3");
await page.getByTestId("more-options-modal").click();
await page.getByTestId("advanced-button-modal").click();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
).toBeTruthy();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
).toBeFalsy();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
).toBeTruthy();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="showmirostat_eta"]').isChecked(),
).toBeFalsy();
await page.getByTestId("showmirostat_tau").click();
expect(
await page.locator('//*[@id="showmirostat_tau"]').isChecked(),
).toBeTruthy();
await page.getByTestId("showmirostat_tau").click();
expect(
await page.locator('//*[@id="showmirostat_tau"]').isChecked(),
).toBeFalsy();
await page.getByText("Close").last().click();
const plusButtonLocator = page.locator(
'//*[@id="float_float_temperature"]',
);
const plusButtonLocator = page.locator('//*[@id="int_int_edit_seed"]');
const elementCount = await plusButtonLocator?.count();
if (elementCount === 0) {
expect(true).toBeTruthy();
@ -91,34 +63,24 @@ test(
await page.getByTestId("more-options-modal").click();
await page.getByTestId("advanced-button-modal").click();
// showtemperature
await page.locator('//*[@id="showtemperature"]').click();
expect(
await page.locator('//*[@id="showtemperature"]').isChecked(),
).toBeTruthy();
await page.getByText("Close").last().click();
await page.locator('//*[@id="float_float_temperature"]').click();
await page.getByTestId("float_float_temperature").fill("");
await page.locator('//*[@id="int_int_seed"]').click();
await page.getByTestId("int_int_seed").fill("");
await page.locator('//*[@id="float_float_temperature"]').fill("3");
await page.locator('//*[@id="int_int_seed"]').fill("3");
let value = await page
.locator('//*[@id="float_float_temperature"]')
.inputValue();
let value = await page.locator('//*[@id="int_int_seed"]').inputValue();
expect(value).toBe("1");
expect(value).toBe("3");
await page.locator('//*[@id="float_float_temperature"]').click();
await page.getByTestId("float_float_temperature").fill("");
await page.locator('//*[@id="int_int_seed"]').click();
await page.getByTestId("int_int_seed").fill("");
await page.locator('//*[@id="float_float_temperature"]').fill("-3");
await page.locator('//*[@id="int_int_seed"]').fill("-3");
value = await page
.locator('//*[@id="float_float_temperature"]')
.inputValue();
value = await page.locator('//*[@id="int_int_seed"]').inputValue();
expect(value).toBe("-1");
expect(value).toBe("-3");
}
},
);

11
src/frontend/tests/core/unit/sliderComponent.spec.ts
View file

@ -36,16 +36,9 @@ test(
let cleanCode = await extractAndCleanCode(page);
// Replace the import statement
cleanCode = cleanCode.replace("FloatInput(", "SliderInput(");
cleanCode = cleanCode.replace(
"from langflow.io import BoolInput, DictInput, DropdownInput, FloatInput, IntInput, StrInput",
"from langflow.io import BoolInput, DictInput, DropdownInput, FloatInput, IntInput, StrInput, SliderInput\n" +
"from langflow.field_typing.range_spec import RangeSpec",
);
cleanCode = cleanCode.replace(
"value=0.2,",
"value=0.2, range_spec=RangeSpec(min=3, max=30, step=1), min_label='test', max_label='test2', min_label_icon='pencil-ruler', max_label_icon='palette', slider_buttons=False, slider_buttons_options=[], slider_input=False,",
'name="temperature", display_name="Temperature", value=0.1, range_spec=RangeSpec(min=0, max=1, step=0.01)',
'name="temperature", display_name="Temperature", value=0.2, range_spec=RangeSpec(min=3, max=30, step=1), min_label="test", max_label="test2", min_label_icon="pencil-ruler", max_label_icon="palette", slider_buttons=False, slider_buttons_options=[], slider_input=False,',
);
await page.locator("textarea").last().press(`ControlOrMeta+a`);

12
src/frontend/tests/extended/features/edit-flow-name.spec.ts
View file

@ -15,13 +15,13 @@ test(
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.getByTestId("flow_name").click();
await page.getByTestId("input-flow-name").click();
await page.getByTestId("input-flow-name").fill(randomName);
await page.keyboard.press("Enter");
let flowName = await page.getByTestId("flow_name").textContent();
let flowName = await page.getByTestId("input-flow-name").inputValue();
expect(flowName).toBe(randomName);
@ -40,13 +40,13 @@ test(
await page.getByText(randomName).click();
await page.getByTestId("flow_name").click();
await page.getByTestId("input-flow-name").click();
await page.getByTestId("input-flow-name").fill(randomName2);
await page.keyboard.press("Enter");
flowName = await page.getByTestId("flow_name").textContent();
flowName = await page.getByTestId("input-flow-name").inputValue();
expect(flowName).toBe(randomName2);
@ -80,13 +80,13 @@ test(
await page.getByText(randomName3).click();
await page.getByTestId("flow_name").click();
await page.getByTestId("input-flow-name").click();
await page.getByTestId("input-flow-name").fill(randomName4);
await page.keyboard.press("Enter");
flowName = await page.getByTestId("flow_name").textContent();
flowName = await page.getByTestId("input-flow-name").inputValue();
expect(flowName).toBe(randomName4);

2
src/frontend/tests/extended/features/flowSettings.spec.ts
View file

@ -11,7 +11,7 @@ test(
timeout: 30000,
});
await page.getByTestId("blank-flow").click();
await page.waitForSelector('[data-testid="flow_name"]', {
await page.waitForSelector('[data-testid="input-flow-name"]', {
timeout: 3000,
});

8
src/frontend/tests/extended/integrations/youtube-transcripts.spec.ts
View file

@ -1,7 +1,7 @@
import { expect, test } from "@playwright/test";
import { awaitBootstrapTest } from "../../utils/await-bootstrap-test";
test(
test.skip(
"user should be able to use youtube transcripts component",
{ tag: ["@release", "@components"] },
async ({ page }) => {
@ -11,8 +11,6 @@ test(
await page.getByTestId("sidebar-search-input").click();
await page.getByTestId("sidebar-search-input").fill("youtube");
await page.waitForTimeout(2000);
await page.getByTestId("youtubeYouTube Transcripts").hover();
await page.getByTestId("add-component-button-youtube-transcripts").click();
@ -35,10 +33,10 @@ test(
await page.getByTestId("button_run_youtube transcripts").click();
await page.waitForSelector("text=built successfully", { timeout: 300000 });
await page.waitForSelector("text=built successfully", { timeout: 3000 });
await page.getByTestId("output-inspection-transcript").first().click();
await page.waitForSelector("text=Component Output", { timeout: 30000 });
await page.waitForSelector("text=Component Output", { timeout: 3000 });
await page.getByRole("gridcell").first().click();
const value = await page.getByPlaceholder("Empty").inputValue();
expect(value.length).toBeGreaterThan(10);

6
src/frontend/tests/extended/regression/general-bugs-move-flow-from-folder.spec.ts
View file

@ -9,12 +9,12 @@ test("user must be able to move flow from folder", async ({ page }) => {
await page.getByTestId("side_nav_options_all-templates").click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForSelector('[data-testid="flow_name"]', {
await page.waitForSelector('[data-testid="input-flow-name"]', {
timeout: 3000,
});
await page.getByTestId("flow_name").click();
await page.getByText("Flow Settings").first().click();
await page.getByTestId("flow_menu_trigger").click();
await page.getByText("Edit Details").first().click();
await page.getByPlaceholder("Flow name").fill(randomName);
await page.getByTestId("save-flow-settings").click();