fix: readded output inspection shortcut (#6812)

* Implemented logFirstMessage function to see if the outputName is the first message possible

* Only render outputs hidden if showHiddenOutputs is true

* Implemented open and setOpen on OutputModal

* Add open output inspection shortcut

* Added data-testid to output modal

* Added test for output shortcut

* fixed chatinputoutputuser test

* Fixed tests

* fixed tests

* fixed url test name

* Fixed loop test

* fixed similarity test

* fixed generalbugs

* fixed timeouts

* fix general bugs

* Fixed tests

* Fix timeouts

* Changed timeouts

* fix general bugs

* Fix decision flow

---------

Co-authored-by: Gabriel Luiz Freitas Almeida <gabriel@langflow.org>
Co-authored-by: Carlos Coelho <80289056+carlosrcoelho@users.noreply.github.com>
This commit is contained in:
Lucas Oliveira 2025-03-11 13:43:24 -03:00 • committed by GitHub
commit 6416c0f983
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 226 additions and 17 deletions

View file

@ -79,7 +79,7 @@ test(
const secondParseDataOutput = await page
.getByTestId("handle-parsedata-shownode-data list-right")
.nth(2);
.nth(1);
const loopItemInput = await page
.getByTestId("handle-loopcomponent-shownode-item-left")

View file

@ -38,10 +38,147 @@ test(
timeout: 30000,
});
await page.getByTestId("icon-TextSearchIcon").nth(4).click();
await page.getByTestId("icon-TextSearchIcon").nth(2).click();
await page.getByText("Sender", { exact: true }).isVisible();
await page.getByText("Type", { exact: true }).isVisible();
await page.getByText("User", { exact: true }).last().isVisible();
},
);
test(
"user must be able to see output inspection using 'o' shortcut",
{ tag: ["@release", "@components"] },
async ({ page }) => {
await awaitBootstrapTest(page);
await page.getByTestId("blank-flow").click();
// Add URL component
await page.getByTestId("sidebar-search-input").click();
await page.getByTestId("sidebar-search-input").fill("url");
await page.waitForSelector('[data-testid="dataURL"]', {
timeout: 1000,
});
await page
.getByTestId("dataURL")
.dragTo(page.locator('//*[@id="react-flow-id"]'), {
targetPosition: { x: 300, y: 200 },
});
// Get URL node ID
const urlNode = await page.locator(".react-flow__node").first();
const urlNodeId = await urlNode.getAttribute("data-id");
// Add two chat outputs
await page.getByTestId("sidebar-search-input").click();
await page.getByTestId("sidebar-search-input").fill("chat output");
await page.waitForSelector('[data-testid="outputsChat Output"]', {
timeout: 1000,
});
await page
.getByTestId("outputsChat Output")
.dragTo(page.locator('//*[@id="react-flow-id"]'), {
targetPosition: { x: 700, y: 200 },
});
await page
.getByTestId("outputsChat Output")
.dragTo(page.locator('//*[@id="react-flow-id"]'), {
targetPosition: { x: 700, y: 400 },
});
// Fill URL input
await page
.getByTestId("inputlist_str_urls_0")
.fill("https://www.example.com");
// Connect text output to first chat output
const urlTextOutput = await page
.getByTestId("handle-url-shownode-text-right")
.nth(0);
await urlTextOutput.hover();
await page.mouse.down();
const firstChatInput = await page
.getByTestId("handle-chatoutput-noshownode-text-target")
.nth(0);
await firstChatInput.hover();
await page.mouse.up();
// Run flow and test text output inspection
await page.getByTestId("button_run_url").first().click();
await page.waitForSelector("text=built successfully", { timeout: 30000 });
await page.keyboard.press("o");
await page.waitForSelector(
`[data-testid="${urlNodeId}-text-output-modal"]`,
{
timeout: 1000,
},
);
await page.keyboard.press("Escape");
// Connect dataframe output to second chat output
const urlDataframeOutput = await page
.getByTestId("handle-url-shownode-dataframe-right")
.nth(0);
await urlDataframeOutput.hover();
await page.mouse.down();
const secondChatInput = await page
.getByTestId("handle-chatoutput-noshownode-text-target")
.nth(1);
await secondChatInput.hover();
await page.mouse.up();
// Run and verify text output is still shown
await page.getByTestId("button_run_url").first().click();
await page.waitForSelector("text=built successfully", { timeout: 30000 });
await page.waitForTimeout(600);
await page.keyboard.press("o");
await page.waitForSelector(
`[data-testid="${urlNodeId}-text-output-modal"]`,
{
timeout: 1000,
},
);
await page.keyboard.press("Escape");
// Remove text connection
const textEdge = await page.locator(".react-flow__edge").first();
await textEdge.click();
await page.keyboard.press("Backspace");
await page.waitForTimeout(600);
// Run and verify dataframe output is now shown
await page.getByTestId("button_run_url").first().click();
await page.waitForSelector("text=built successfully", { timeout: 30000 });
await page.waitForTimeout(600);
await page.keyboard.press("o");
await page.waitForSelector(
`[data-testid="${urlNodeId}-dataframe-output-modal"]`,
{
timeout: 3000,
},
);
await page.keyboard.press("Escape");
// Remove all connections
const dataEdge = await page.locator(".react-flow__edge").first();
await dataEdge.click();
await page.keyboard.press("Backspace");
await page.waitForTimeout(600);
// Run and verify data output is shown
await page.getByTestId("button_run_url").first().click();
await page.waitForSelector("text=built successfully", { timeout: 30000 });
await page.waitForTimeout(600);
await page.keyboard.press("o");
await page.waitForSelector(
`[data-testid="${urlNodeId}-data-output-modal"]`,
{
timeout: 3000,
},
);
},
);