|
|
import { Page, test } from "@playwright/test"; |
|
|
import * as dotenv from "dotenv"; |
|
|
import path from "path"; |
|
|
|
|
|
async function zoomOut(page: Page, times: number = 4) { |
|
|
for (let i = 0; i < times; i++) { |
|
|
await page.getByTestId("zoom_out").click(); |
|
|
} |
|
|
} |
|
|
|
|
|
test( |
|
|
"should create a flow with decision", |
|
|
{ tag: ["@release", "@components"] }, |
|
|
|
|
|
async ({ page }) => { |
|
|
test.skip( |
|
|
!process?.env?.OPENAI_API_KEY, |
|
|
"OPENAI_API_KEY required to run this test", |
|
|
); |
|
|
if (!process.env.CI) { |
|
|
dotenv.config({ path: path.resolve(__dirname, "../../.env") }); |
|
|
} |
|
|
await page.goto("/"); |
|
|
await page.waitForSelector('[data-testid="mainpage_title"]', { |
|
|
timeout: 30000, |
|
|
}); |
|
|
await page.waitForSelector('[id="new-project-btn"]', { |
|
|
timeout: 30000, |
|
|
}); |
|
|
let modalCount = 0; |
|
|
try { |
|
|
const modalTitleElement = await page?.getByTestId("modal-title"); |
|
|
if (modalTitleElement) { |
|
|
modalCount = await modalTitleElement.count(); |
|
|
} |
|
|
} catch (error) { |
|
|
modalCount = 0; |
|
|
} |
|
|
while (modalCount === 0) { |
|
|
await page.getByText("New Flow", { exact: true }).click(); |
|
|
await page.waitForSelector('[data-testid="modal-title"]', { |
|
|
timeout: 3000, |
|
|
}); |
|
|
modalCount = await page.getByTestId("modal-title")?.count(); |
|
|
} |
|
|
await page.waitForSelector('[data-testid="blank-flow"]', { |
|
|
timeout: 30000, |
|
|
}); |
|
|
await page.getByTestId("blank-flow").click(); |
|
|
|
|
|
await page.getByTestId("sidebar-options-trigger").click(); |
|
|
await page |
|
|
.getByTestId("sidebar-legacy-switch") |
|
|
.isVisible({ timeout: 5000 }); |
|
|
await page.getByTestId("sidebar-legacy-switch").click(); |
|
|
|
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("chat input"); |
|
|
await page.waitForSelector('[data-testid="inputsChat Input"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("inputsChat Input") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]')); |
|
|
await zoomOut(page); |
|
|
|
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("list"); |
|
|
await page.waitForSelector('[data-testid="helpersCreate List"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("helpersCreate List") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 100, y: 100 }, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("input-list-plus-btn_texts-0").first().click(); |
|
|
await page.getByTestId("input-list-plus-btn_texts-0").first().click(); |
|
|
await page.getByTestId("input-list-plus-btn_texts-0").first().click(); |
|
|
await page |
|
|
.getByTestId("inputlist_str_texts_0") |
|
|
.first() |
|
|
.fill("big news! langflow 1.0 is out"); |
|
|
await page |
|
|
.getByTestId("inputlist_str_texts_1") |
|
|
.first() |
|
|
.fill("uhul that movie was awesome"); |
|
|
await page |
|
|
.getByTestId("inputlist_str_texts_2") |
|
|
.first() |
|
|
.fill("love you babe"); |
|
|
await page |
|
|
.getByTestId("helpersCreate List") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 300, y: 300 }, |
|
|
}); |
|
|
await page.getByTestId("input-list-plus-btn_texts-0").last().click(); |
|
|
await page.getByTestId("input-list-plus-btn_texts-0").last().click(); |
|
|
await page.getByTestId("input-list-plus-btn_texts-0").last().click(); |
|
|
await page |
|
|
.getByTestId("inputlist_str_texts_0") |
|
|
.last() |
|
|
.fill("oh my cat died"); |
|
|
await page |
|
|
.getByTestId("inputlist_str_texts_1") |
|
|
.last() |
|
|
.fill("No one loves me"); |
|
|
await page.getByTestId("inputlist_str_texts_2").last().fill("not cool.."); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("parse data"); |
|
|
await page.waitForSelector('[data-testid="processingParse Data"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("processingParse Data") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 350, y: 100 }, |
|
|
}); |
|
|
await zoomOut(page, 1); |
|
|
await page |
|
|
.getByTestId("processingParse Data") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 50, y: 300 }, |
|
|
}); |
|
|
await zoomOut(page, 2); |
|
|
|
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("pass"); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("logicPass") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 400, y: 100 }, |
|
|
}); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("pass"); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("logicPass") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 600, y: 200 }, |
|
|
}); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("pass"); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("logicPass") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 650, y: 350 }, |
|
|
}); |
|
|
await page.waitForSelector('[data-testid="logicPass"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
zoomOut(page, 2); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("prompt"); |
|
|
await page.waitForSelector('[data-testid="promptsPrompt"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("promptsPrompt") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 50, y: 150 }, |
|
|
}); |
|
|
|
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("openai"); |
|
|
await page.waitForSelector('[data-testid="modelsOpenAI"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("modelsOpenAI") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 50, y: 300 }, |
|
|
}); |
|
|
|
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("if else"); |
|
|
await page.waitForSelector('[data-testid="logicIf-Else"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("logicIf-Else") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 750, y: 150 }, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("chat output"); |
|
|
await page.waitForSelector('[data-testid="outputsChat Output"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("outputsChat Output") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 100, y: 75 }, |
|
|
}); |
|
|
await page.waitForSelector('[data-testid="outputsChat Output"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("sidebar-search-input").click(); |
|
|
await page.getByTestId("sidebar-search-input").fill("chat output"); |
|
|
await page.waitForSelector('[data-testid="outputsChat Output"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
await page |
|
|
.getByTestId("outputsChat Output") |
|
|
.dragTo(page.locator('//*[@id="react-flow-id"]'), { |
|
|
targetPosition: { x: 250, y: 75 }, |
|
|
}); |
|
|
await page.waitForSelector('[data-testid="outputsChat Output"]', { |
|
|
timeout: 500, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("fit_view").click(); |
|
|
|
|
|
await page.getByTestId("promptarea_prompt_template").first().click(); |
|
|
await page.getByTestId("modal-promptarea_prompt_template").first().fill(` |
|
|
{Condition} |
|
|
Answer with either TRUE or FALSE (and nothing else). |
|
|
TRUE Examples: |
|
|
{true_examples} |
|
|
FALSE Examples: |
|
|
{false_examples} |
|
|
User: {user_message} |
|
|
AI: |
|
|
`); |
|
|
await page.getByText("Check & Save").last().click(); |
|
|
|
|
|
await page |
|
|
.getByTestId("handle-createlist-shownode-data list-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-parsedata-shownode-data-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-createlist-shownode-data list-right") |
|
|
.nth(2) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-parsedata-shownode-data-left") |
|
|
.nth(1) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-chatinput-shownode-message-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-input message-left") |
|
|
.nth(2) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-parsedata-shownode-text-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
|
|
|
await page |
|
|
.getByTestId("handle-prompt-shownode-true_examples-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-parsedata-shownode-text-right") |
|
|
.nth(2) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-prompt-shownode-false_examples-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-output message-right") |
|
|
.nth(4) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-prompt-shownode-user_message-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-prompt-shownode-prompt message-right") |
|
|
.first() |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-openaimodel-shownode-input-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-openaimodel-shownode-text-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-conditionalrouter-shownode-text input-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page.getByTestId("popover-anchor-input-match_text").fill("TRUE"); |
|
|
await page.getByTestId("title-Pass").nth(1).click(); |
|
|
await page.getByTestId("edit-button-modal").click(); |
|
|
await page |
|
|
.getByTestId("popover-anchor-input-input_message-edit") |
|
|
.nth(0) |
|
|
.fill("You're Happy! 🤪"); |
|
|
await page.getByTestId("showignored_message").last().click(); |
|
|
await page.getByText("Close").last().click(); |
|
|
await page.getByTestId("title-Pass").nth(0).click(); |
|
|
await page.getByTestId("edit-button-modal").click(); |
|
|
await page |
|
|
.getByTestId("popover-anchor-input-input_message-edit") |
|
|
.nth(0) |
|
|
.fill("You're Sad! 🥲"); |
|
|
await page.getByTestId("showignored_message").last().click(); |
|
|
await page.getByText("Close").last().click(); |
|
|
await page |
|
|
.getByTestId("handle-conditionalrouter-shownode-true-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-ignored message-left") |
|
|
.nth(1) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-conditionalrouter-shownode-false-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-ignored message-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-output message-right") |
|
|
.nth(2) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-chatoutput-shownode-text-left") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-pass-shownode-output message-right") |
|
|
.nth(0) |
|
|
.click(); |
|
|
await page |
|
|
.getByTestId("handle-chatoutput-shownode-text-left") |
|
|
.nth(1) |
|
|
.click(); |
|
|
const apiKeyInput = page.getByTestId("popover-anchor-input-api_key"); |
|
|
const isApiKeyInputVisible = await apiKeyInput.isVisible(); |
|
|
if (isApiKeyInputVisible) { |
|
|
await apiKeyInput.fill(process.env.OPENAI_API_KEY ?? ""); |
|
|
} |
|
|
await page.getByTestId("dropdown_str_model_name").click(); |
|
|
await page.getByTestId("gpt-4o-1-option").click(); |
|
|
await page.getByTestId("fit_view").click(); |
|
|
await page.getByText("Playground", { exact: true }).last().click(); |
|
|
await page.waitForSelector('[data-testid="input-chat-playground"]', { |
|
|
timeout: 100000, |
|
|
}); |
|
|
await page.getByTestId("input-chat-playground").click(); |
|
|
await page |
|
|
.getByTestId("input-chat-playground") |
|
|
.fill("my dog is alive and happy!"); |
|
|
await page.waitForSelector('[data-testid="button-send"]', { |
|
|
timeout: 100000, |
|
|
}); |
|
|
|
|
|
await page.getByTestId("button-send").last().click(); |
|
|
}, |
|
|
); |
|
|
|
