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

Merge remote-tracking branch 'origin/dev' into node-shortcuts-refactor

Browse source
This commit is contained in:
Gabriel Luiz Freitas Almeida 2024-04-12 11:56:01 -03:00
commit 23bcdcec28
216 changed files with 11018 additions and 10942 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/frontend/index.html
View file

@ -11,7 +11,7 @@
></script>
<title>Langflow</title>
</head>
<body id="body" style="width: 100%; height: 100%">
<body id="body" class="dark" style="width: 100%; height: 100%">
<noscript>You need to enable JavaScript to run this app.</noscript>
<div style="width: 100vw; height: 100vh" id="root"></div>
<script type="module" src="/src/index.tsx"></script>

2
src/frontend/playwright.config.ts
View file

@ -18,7 +18,7 @@ export default defineConfig({
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 2 : undefined,
workers: 3,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
timeout: 120 * 1000,
// reporter: [

71
src/frontend/src/App.tsx
View file

@ -1,9 +1,8 @@
import { useContext, useEffect, useState } from "react";
import "reactflow/dist/style.css";
import "./App.css";
import { ErrorBoundary } from "react-error-boundary";
import { useNavigate } from "react-router-dom";
import "reactflow/dist/style.css";
import "./App.css";
import ErrorAlert from "./alerts/error";
import NoticeAlert from "./alerts/notice";
import SuccessAlert from "./alerts/success";
@ -15,7 +14,7 @@ import {
FETCH_ERROR_MESSAGE,
} from "./constants/constants";
import { AuthContext } from "./contexts/authContext";
import { getGlobalVariables, getHealth } from "./controllers/API";
import { autoLogin, getGlobalVariables, getHealth } from "./controllers/API";
import Router from "./routes";
import useAlertStore from "./stores/alertStore";
import { useDarkStore } from "./stores/darkStore";
@ -38,8 +37,10 @@ export default function App() {
removeFromTempNotificationList(id);
};
const { isAuthenticated } = useContext(AuthContext);
const { isAuthenticated, login, setUserData, setAutoLogin, getUser } =
useContext(AuthContext);
const refreshFlows = useFlowsManagerStore((state) => state.refreshFlows);
const setLoading = useAlertStore((state) => state.setLoading);
const fetchApiData = useStoreStore((state) => state.fetchApiData);
const getTypes = useTypesStore((state) => state.getTypes);
const refreshVersion = useDarkStore((state) => state.refreshVersion);
@ -49,27 +50,59 @@ export default function App() {
);
const checkHasStore = useStoreStore((state) => state.checkHasStore);
const navigate = useNavigate();
const dark = useDarkStore((state) => state.dark);
const [isLoadingHealth, setIsLoadingHealth] = useState(false);
useEffect(() => {
refreshStars();
refreshVersion();
// If the user is authenticated, fetch the types. This code is important to check if the user is auth because of the execution order of the useEffect hooks.
if (isAuthenticated === true) {
// get data from db
getTypes().then(() => {
refreshFlows();
});
getGlobalVariables().then((res) => {
setGlobalVariables(res);
});
checkHasStore();
fetchApiData();
if (!dark) {
document.getElementById("body")!.classList.remove("dark");
} else {
document.getElementById("body")!.classList.add("dark");
}
}, [dark]);
useEffect(() => {
const isLoginPage = location.pathname.includes("login");
autoLogin()
.then(async (user) => {
if (user && user["access_token"]) {
user["refresh_token"] = "auto";
login(user["access_token"]);
setUserData(user);
setAutoLogin(true);
setLoading(false);
await Promise.all([refreshStars(), refreshVersion(), fetchData()]);
}
})
.catch(async () => {
setAutoLogin(false);
if (isAuthenticated && !isLoginPage) {
getUser();
await Promise.all([refreshStars(), refreshVersion(), fetchData()]);
} else {
setLoading(false);
useFlowsManagerStore.setState({ isLoading: false });
}
});
}, [isAuthenticated]);
const fetchData = async () => {
if (isAuthenticated) {
try {
await getTypes();
refreshFlows();
const res = await getGlobalVariables();
setGlobalVariables(res);
checkHasStore();
fetchApiData();
} catch (error) {
console.error("Failed to fetch data:", error);
}
}
};
useEffect(() => {
checkApplicationHealth();
// Timer to call getHealth every 5 seconds

33
src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
View file

@ -252,7 +252,12 @@ export default function ParameterComponent({
nodeIconsLucide[item.family] ?? nodeIconsLucide["unknown"];
return (
<div key={index}>
<div
key={index}
data-testid={`available-${left ? "input" : "output"}-${
item.family
}`}
>
{index === 0 && (
<span>{left ? INPUT_HANDLER_HOVER : OUTPUT_HANDLER_HOVER}</span>
)}
@ -276,10 +281,16 @@ export default function ParameterComponent({
}}
/>
</div>
<span className="ps-2 text-xs text-foreground">
<span
className="ps-2 text-xs text-foreground"
data-testid={`tooltip-${nodeNames[item.family] ?? "Other"}`}
>
{nodeNames[item.family] ?? "Other"}{" "}
{item?.display_name && item?.display_name?.length > 0 ? (
<span className="text-xs">
<span
className="text-xs"
data-testid={`tooltip-${item?.display_name}`}
>
{" "}
{item.display_name === "" ? "" : " - "}
{item.display_name.split(", ").length > 2
@ -296,7 +307,10 @@ export default function ParameterComponent({
: item.display_name}
</span>
) : (
<span className="text-xs">
<span
className="text-xs"
data-testid={`tooltip-${item?.type}`}
>
{" "}
{item.type === "" ? "" : " - "}
{item.type.split(", ").length > 2
@ -319,7 +333,9 @@ export default function ParameterComponent({
});
} else {
//@ts-ignore
refHtml.current = <span>{TOOLTIP_EMPTY}</span>;
refHtml.current = (
<span data-testid={`empty-tooltip-filter`}>{TOOLTIP_EMPTY}</span>
);
}
}
// If optionalHandle is an empty list, then it is not an optional handle
@ -343,6 +359,9 @@ export default function ParameterComponent({
side={left ? "left" : "right"}
>
<Handle
data-test-id={`handle-${title.toLowerCase()}-${
left ? "target" : "source"
}`}
type={left ? "target" : "source"}
position={left ? Position.Left : Position.Right}
key={
@ -437,6 +456,9 @@ export default function ParameterComponent({
side={left ? "left" : "right"}
>
<Handle
data-test-id={`handle-${title.toLowerCase()}-${
left ? "left" : "right"
}`}
type={left ? "target" : "source"}
position={left ? Position.Left : Position.Right}
key={
@ -482,6 +504,7 @@ export default function ParameterComponent({
}
>
<InputListComponent
componentName={name}
disabled={disabled}
value={
!data.node.template[name].value ||

1
src/frontend/src/CustomNodes/GenericNode/index.tsx
View file

@ -444,6 +444,7 @@ export default function GenericNode({
onChange={setNodeName}
password={false}
blurOnEnter={true}
id={`input-title-${data.node?.display_name}`}
/>
</div>
) : (

4
src/frontend/src/components/CrashErrorComponent/index.tsx
View file

@ -28,7 +28,7 @@ export default function CrashErrorComponent({
<p>
Please report errors with detailed tracebacks on the{" "}
<a
href="https://github.com/logspace-ai/langflow/issues"
href="https://github.com/langflow-ai/langflow/issues"
target="_blank"
rel="noopener noreferrer"
className="font-medium hover:underline "
@ -47,7 +47,7 @@ export default function CrashErrorComponent({
<Button onClick={resetErrorBoundary}>Restart Langflow</Button>
<a
href="https://github.com/logspace-ai/langflow/issues/new"
href="https://github.com/langflow-ai/langflow/issues/new"
target="_blank"
rel="noopener noreferrer"
>

14
src/frontend/src/components/cardComponent/index.tsx
View file

@ -163,20 +163,26 @@ export default function CollectionCardComponent({
<ShadTooltip content="Components">
<span className="flex items-center gap-1.5 text-xs text-muted-foreground">
<IconComponent name="ToyBrick" className="h-4 w-4" />
{data?.metadata?.total ?? 0}
<span data-testid={`total-${data.name}`}>
{data?.metadata?.total ?? 0}
</span>
</span>
</ShadTooltip>
)}
<ShadTooltip content="Likes">
<span className="flex items-center gap-1.5 text-xs text-muted-foreground">
<IconComponent name="Heart" className={cn("h-4 w-4 ")} />
{likes_count ?? 0}
<span data-testid={`likes-${data.name}`}>
{likes_count ?? 0}
</span>
</span>
</ShadTooltip>
<ShadTooltip content="Downloads">
<span className="flex items-center gap-1.5 text-xs text-muted-foreground">
<IconComponent name="DownloadCloud" className="h-4 w-4" />
{downloads_count ?? 0}
<span data-testid={`downloads-${data.name}`}>
{downloads_count ?? 0}
</span>
</span>
</ShadTooltip>
</div>
@ -286,6 +292,7 @@ export default function CollectionCardComponent({
}
handleLike();
}}
data-testid={`like-${data.name}`}
>
<IconComponent
name="Heart"
@ -324,6 +331,7 @@ export default function CollectionCardComponent({
}
handleInstall();
}}
data-testid={`install-${data.name}`}
>
<IconComponent
name={loading ? "Loader2" : isStore ? "Download" : "Plus"}

8
src/frontend/src/components/codeTabsComponent/index.tsx
View file

@ -269,6 +269,9 @@ export default function CodeTabsComponent({
templateField
].list ? (
<InputListComponent
componentName={
templateField
}
editNode={true}
disabled={false}
value={
@ -739,6 +742,11 @@ export default function CodeTabsComponent({
]
);
}}
isList={
node.data.node!.template[
templateField
].list ?? false
}
/>
</div>
) : node.data.node.template[

15
src/frontend/src/components/dropdownComponent/index.tsx
View file

@ -43,7 +43,7 @@ export default function Dropdown({
role="combobox"
ref={refButton}
aria-expanded={open}
data-test={`${id ?? ""}`}
data-testid={`${id ?? ""}`}
className={cn(
editNode
? "dropdown-component-outline"
@ -52,11 +52,14 @@ export default function Dropdown({
editNode ? "input-edit-node" : "py-2"
)}
>
{value &&
value !== "" &&
options.find((option) => option === value)
? options.find((option) => option === value)
: "Choose an option..."}
<span data-testid={`value-dropdown-` + id}>
{value &&
value !== "" &&
options.find((option) => option === value)
? options.find((option) => option === value)
: "Choose an option..."}
</span>
<ForwardedIconComponent
name="ChevronsUpDown"
className="ml-2 h-4 w-4 shrink-0 opacity-50"

14
src/frontend/src/components/headerComponent/index.tsx
View file

@ -1,4 +1,4 @@
import { useContext, useEffect } from "react";
import { useContext } from "react";
import { FaDiscord, FaGithub } from "react-icons/fa";
import { RiTwitterXFill } from "react-icons/ri";
import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
@ -40,15 +40,6 @@ export default function Header(): JSX.Element {
const setDark = useDarkStore((state) => state.setDark);
const stars = useDarkStore((state) => state.stars);
useEffect(() => {
if (dark) {
document.getElementById("body")!.classList.add("dark");
} else {
document.getElementById("body")!.classList.remove("dark");
}
window.localStorage.setItem("isDark", dark.toString());
}, [dark]);
async function checkForChanges(nodes: Node[]): Promise<void> {
if (nodes.length === 0) {
await removeFlow(id!);
@ -103,6 +94,7 @@ export default function Header(): JSX.Element {
onClick={() => {
checkForChanges(nodes);
}}
data-testid="button-store"
>
<IconComponent name="Store" className="h-4 w-4" />
<div className="flex-1">Store</div>
@ -113,7 +105,7 @@ export default function Header(): JSX.Element {
<div className="header-end-division lg:w-[30%]">
<div className="header-end-display">
<a
href="https://github.com/logspace-ai/langflow"
href="https://github.com/langflow-ai/langflow"
target="_blank"
rel="noreferrer"
className="header-github-link gap-2"

15
src/frontend/src/components/inputListComponent/index.tsx
View file

@ -11,6 +11,7 @@ export default function InputListComponent({
onChange,
disabled,
editNode = false,
componentName,
}: InputListComponentType): JSX.Element {
useEffect(() => {
if (disabled && value.length > 0 && value[0] !== "") {
@ -46,6 +47,10 @@ export default function InputListComponent({
newInputList[idx] = event.target.value;
onChange(newInputList);
}}
data-testid={
`input-list-input${editNode ? "-edit" : ""}_${componentName}-` +
idx
}
/>
{idx === value.length - 1 ? (
<button
@ -54,6 +59,11 @@ export default function InputListComponent({
newInputList.push("");
onChange(newInputList);
}}
data-testid={
`input-list-plus-btn${
editNode ? "-edit" : ""
}_${componentName}-` + idx
}
>
<IconComponent
name="Plus"
@ -62,6 +72,11 @@ export default function InputListComponent({
</button>
) : (
<button
data-testid={
`input-list-minus-btn${
editNode ? "-edit" : ""
}_${componentName}-` + idx
}
onClick={() => {
let newInputList = _.cloneDeep(value);
newInputList.splice(idx, 1);

1
src/frontend/src/components/sidebarComponent/index.tsx
View file

@ -28,6 +28,7 @@ export default function SidebarNav({
>
{items.map((item) => (
<Link
data-testid={`sidebar-nav-${item.title}`}
key={item.href}
to={item.href}
className={cn(

1
src/frontend/src/components/tagsSelectorComponent/index.tsx
View file

@ -88,6 +88,7 @@ export function TagsSelector({
updateTags(tag.name);
}}
key={idx}
data-testid={`tag-selector-${tag.name}`}
>
<Badge
key={idx}

3
src/frontend/src/components/textAreaComponent/index.tsx
View file

@ -46,10 +46,11 @@ export default function TextAreaComponent({
>
{!editNode && (
<IconComponent
strokeWidth={1.5}
id={id}
name="ExternalLink"
className={
"icons-parameters-comp" +
"icons-parameters-comp w-[1.35rem]" +
(disabled ? " text-ring" : " hover:text-accent-foreground")
}
/>

1
src/frontend/src/components/ui/input.tsx
View file

@ -8,6 +8,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
({ className, type, ...props }, ref) => {
return (
<input
data-testid=""
type={type}
className={cn(
"nopan nodelete nodrag noundo nocopy primary-input",

33
src/frontend/src/contexts/authContext.tsx
View file

@ -1,13 +1,8 @@
import { createContext, useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import Cookies from "universal-cookie";
import {
autoLogin as autoLoginApi,
getLoggedUser,
requestLogout,
} from "../controllers/API";
import { getLoggedUser, requestLogout } from "../controllers/API";
import useAlertStore from "../stores/alertStore";
import useFlowsManagerStore from "../stores/flowsManagerStore";
import { Users } from "../types/api";
import { AuthContextType } from "../types/contexts/auth";
@ -26,6 +21,7 @@ const initialValue: AuthContextType = {
setApiKey: () => {},
apiKey: null,
storeApiKey: () => {},
getUser: () => {},
};
export const AuthContext = createContext<AuthContextType>(initialValue);
@ -61,30 +57,6 @@ export function AuthProvider({ children }): React.ReactElement {
}
}, []);
useEffect(() => {
const isLoginPage = location.pathname.includes("login");
autoLoginApi()
.then((user) => {
if (user && user["access_token"]) {
user["refresh_token"] = "auto";
login(user["access_token"]);
setUserData(user);
setAutoLogin(true);
setLoading(false);
}
})
.catch((error) => {
setAutoLogin(false);
if (isAuthenticated && !isLoginPage) {
getUser();
} else {
setLoading(false);
useFlowsManagerStore.setState({ isLoading: false });
}
});
}, [autoLogin]);
function getUser() {
getLoggedUser()
.then((user) => {
@ -145,6 +117,7 @@ export function AuthProvider({ children }): React.ReactElement {
setApiKey,
apiKey,
storeApiKey,
getUser,
}}
>
{children}

6
src/frontend/src/controllers/API/api.tsx
View file

@ -46,9 +46,9 @@ function ApiInterceptor() {
const isAuthorizedURL = (url) => {
const authorizedDomains = [
"https://raw.githubusercontent.com/logspace-ai/langflow_examples/main/examples",
"https://api.github.com/repos/logspace-ai/langflow_examples/contents/examples",
"https://api.github.com/repos/logspace-ai/langflow",
"https://raw.githubusercontent.com/langflow-ai/langflow_examples/main/examples",
"https://api.github.com/repos/langflow-ai/langflow_examples/contents/examples",
"https://api.github.com/repos/langflow-ai/langflow",
"auto_login",
];

2
src/frontend/src/controllers/API/index.ts
View file

@ -90,7 +90,7 @@ export async function postValidatePrompt(
*/
export async function getExamples(): Promise<FlowType[]> {
const url =
"https://api.github.com/repos/logspace-ai/langflow_examples/contents/examples?ref=main";
"https://api.github.com/repos/langflow-ai/langflow_examples/contents/examples?ref=main";
const response = await api.get(url);
const jsonFiles = response.data.filter((file: any) => {

6
src/frontend/src/modals/EditNodeModal/index.tsx
View file

@ -205,6 +205,7 @@ const EditNodeModal = forwardRef(
{myData.node.template[templateParam]
.list ? (
<InputListComponent
componentName={templateParam}
editNode={true}
disabled={disabled}
value={
@ -342,6 +343,10 @@ const EditNodeModal = forwardRef(
templateParam
);
}}
isList={
data.node?.template[templateParam]
.list ?? false
}
/>
</div>
) : myData.node?.template[templateParam]
@ -559,6 +564,7 @@ const EditNodeModal = forwardRef(
<BaseModal.Footer>
<Button
data-test-id="saveChangesBtn"
id={"saveChangesBtn"}
className="mt-3"
onClick={() => {

15
src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
View file

@ -164,7 +164,12 @@ export default function ChatMessage({
{chat.thought && chat.thought !== "" && !hidden && <br></br>}
<div className="flex w-full flex-col">
<div className="flex w-full flex-col dark:text-white">
<div className="flex w-full flex-col">
<div
data-testid={
"chat-message-" + chat.sender_name + "-" + chatMessage
}
className="flex w-full flex-col"
>
{useMemo(
() =>
chatMessage === "" && lockChat ? (
@ -313,7 +318,13 @@ dark:prose-invert"
</span>
</>
) : (
<span>{chatMessage}</span>
<span
data-testid={
"chat-message-" + chat.sender_name + "-" + chatMessage
}
>
{chatMessage}
</span>
)}
</div>
)}

2
src/frontend/src/modals/NewFlowModal/components/undrawCards/index.tsx
View file

@ -43,7 +43,7 @@ export default function UndrawCardComponent({
}}
/>
);
case "Basic Prompting (Hello, world!)":
case "Basic Prompting (Hello, World)":
return (
<BasicPrompt
style={{

6
src/frontend/src/modals/NewFlowModal/index.tsx
View file

@ -34,14 +34,12 @@ export default function NewFlowModal({
{/* {examples.map((example, idx) => {
return <UndrawCardComponent key={idx} flow={example} />;
})} */}
{examples.find(
(e) => e.name == "Basic Prompting (Hello, world!)"
) && (
{examples.find((e) => e.name == "Basic Prompting (Hello, World)") && (
<UndrawCardComponent
key={1}
flow={
examples.find(
(e) => e.name == "Basic Prompting (Hello, world!)"
(e) => e.name == "Basic Prompting (Hello, World)"
)!
}
/>

1
src/frontend/src/modals/StoreApiKeyModal/index.tsx
View file

@ -129,6 +129,7 @@ export default function StoreApiKeyModal({
<Form.Submit asChild>
<Button
data-testid="api-key-save-button-store"
className="mt-8"
onClick={() => {
handleSaveKey();

1
src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx
View file

@ -19,6 +19,7 @@ export default function DisclosureComponent({
? "components-disclosure-arrangement-child"
: "components-disclosure-arrangement"
}
data-testid={`disclosure-${title.toLocaleLowerCase()}`}
>
<div className={"flex gap-4" + (isChild ? " pl-2" : "")}>
{/* BUG ON THIS ICON */}

6
src/frontend/src/pages/FlowPage/components/ParentDisclosureComponent/index.tsx
View file

@ -6,13 +6,17 @@ export default function ParentDisclosureComponent({
button: { title, Icon, buttons = [] },
children,
openDisc,
testId,
}: DisclosureComponentType): JSX.Element {
return (
<Disclosure as="div" defaultOpen={openDisc} key={title}>
{({ open }) => (
<>
<div>
<Disclosure.Button className="parent-disclosure-arrangement">
<Disclosure.Button
className="parent-disclosure-arrangement"
data-testid={testId}
>
<div className="flex gap-4">
<span className="parent-disclosure-title ">{title}</span>
</div>

1
src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
View file

@ -369,6 +369,7 @@ export default function ExtraSidebar(): JSX.Element {
title: "Extended",
Icon: nodeIconsLucide.unknown,
}}
testId="extended-disclosure"
>
{Object.keys(dataFilter)
.sort(sortKeys)

2
src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx
View file

@ -391,7 +391,7 @@ export default function NodeToolbarComponent({
<ShadTooltip content={"Duplicate"} side="top">
<button
data-testid="save-button-modal"
data-testid="duplicate-button-modal"
className={classNames(
"relative -ml-px inline-flex items-center bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10"
)}

8
src/frontend/src/pages/StorePage/index.tsx
View file

@ -181,6 +181,7 @@ export default function StorePage(): JSX.Element {
{StoreApiKeyModal && (
<StoreApiKeyModal disabled={loading}>
<Button
data-testid="api-key-button-store"
disabled={loading}
className={cn(
`${!validApiKey ? "animate-pulse border-error" : ""}`,
@ -201,6 +202,7 @@ export default function StorePage(): JSX.Element {
<div className="flex items-end gap-4">
<div className="relative h-12 w-[40%]">
<Input
data-testid="search-store-input"
disabled={loading}
placeholder="Search Flows and Components"
className="absolute h-12 pl-5 pr-12"
@ -220,6 +222,7 @@ export default function StorePage(): JSX.Element {
onClick={() => {
setSearchNow(uniqueId());
}}
data-testid="search-store-button"
>
<IconComponent
name={loading ? "Loader2" : "Search"}
@ -229,6 +232,7 @@ export default function StorePage(): JSX.Element {
</div>
<div className="ml-4 flex w-full gap-2 border-b border-border">
<button
data-testid="all-button-store"
disabled={loading}
onClick={() => {
setTabActive("All");
@ -243,6 +247,7 @@ export default function StorePage(): JSX.Element {
All
</button>
<button
data-testid="flows-button-store"
disabled={loading}
onClick={() => {
resetPagination();
@ -258,6 +263,7 @@ export default function StorePage(): JSX.Element {
Flows
</button>
<button
data-testid="components-button-store"
disabled={loading}
onClick={() => {
resetPagination();
@ -344,7 +350,7 @@ export default function StorePage(): JSX.Element {
setPageOrder(e);
}}
>
<SelectTrigger>
<SelectTrigger data-testid="select-order-store">
<SelectValue placeholder="Popular" />
</SelectTrigger>
<SelectContent>

5
src/frontend/src/stores/darkStore.tsx
View file

@ -8,7 +8,10 @@ export const useDarkStore = create<DarkStoreType>((set, get) => ({
dark: JSON.parse(window.localStorage.getItem("isDark")!) ?? false,
stars: startedStars,
version: "",
setDark: (dark) => set(() => ({ dark: dark })),
setDark: (dark) => {
set(() => ({ dark: dark }));
window.localStorage.setItem("isDark", dark.toString());
},
refreshVersion: () => {
getVersion().then((data) => {
set(() => ({ version: data.version }));

1
src/frontend/src/stores/typesStore.ts
View file

@ -29,6 +29,7 @@ export const useTypesStore = create<TypesStoreType>((set, get) => ({
.catch((error) => {
console.error("An error has occurred while fetching types.");
console.log(error);
setLoading(false);
reject();
});
});

11
src/frontend/src/types/components/index.ts
View file

@ -68,6 +68,16 @@ export type InputListComponentType = {
onChange: (value: string[]) => void;
disabled: boolean;
editNode?: boolean;
componentName?: string;
};
export type InputGlobalComponentType = {
disabled: boolean;
onChange: (value: string) => void;
setDb: (value: boolean) => void;
name: string;
data: NodeDataType;
editNode?: boolean;
};
export type InputGlobalComponentType = {
@ -159,6 +169,7 @@ export type DisclosureComponentType = {
onClick: (event?: React.MouseEvent) => void;
}[];
};
testId?: string;
};
export type RangeSpecType = {

1
src/frontend/src/types/contexts/auth.ts
View file

@ -15,4 +15,5 @@ export type AuthContextType = {
apiKey: string | null;
setApiKey: (apiKey: string | null) => void;
storeApiKey: (apiKey: string) => void;
getUser: () => void;
};

2
src/frontend/src/utils/utils.ts
View file

@ -456,7 +456,7 @@ export function getWidgetCode(
const inputs = buildInputs();
let chat_input_field = getChatInputField(flowState);
return `<script src="https://cdn.jsdelivr.net/gh/logspace-ai/langflow-embedded-chat@1.0_alpha/dist/build/static/js/bundle.min.js"></script>
return `<script src="https://cdn.jsdelivr.net/gh/langflow-ai/langflow-embedded-chat@1.0_alpha/dist/build/static/js/bundle.min.js"></script>
<langflow-chat
window_title="${flowName}"

4
src/frontend/tests/custom_component_full.ts
View file

@ -1,6 +1,6 @@
export const custom = `from langflow.custom import CustomComponent
from langchain.llms.base import BaseLLM
from langflow.field_typing import BaseLanguageModel
from langchain.chains import LLMChain
from langchain.prompts import PromptTemplate
from langchain_core.documents import Document
@ -15,6 +15,6 @@ class YourComponent(CustomComponent):
def build_config(self):
return { "file": { "file_type": ["json"], } }
def build(self, url: str,file:str,integer:int,nested:NestedDict,flt:float,boolean:bool,lisst:list[str],dictionary:dict, llm: BaseLLM, prompt: PromptTemplate) -> Document:
def build(self, url: str,file:str,integer:int,nested:NestedDict,flt:float,boolean:bool,lisst:list[str],dictionary:dict, llm: BaseLanguageModel, prompt: PromptTemplate) -> Document:
return "test"`;

398
src/frontend/tests/end-to-end/assets/ChatTest.json
View file

@ -1,172 +1,11 @@
{
"id": "3f5e860d-1676-4fba-9d86-06db9f51e43a",
"id": "9fd63190-2688-4c9f-9f6a-f48e8a4a3bff",
"data": {
"nodes": [
{
"id": "ChatInput-7hPDT",
"id": "ChatOutput-xPeM1",
"type": "genericNode",
"position": {
"x": 687,
"y": 41.9375
},
"data": {
"type": "ChatInput",
"node": {
"template": {
"code": {
"type": "code",
"required": true,
"placeholder": "",
"list": false,
"show": true,
"multiline": true,
"value": "from typing import Optional, Union\n\nfrom langflow.base.io.chat import ChatComponent\nfrom langflow.field_typing import Text\nfrom langflow.schema import Record\n\n\nclass ChatInput(ChatComponent):\n display_name = \"Chat Input\"\n description = \"Used to get user input from the chat.\"\n icon = \"ChatInput\"\n\n def build(\n self,\n sender: Optional[str] = \"User\",\n sender_name: Optional[str] = \"User\",\n input_value: Optional[str] = None,\n session_id: Optional[str] = None,\n return_record: Optional[bool] = False,\n ) -> Union[Text, Record]:\n return super().build(\n sender=sender,\n sender_name=sender_name,\n input_value=input_value,\n session_id=session_id,\n return_record=return_record,\n )\n",
"fileTypes": [],
"file_path": "",
"password": false,
"name": "code",
"advanced": true,
"dynamic": true,
"info": "",
"load_from_db": false,
"title_case": false
},
"input_value": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": true,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "input_value",
"display_name": "Message",
"advanced": false,
"input_types": ["Text"],
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false
},
"return_record": {
"type": "bool",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"value": false,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "return_record",
"display_name": "Return Record",
"advanced": false,
"dynamic": false,
"info": "Return the message as a record containing the sender, sender_name, and session_id.",
"load_from_db": false,
"title_case": false
},
"sender": {
"type": "str",
"required": false,
"placeholder": "",
"list": true,
"show": true,
"multiline": false,
"value": "User",
"fileTypes": [],
"file_path": "",
"password": false,
"options": ["Machine", "User"],
"name": "sender",
"display_name": "Sender Type",
"advanced": false,
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"sender_name": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"value": "User",
"fileTypes": [],
"file_path": "",
"password": false,
"name": "sender_name",
"display_name": "Sender Name",
"advanced": false,
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"session_id": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "session_id",
"display_name": "Session ID",
"advanced": true,
"dynamic": false,
"info": "If provided, the message will be stored in the memory.",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"_type": "CustomComponent"
},
"description": "Used to get user input from the chat.",
"icon": "ChatInput",
"base_classes": ["Text", "object", "str", "Record"],
"display_name": "Chat Input",
"documentation": "",
"custom_fields": {
"sender": null,
"sender_name": null,
"input_value": null,
"session_id": null,
"return_record": null
},
"output_types": ["Text", "Record"],
"field_formatters": {},
"frozen": false,
"field_order": [],
"beta": false
},
"id": "ChatInput-7hPDT"
},
"selected": false,
"width": 384,
"height": 569,
"positionAbsolute": {
"x": 687,
"y": 41.9375
},
"dragging": false
},
{
"id": "ChatOutput-4sm9Z",
"type": "genericNode",
"position": {
"x": 4.939451516507972,
"y": 103.3695231904992
},
"position": { "x": 231.45405028405742, "y": -109.00715949940081 },
"data": {
"type": "ChatOutput",
"node": {
@ -178,7 +17,7 @@
"list": false,
"show": true,
"multiline": true,
"value": "from typing import Optional, Union\n\nfrom langflow.base.io.chat import ChatComponent\nfrom langflow.field_typing import Text\nfrom langflow.schema import Record\n\n\nclass ChatOutput(ChatComponent):\n display_name = \"Chat Output\"\n description = \"Used to send a message to the chat.\"\n icon = \"ChatOutput\"\n\n def build(\n self,\n sender: Optional[str] = \"Machine\",\n sender_name: Optional[str] = \"AI\",\n input_value: Optional[str] = None,\n session_id: Optional[str] = None,\n return_record: Optional[bool] = False,\n ) -> Union[Text, Record]:\n return super().build(\n sender=sender,\n sender_name=sender_name,\n input_value=input_value,\n session_id=session_id,\n return_record=return_record,\n )\n",
"value": "from typing import Optional, Union\n\nfrom langflow.base.io.chat import ChatComponent\nfrom langflow.field_typing import Text\nfrom langflow.schema import Record\n\n\nclass ChatOutput(ChatComponent):\n display_name = \"Chat Output\"\n description = \"Display a chat message in the Interaction Panel.\"\n icon = \"ChatOutput\"\n\n def build(\n self,\n sender: Optional[str] = \"Machine\",\n sender_name: Optional[str] = \"AI\",\n input_value: Optional[str] = None,\n session_id: Optional[str] = None,\n return_record: Optional[bool] = False,\n record_template: Optional[str] = \"{text}\",\n ) -> Union[Text, Record]:\n return super().build_with_record(\n sender=sender,\n sender_name=sender_name,\n input_value=input_value,\n session_id=session_id,\n return_record=return_record,\n record_template=record_template or \"\",\n )\n",
"fileTypes": [],
"file_path": "",
"password": false,
@ -208,6 +47,26 @@
"load_from_db": false,
"title_case": false
},
"record_template": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": true,
"value": "{text}",
"fileTypes": [],
"file_path": "",
"password": false,
"name": "record_template",
"display_name": "Record Template",
"advanced": true,
"dynamic": false,
"info": "In case of Message being a Record, this template will be used to convert it to text.",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"return_record": {
"type": "bool",
"required": false,
@ -221,7 +80,7 @@
"password": false,
"name": "return_record",
"display_name": "Return Record",
"advanced": false,
"advanced": true,
"dynamic": false,
"info": "Return the message as a record containing the sender, sender_name, and session_id.",
"load_from_db": false,
@ -241,7 +100,7 @@
"options": ["Machine", "User"],
"name": "sender",
"display_name": "Sender Type",
"advanced": false,
"advanced": true,
"dynamic": false,
"info": "",
"load_from_db": false,
@ -289,11 +148,167 @@
},
"_type": "CustomComponent"
},
"description": "Used to send a message to the chat.",
"description": "Display a chat message in the Interaction Panel.",
"icon": "ChatOutput",
"base_classes": ["Text", "object", "str", "Record"],
"base_classes": ["object", "Record", "str", "Text"],
"display_name": "Chat Output",
"documentation": "",
"custom_fields": {
"sender": null,
"sender_name": null,
"input_value": null,
"session_id": null,
"return_record": null,
"record_template": null
},
"output_types": ["Text", "Record"],
"field_formatters": {},
"frozen": false,
"field_order": [],
"beta": false
},
"id": "ChatOutput-xPeM1"
},
"selected": false,
"width": 384,
"height": 383,
"positionAbsolute": {
"x": 231.45405028405742,
"y": -109.00715949940081
},
"dragging": false
},
{
"id": "ChatInput-XYvUc",
"type": "genericNode",
"position": { "x": -389.67919096408036, "y": 10.79598792234681 },
"data": {
"type": "ChatInput",
"node": {
"template": {
"code": {
"type": "code",
"required": true,
"placeholder": "",
"list": false,
"show": true,
"multiline": true,
"value": "from typing import Optional, Union\n\nfrom langflow.base.io.chat import ChatComponent\nfrom langflow.field_typing import Text\nfrom langflow.schema import Record\n\n\nclass ChatInput(ChatComponent):\n display_name = \"Chat Input\"\n description = \"Get chat inputs from the Interaction Panel.\"\n icon = \"ChatInput\"\n\n def build_config(self):\n build_config = super().build_config()\n build_config[\"input_value\"] = {\n \"input_types\": [],\n \"display_name\": \"Message\",\n \"multiline\": True,\n }\n\n return build_config\n\n def build(\n self,\n sender: Optional[str] = \"User\",\n sender_name: Optional[str] = \"User\",\n input_value: Optional[str] = None,\n session_id: Optional[str] = None,\n return_record: Optional[bool] = False,\n ) -> Union[Text, Record]:\n return super().build_no_record(\n sender=sender,\n sender_name=sender_name,\n input_value=input_value,\n session_id=session_id,\n return_record=return_record,\n )\n",
"fileTypes": [],
"file_path": "",
"password": false,
"name": "code",
"advanced": true,
"dynamic": true,
"info": "",
"load_from_db": false,
"title_case": false
},
"input_value": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": true,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "input_value",
"display_name": "Message",
"advanced": false,
"input_types": [],
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false
},
"return_record": {
"type": "bool",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"value": false,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "return_record",
"display_name": "Return Record",
"advanced": true,
"dynamic": false,
"info": "Return the message as a record containing the sender, sender_name, and session_id.",
"load_from_db": false,
"title_case": false
},
"sender": {
"type": "str",
"required": false,
"placeholder": "",
"list": true,
"show": true,
"multiline": false,
"value": "User",
"fileTypes": [],
"file_path": "",
"password": false,
"options": ["Machine", "User"],
"name": "sender",
"display_name": "Sender Type",
"advanced": true,
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"sender_name": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"value": "User",
"fileTypes": [],
"file_path": "",
"password": false,
"name": "sender_name",
"display_name": "Sender Name",
"advanced": false,
"dynamic": false,
"info": "",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"session_id": {
"type": "str",
"required": false,
"placeholder": "",
"list": false,
"show": true,
"multiline": false,
"fileTypes": [],
"file_path": "",
"password": false,
"name": "session_id",
"display_name": "Session ID",
"advanced": true,
"dynamic": false,
"info": "If provided, the message will be stored in the memory.",
"load_from_db": false,
"title_case": false,
"input_types": ["Text"]
},
"_type": "CustomComponent"
},
"description": "Get chat inputs from the Interaction Panel.",
"icon": "ChatInput",
"base_classes": ["object", "Record", "str", "Text"],
"display_name": "Chat Input",
"documentation": "",
"custom_fields": {
"sender": null,
"sender_name": null,
@ -307,52 +322,45 @@
"field_order": [],
"beta": false
},
"id": "ChatOutput-4sm9Z"
"id": "ChatInput-XYvUc"
},
"selected": true,
"selected": false,
"width": 384,
"height": 569,
"positionAbsolute": {
"x": 4.939451516507972,
"y": 103.3695231904992
},
"dragging": false
"height": 375
}
],
"edges": [
{
"source": "ChatOutput-4sm9Z",
"sourceHandle": "{œbaseClassesœ:[œTextœ,œobjectœ,œstrœ,œRecordœ],œdataTypeœ:œChatOutputœ,œidœ:œChatOutput-4sm9Zœ}",
"target": "ChatInput-7hPDT",
"targetHandle": "{œfieldNameœ:œinput_valueœ,œidœ:œChatInput-7hPDTœ,œinputTypesœ:[œTextœ],œtypeœ:œstrœ}",
"source": "ChatInput-XYvUc",
"sourceHandle": "{œbaseClassesœ:[œobjectœ,œRecordœ,œstrœ,œTextœ],œdataTypeœ:œChatInputœ,œidœ:œChatInput-XYvUcœ}",
"target": "ChatOutput-xPeM1",
"targetHandle": "{œfieldNameœ:œinput_valueœ,œidœ:œChatOutput-xPeM1œ,œinputTypesœ:[œTextœ],œtypeœ:œstrœ}",
"data": {
"targetHandle": {
"fieldName": "input_value",
"id": "ChatInput-7hPDT",
"id": "ChatOutput-xPeM1",
"inputTypes": ["Text"],
"type": "str"
},
"sourceHandle": {
"baseClasses": ["Text", "object", "str", "Record"],
"dataType": "ChatOutput",
"id": "ChatOutput-4sm9Z"
"baseClasses": ["object", "Record", "str", "Text"],
"dataType": "ChatInput",
"id": "ChatInput-XYvUc"
}
},
"style": {
"stroke": "#555"
},
"style": { "stroke": "#555" },
"className": "stroke-gray-900 stroke-connection",
"id": "reactflow__edge-ChatOutput-4sm9Z{œbaseClassesœ:[œTextœ,œobjectœ,œstrœ,œRecordœ],œdataTypeœ:œChatOutputœ,œidœ:œChatOutput-4sm9Zœ}-ChatInput-7hPDT{œfieldNameœ:œinput_valueœ,œidœ:œChatInput-7hPDTœ,œinputTypesœ:[œTextœ],œtypeœ:œstrœ}"
"id": "reactflow__edge-ChatInput-XYvUc{œbaseClassesœ:[œobjectœ,œRecordœ,œstrœ,œTextœ],œdataTypeœ:œChatInputœ,œidœ:œChatInput-XYvUcœ}-ChatOutput-xPeM1{œfieldNameœ:œinput_valueœ,œidœ:œChatOutput-xPeM1œ,œinputTypesœ:[œTextœ],œtypeœ:œstrœ}"
}
],
"viewport": {
"x": 316.78239920440234,
"y": 182.84104875768622,
"zoom": 0.6070974421975234
"x": 659.7078595480464,
"y": 328.05200504526294,
"zoom": 0.64075547800662
}
},
"description": "flow to test ChatInput and output",
"name": "ChatITest",
"last_tested_version": "1.0.0a0",
"description": "Unravel the Art of Articulation.",
"name": "ChatTest",
"last_tested_version": "1.0.0a14",
"is_component": false
}

9
src/frontend/tests/end-to-end/auto_login.spec.ts
View file

@ -1,16 +1,13 @@
import { test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(16000);
// test.setTimeout(140000);
});
test.describe("Auto_login tests", () => {
test("auto_login sign in", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.locator('//*[@id="new-project-btn"]').click();
});
test("auto_login block_admin", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(5000);

25
src/frontend/tests/end-to-end/chat_io.spec.ts
View file

@ -1,9 +1,6 @@
import { test } from "@playwright/test";
import { expect, test } from "@playwright/test";
import { readFileSync } from "fs";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(20000);
// test.setTimeout(120000);
});
test("chat_io_teste", async ({ page }) => {
await page.goto("/");
await page.locator("span").filter({ hasText: "My Collection" }).isVisible();
@ -13,6 +10,14 @@ test("chat_io_teste", async ({ page }) => {
"utf-8"
);
await page.waitForTimeout(3000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.locator('//*[@id="new-project-btn"]').click();
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
// Create the DataTransfer and File
const dataTransfer = await page.evaluateHandle((data) => {
const dt = new DataTransfer();
@ -24,12 +29,6 @@ test("chat_io_teste", async ({ page }) => {
return dt;
}, jsonContent);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
// Now dispatch
await page.dispatchEvent(
'//*[@id="react-flow-id"]/div[1]/div[1]/div',
@ -43,4 +42,8 @@ test("chat_io_teste", async ({ page }) => {
await page.getByPlaceholder("Send a message...").click();
await page.getByPlaceholder("Send a message...").fill("teste");
await page.getByRole("button").nth(1).click();
const chat_output = page.getByTestId("chat-message-AI-teste");
const chat_input = page.getByTestId("chat-message-User-teste");
await expect(chat_output).toHaveText("teste");
await expect(chat_input).toHaveText("teste");
});

27
src/frontend/tests/end-to-end/codeAreaModalComponent.spec.ts
View file

@ -1,29 +1,36 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
await page.waitForTimeout(2000);
test.setTimeout(120000);
});
test("CodeAreaModalComponent", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("pythonfunctiontool");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("toolsPythonFunctionTool")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("div-generic-node").click();
await page.getByTestId("code-button-modal").click();
@ -50,6 +57,8 @@ test("CodeAreaModalComponent", async ({ page }) => {
await page.locator("textarea").fill(wCode);
await page.locator("textarea").fill(code);
await page.locator('//*[@id="checkAndSaveBtn"]').click();
await page.waitForTimeout(1000);
expect(await page.getByText("Code is ready to run").isVisible()).toBeTruthy();
await page.getByTestId("code-button-modal").click();
expect(await page.locator('//*[@id="codeValue"]').inputValue()).toBe(

4
src/frontend/tests/end-to-end/curl_api_generation.spec.ts
View file

@ -1,10 +1,10 @@
import { expect, test } from "@playwright/test";
test("curl_api_generation", async ({ page, context }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.locator('//*[@id="new-project-btn"]').click();
await context.grantPermissions(["clipboard-read", "clipboard-write"]);
await page.getByRole("heading", { name: "Data Ingestion" }).click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForTimeout(2000);
await page.getByText("API", { exact: true }).click();
await page.getByRole("tab", { name: "cURL" }).click();

9
src/frontend/tests/end-to-end/dragAndDrop.spec.ts
View file

@ -1,13 +1,10 @@
import { expect, test } from "@playwright/test";
import { readFileSync } from "fs";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(3000);
// test.setTimeout(120000);
});
test.describe("drag and drop test", () => {
/// <reference lib="dom"/>
test("drop collection", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.locator("span").filter({ hasText: "My Collection" }).isVisible();
// Read your file into a buffer.
const jsonContent = readFileSync(
@ -36,7 +33,7 @@ test.describe("drag and drop test", () => {
);
await page.getByText("Edit Flow").first().click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
const genericNoda = page.getByTestId("div-generic-node");
const elementCount = await genericNoda.count();

108
src/frontend/tests/end-to-end/dropdownComponent.spec.ts
View file

@ -1,51 +1,65 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(4000);
// test.setTimeout(120000);
});
test("dropDownComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("amazon");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("model_specsAmazon Bedrock")
.getByTestId("modelsAmazon Bedrock")
.first()
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("dropdown-model_id-display").click();
await page.getByTestId("ai21.j2-grande-instruct-0-option").click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
let value = await page.getByTestId("dropdown-model_id-display").innerText();
if (value !== "ai21.j2-grande-instruct") {
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("title-Amazon Bedrock").click();
await page.getByTestId("dropdown-model_id").click();
await page.getByTestId("ai21.j2-mid-v1-10-option").click();
let value = await page
.getByTestId("value-dropdown-dropdown-model_id")
.first()
.innerText();
if (value !== "ai21.j2-mid-v1") {
expect(false).toBeTruthy();
}
await page.getByTestId("dropdown-model_id-display").click();
await page.getByTestId("ai21.j2-jumbo-instruct-1-option").click();
await page.getByTestId("dropdown-model_id").click();
await page.getByTestId("anthropic.claude-v2:1-6-option").click();
value = await page.getByTestId("dropdown-model_id-display").innerText();
if (value !== "ai21.j2-jumbo-instruct") {
value = await page.getByTestId("dropdown-model_id").innerText();
if (value !== "anthropic.claude-v2:1") {
expect(false).toBeTruthy();
}
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
value = await page.getByTestId("dropdown-edit-model_id-display").innerText();
if (value !== "ai21.j2-jumbo-instruct") {
value = await page.getByTestId("dropdown-edit-model_id").innerText();
if (value !== "anthropic.claude-v2:1") {
expect(false).toBeTruthy();
}
@ -75,16 +89,6 @@ test("dropDownComponent", async ({ page }) => {
await page.locator('//*[@id="showendpoint_url"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showregion_name"]').click();
expect(
await page.locator('//*[@id="showregion_name"]').isChecked()
@ -95,16 +99,6 @@ test("dropDownComponent", async ({ page }) => {
await page.locator('//*[@id="showregion_name"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeTruthy();
// showmodel_id
await page.locator('//*[@id="showmodel_id"]').click();
expect(await page.locator('//*[@id="showmodel_id"]').isChecked()).toBeFalsy();
@ -141,16 +135,6 @@ test("dropDownComponent", async ({ page }) => {
await page.locator('//*[@id="showendpoint_url"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showregion_name"]').click();
expect(
await page.locator('//*[@id="showregion_name"]').isChecked()
@ -161,16 +145,6 @@ test("dropDownComponent", async ({ page }) => {
await page.locator('//*[@id="showregion_name"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeTruthy();
// showmodel_id
await page.locator('//*[@id="showmodel_id"]').click();
expect(await page.locator('//*[@id="showmodel_id"]').isChecked()).toBeFalsy();
@ -181,18 +155,18 @@ test("dropDownComponent", async ({ page }) => {
await page.locator('//*[@id="showmodel_id"]').isChecked()
).toBeTruthy();
await page.getByTestId("dropdown-edit-model_id-display").click();
await page.getByTestId("ai21.j2-ultra-v1-5-option").click();
await page.getByTestId("dropdown-edit-model_id").click();
await page.getByTestId("ai21.j2-mid-v1-10-option").click();
value = await page.getByTestId("dropdown-edit-model_id-display").innerText();
if (value !== "ai21.j2-ultra-v1") {
value = await page.getByTestId("dropdown-edit-model_id").innerText();
if (value !== "ai21.j2-mid-v1") {
expect(false).toBeTruthy();
}
await page.locator('//*[@id="saveChangesBtn"]').click();
value = await page.getByTestId("dropdown-model_id-display").innerText();
if (value !== "ai21.j2-ultra-v1") {
value = await page.getByTestId("dropdown-model_id").innerText();
if (value !== "ai21.j2-mid-v1") {
expect(false).toBeTruthy();
}
await page.getByTestId("code-button-modal").click();
@ -203,7 +177,7 @@ test("dropDownComponent", async ({ page }) => {
.click();
await page.locator("textarea").press("Control+a");
const emptyOptionsCode = `from typing import Optional
from langchain.llms.base import BaseLLM
from langflow.field_typing import BaseLanguageModel
from langchain_community.llms.bedrock import Bedrock
from langflow.interface.custom.custom_component import CustomComponent
@ -238,7 +212,7 @@ class AmazonBedrockComponent(CustomComponent):
endpoint_url: Optional[str] = None,
streaming: bool = False,
cache: Optional[bool] = None,
) -> BaseLLM:
) -> BaseLanguageModel:
try:
output = Bedrock(
credentials_profile_name=credentials_profile_name,

241
src/frontend/tests/end-to-end/filterEdge.spec.ts Normal file
View file

@ -0,0 +1,241 @@
import { expect, test } from "@playwright/test";
test("LLMChain - Tooltip", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("llmchain");
await page.waitForTimeout(1000);
await page
.getByTestId("chainsLLMChain")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTitle("fit view").click();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[3]/div/button/div/div'
)
.hover()
.then(async () => {
await expect(
page.getByTestId("available-input-model_specs").first()
).toBeVisible();
await expect(page.getByTestId("tooltip-Models").first()).toBeVisible();
await expect(
page.getByTestId("tooltip-AzureOpenAIModel").first()
).toBeVisible();
await expect(
page.getByTestId("tooltip-Model Specs").first()
).toBeVisible();
await page.getByTestId("icon-X").click();
await page.waitForTimeout(500);
});
await page.getByTitle("fit view").click();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[4]/div/button/div/div'
)
.hover()
.then(async () => {
await expect(
page.getByTestId("available-input-memories").first()
).toBeVisible();
await expect(page.getByTestId("tooltip-Memories").first()).toBeVisible();
await expect(
page
.getByTestId(
"tooltip-ConversationBufferMemory, ConversationBufferWindowMemory, ConversationEntityMemory, ConversationKGMemory, ConversationSummaryMemory, MotorheadMemory, VectorStoreRetrieverMemory"
)
.first()
).toBeVisible();
await page.getByTestId("icon-Search").click();
await page.waitForTimeout(500);
});
await page.getByTitle("fit view").click();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[5]/div/button/div/div'
)
.hover()
.then(async () => {
await expect(
page.getByTestId("empty-tooltip-filter").first()
).toBeVisible();
});
});
test("LLMChain - Filter", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("llmchain");
await page.waitForTimeout(1000);
await page
.getByTestId("chainsLLMChain")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTitle("fit view").click();
await page.waitForTimeout(500);
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[3]/div/button/div/div'
)
.click();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[3]/div/button/div/div'
)
.click();
await page.getByTestId("icon-Search").click();
await expect(page.getByTestId("disclosure-models")).toBeVisible();
await expect(page.getByTestId("disclosure-model specs")).toBeVisible();
await expect(page.getByTestId("modelsAzure OpenAI")).toBeVisible();
await expect(page.getByTestId("model_specsAmazon Bedrock")).toBeVisible();
await expect(page.getByTestId("model_specsAnthropic")).toBeVisible();
await expect(page.getByTestId("model_specsAnthropicLLM")).toBeVisible();
await expect(page.getByTestId("model_specsAzureChatOpenAI")).toBeVisible();
await expect(page.getByTestId("model_specsChatAnthropic")).toBeVisible();
await expect(page.getByTestId("model_specsChatLiteLLM")).toBeVisible();
await expect(page.getByTestId("model_specsChatOllama")).toBeVisible();
await expect(page.getByTestId("model_specsChatOpenAI")).toBeVisible();
await expect(page.getByTestId("model_specsChatVertexAI")).toBeVisible();
await expect(page.getByTestId("model_specsCohere")).toBeVisible();
await expect(
page.getByTestId("model_specsGoogle Generative AI")
).toBeVisible();
await expect(
page.getByTestId("model_specsHugging Face Inference API")
).toBeVisible();
await expect(page.getByTestId("model_specsOllama")).toBeVisible();
await expect(
page.getByTestId("model_specsQianfanChatEndpoint")
).toBeVisible();
await expect(page.getByTestId("model_specsQianfanLLMEndpoint")).toBeVisible();
await expect(page.getByTestId("model_specsVertexAI")).toBeVisible();
await page.getByPlaceholder("Search").click();
await expect(page.getByTestId("model_specsVertexAI")).not.toBeVisible();
await expect(page.getByTestId("model_specsCTransformers")).not.toBeVisible();
await expect(page.getByTestId("model_specsAmazon Bedrock")).not.toBeVisible();
await expect(page.getByTestId("modelsAzure OpenAI")).not.toBeVisible();
await expect(page.getByTestId("model_specsAnthropic")).not.toBeVisible();
await expect(page.getByTestId("model_specsAnthropicLLM")).not.toBeVisible();
await expect(
page.getByTestId("model_specsAzureChatOpenAI")
).not.toBeVisible();
await expect(page.getByTestId("model_specsChatAnthropic")).not.toBeVisible();
await expect(page.getByTestId("model_specsChatLiteLLM")).not.toBeVisible();
await expect(page.getByTestId("model_specsChatOllama")).not.toBeVisible();
await expect(page.getByTestId("model_specsChatOpenAI")).not.toBeVisible();
await expect(page.getByTestId("model_specsChatVertexAI")).not.toBeVisible();
await expect(page.getByTestId("model_specsCohere")).not.toBeVisible();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[4]/div/button/div/div'
)
.click();
await page
.locator(
'//*[@id="react-flow-id"]/div[1]/div[1]/div/div/div[2]/div/div/div[2]/div[4]/div/button/div/div'
)
.click();
await expect(page.getByTestId("disclosure-memories")).toBeVisible();
await expect(
page.getByTestId("memoriesConversationBufferMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesConversationBufferWindowMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesConversationEntityMemory")
).toBeVisible();
await expect(page.getByTestId("memoriesConversationKGMemory")).toBeVisible();
await expect(page.getByTestId("memoriesConversationKGMemory")).toBeVisible();
await expect(
page.getByTestId("memoriesConversationSummaryMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesVectorStoreRetrieverMemory")
).toBeVisible();
await page.getByTestId("rf__wrapper").click();
await expect(
page.getByTestId("memoriesConversationBufferMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesConversationBufferWindowMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesConversationEntityMemory")
).toBeVisible();
await expect(page.getByTestId("memoriesConversationKGMemory")).toBeVisible();
await expect(page.getByTestId("memoriesConversationKGMemory")).toBeVisible();
await expect(
page.getByTestId("memoriesConversationSummaryMemory")
).toBeVisible();
await expect(
page.getByTestId("memoriesVectorStoreRetrieverMemory")
).toBeVisible();
});

375
src/frontend/tests/end-to-end/floatComponent.spec.ts
View file

@ -1,28 +1,47 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(5000);
// test.setTimeout(120000);
});
test("FloatComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("llamacpp");
await page.getByPlaceholder("Search").fill("ollama");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.locator('//*[@id="model_specsLlamaCpp"]')
.getByTestId("modelsOllama")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.locator('//*[@id="float-input"]').click();
await page.locator('//*[@id="float-input"]').fill("3");
@ -48,309 +67,79 @@ test("FloatComponent", async ({ page }) => {
await page.locator('//*[@id="showcache"]').click();
expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeTruthy();
// showecho
await page.locator('//*[@id="showecho"]').click();
expect(await page.locator('//*[@id="showecho"]').isChecked()).toBeTruthy();
// showf16_kv
await page.locator('//*[@id="showf16_kv"]').click();
expect(await page.locator('//*[@id="showf16_kv"]').isChecked()).toBeTruthy();
// showgrammar_path
await page.locator('//*[@id="showgrammar_path"]').click();
expect(
await page.locator('//*[@id="showgrammar_path"]').isChecked()
).toBeTruthy();
// showlast_n_tokens_size
await page.locator('//*[@id="showlast_n_tokens_size"]').click();
expect(
await page.locator('//*[@id="showlast_n_tokens_size"]').isChecked()
).toBeTruthy();
// showlogits_all
await page.locator('//*[@id="showlogits_all"]').click();
expect(
await page.locator('//*[@id="showlogits_all"]').isChecked()
).toBeTruthy();
// showlogprobs
await page.locator('//*[@id="showlogprobs"]').click();
expect(
await page.locator('//*[@id="showlogprobs"]').isChecked()
).toBeTruthy();
// showlora_base
await page.locator('//*[@id="showlora_base"]').click();
expect(
await page.locator('//*[@id="showlora_base"]').isChecked()
).toBeTruthy();
// showlora_path
await page.locator('//*[@id="showlora_path"]').click();
expect(
await page.locator('//*[@id="showlora_path"]').isChecked()
).toBeTruthy();
// showmax_tokens
await page.locator('//*[@id="showmax_tokens"]').click();
expect(
await page.locator('//*[@id="showmax_tokens"]').isChecked()
).toBeTruthy();
// showmodel_path
await page.locator('//*[@id="showmodel_path"]').click();
expect(
await page.locator('//*[@id="showmodel_path"]').isChecked()
).toBeFalsy();
// shown_batch
await page.locator('//*[@id="shown_batch"]').click();
expect(await page.locator('//*[@id="shown_batch"]').isChecked()).toBeTruthy();
// shown_ctx
await page.locator('//*[@id="shown_ctx"]').click();
expect(await page.locator('//*[@id="shown_ctx"]').isChecked()).toBeTruthy();
// shown_gpu_layers
await page.locator('//*[@id="shown_gpu_layers"]').click();
expect(
await page.locator('//*[@id="shown_gpu_layers"]').isChecked()
).toBeTruthy();
// shown_parts
await page.locator('//*[@id="shown_parts"]').click();
expect(await page.locator('//*[@id="shown_parts"]').isChecked()).toBeTruthy();
// shown_threads
await page.locator('//*[@id="shown_threads"]').click();
expect(
await page.locator('//*[@id="shown_threads"]').isChecked()
).toBeTruthy();
// showrepeat_penalty
await page.locator('//*[@id="showrepeat_penalty"]').click();
expect(
await page.locator('//*[@id="showrepeat_penalty"]').isChecked()
).toBeTruthy();
// showrope_freq_base
await page.locator('//*[@id="showrope_freq_base"]').click();
expect(
await page.locator('//*[@id="showrope_freq_base"]').isChecked()
).toBeTruthy();
// showrope_freq_scale
await page.locator('//*[@id="showrope_freq_scale"]').click();
expect(
await page.locator('//*[@id="showrope_freq_scale"]').isChecked()
).toBeTruthy();
// showseed
await page.locator('//*[@id="showseed"]').click();
expect(await page.locator('//*[@id="showseed"]').isChecked()).toBeTruthy();
// showstop
await page.locator('//*[@id="showstop"]').click();
expect(await page.locator('//*[@id="showstop"]').isChecked()).toBeTruthy();
// showstreaming
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeTruthy();
// showsuffix
await page.locator('//*[@id="showsuffix"]').click();
expect(await page.locator('//*[@id="showsuffix"]').isChecked()).toBeTruthy();
// showtags
await page.locator('//*[@id="showtags"]').click();
expect(await page.locator('//*[@id="showtags"]').isChecked()).toBeTruthy();
// showtemperature
await page.locator('//*[@id="showtemperature"]').click();
expect(
await page.locator('//*[@id="showtemperature"]').isChecked()
).toBeFalsy();
// showtop_k
await page.locator('//*[@id="showtop_k"]').click();
expect(await page.locator('//*[@id="showtop_k"]').isChecked()).toBeTruthy();
// showtop_p
await page.locator('//*[@id="showtop_p"]').click();
expect(await page.locator('//*[@id="showtop_p"]').isChecked()).toBeTruthy();
// showuse_mlock
await page.locator('//*[@id="showuse_mlock"]').click();
expect(
await page.locator('//*[@id="showuse_mlock"]').isChecked()
).toBeTruthy();
// showuse_mmap
await page.locator('//*[@id="showuse_mmap"]').click();
expect(
await page.locator('//*[@id="showuse_mmap"]').isChecked()
).toBeTruthy();
// showverbose
await page.locator('//*[@id="showverbose"]').click();
expect(await page.locator('//*[@id="showverbose"]').isChecked()).toBeTruthy();
// showvocab_only
await page.locator('//*[@id="showvocab_only"]').click();
expect(
await page.locator('//*[@id="showvocab_only"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showcache"]').click();
expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeFalsy();
// showecho
await page.locator('//*[@id="showecho"]').click();
expect(await page.locator('//*[@id="showecho"]').isChecked()).toBeFalsy();
await page.getByTestId("showformat").click();
expect(await page.locator('//*[@id="showformat"]').isChecked()).toBeTruthy();
// showf16_kv
await page.locator('//*[@id="showf16_kv"]').click();
expect(await page.locator('//*[@id="showf16_kv"]').isChecked()).toBeFalsy();
await page.getByTestId("showformat").click();
expect(await page.locator('//*[@id="showformat"]').isChecked()).toBeFalsy();
// showgrammar_path
await page.locator('//*[@id="showgrammar_path"]').click();
await page.getByTestId("showmirostat").click();
expect(
await page.locator('//*[@id="showgrammar_path"]').isChecked()
).toBeFalsy();
// showlast_n_tokens_size
await page.locator('//*[@id="showlast_n_tokens_size"]').click();
expect(
await page.locator('//*[@id="showlast_n_tokens_size"]').isChecked()
).toBeFalsy();
// showlogits_all
await page.locator('//*[@id="showlogits_all"]').click();
expect(
await page.locator('//*[@id="showlogits_all"]').isChecked()
).toBeFalsy();
// showlogprobs
await page.locator('//*[@id="showlogprobs"]').click();
expect(await page.locator('//*[@id="showlogprobs"]').isChecked()).toBeFalsy();
// showlora_base
await page.locator('//*[@id="showlora_base"]').click();
expect(
await page.locator('//*[@id="showlora_base"]').isChecked()
).toBeFalsy();
// showlora_path
await page.locator('//*[@id="showlora_path"]').click();
expect(
await page.locator('//*[@id="showlora_path"]').isChecked()
).toBeFalsy();
// showmax_tokens
await page.locator('//*[@id="showmax_tokens"]').click();
expect(
await page.locator('//*[@id="showmax_tokens"]').isChecked()
).toBeFalsy();
// showmodel_path
await page.locator('//*[@id="showmodel_path"]').click();
expect(
await page.locator('//*[@id="showmodel_path"]').isChecked()
await page.locator('//*[@id="showmirostat"]').isChecked()
).toBeTruthy();
// shown_batch
await page.locator('//*[@id="shown_batch"]').click();
expect(await page.locator('//*[@id="shown_batch"]').isChecked()).toBeFalsy();
await page.getByTestId("showmirostat").click();
expect(await page.locator('//*[@id="showmirostat"]').isChecked()).toBeFalsy();
// shown_ctx
await page.locator('//*[@id="shown_ctx"]').click();
expect(await page.locator('//*[@id="shown_ctx"]').isChecked()).toBeFalsy();
// shown_gpu_layers
await page.locator('//*[@id="shown_gpu_layers"]').click();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="shown_gpu_layers"]').isChecked()
await page.locator('//*[@id="showmirostat_eta"]').isChecked()
).toBeTruthy();
await page.getByTestId("showmirostat_eta").click();
expect(
await page.locator('//*[@id="showmirostat_eta"]').isChecked()
).toBeFalsy();
// shown_parts
await page.locator('//*[@id="shown_parts"]').click();
expect(await page.locator('//*[@id="shown_parts"]').isChecked()).toBeFalsy();
// shown_threads
await page.locator('//*[@id="shown_threads"]').click();
await page.getByTestId("showmirostat_tau").click();
expect(
await page.locator('//*[@id="shown_threads"]').isChecked()
await page.locator('//*[@id="showmirostat_tau"]').isChecked()
).toBeTruthy();
await page.getByTestId("showmirostat_tau").click();
expect(
await page.locator('//*[@id="showmirostat_tau"]').isChecked()
).toBeFalsy();
// showrepeat_penalty
await page.locator('//*[@id="showrepeat_penalty"]').click();
await page.getByTestId("showmodel").click();
expect(await page.locator('//*[@id="showmodel"]').isChecked()).toBeFalsy();
await page.getByTestId("showmodel").click();
expect(await page.locator('//*[@id="showmodel"]').isChecked()).toBeTruthy();
await page.getByTestId("shownum_ctx").click();
expect(await page.locator('//*[@id="shownum_ctx"]').isChecked()).toBeTruthy();
await page.getByTestId("shownum_ctx").click();
expect(await page.locator('//*[@id="shownum_ctx"]').isChecked()).toBeFalsy();
await page.getByTestId("shownum_gpu").click();
expect(await page.locator('//*[@id="shownum_gpu"]').isChecked()).toBeTruthy();
await page.getByTestId("shownum_gpu").click();
expect(await page.locator('//*[@id="shownum_gpu"]').isChecked()).toBeFalsy();
await page.getByTestId("shownum_thread").click();
expect(
await page.locator('//*[@id="showrepeat_penalty"]').isChecked()
await page.locator('//*[@id="shownum_thread"]').isChecked()
).toBeTruthy();
await page.getByTestId("shownum_thread").click();
expect(
await page.locator('//*[@id="shownum_thread"]').isChecked()
).toBeFalsy();
// showrope_freq_base
await page.locator('//*[@id="showrope_freq_base"]').click();
await page.getByTestId("showrepeat_last_n").click();
expect(
await page.locator('//*[@id="showrope_freq_base"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showrepeat_last_n"]').isChecked()
).toBeTruthy();
// showrope_freq_scale
await page.locator('//*[@id="showrope_freq_scale"]').click();
await page.getByTestId("showrepeat_last_n").click();
expect(
await page.locator('//*[@id="showrope_freq_scale"]').isChecked()
).toBeFalsy();
// showseed
await page.locator('//*[@id="showseed"]').click();
expect(await page.locator('//*[@id="showseed"]').isChecked()).toBeFalsy();
// showstop
await page.locator('//*[@id="showstop"]').click();
expect(await page.locator('//*[@id="showstop"]').isChecked()).toBeFalsy();
// showstreaming
await page.locator('//*[@id="showstreaming"]').click();
expect(
await page.locator('//*[@id="showstreaming"]').isChecked()
).toBeFalsy();
// showsuffix
await page.locator('//*[@id="showsuffix"]').click();
expect(await page.locator('//*[@id="showsuffix"]').isChecked()).toBeFalsy();
// showtags
await page.locator('//*[@id="showtags"]').click();
expect(await page.locator('//*[@id="showtags"]').isChecked()).toBeFalsy();
// showtop_k
await page.locator('//*[@id="showtop_k"]').click();
expect(await page.locator('//*[@id="showtop_k"]').isChecked()).toBeFalsy();
// showtop_p
await page.locator('//*[@id="showtop_p"]').click();
expect(await page.locator('//*[@id="showtop_p"]').isChecked()).toBeFalsy();
// showuse_mlock
await page.locator('//*[@id="showuse_mlock"]').click();
expect(
await page.locator('//*[@id="showuse_mlock"]').isChecked()
).toBeFalsy();
// showuse_mmap
await page.locator('//*[@id="showuse_mmap"]').click();
expect(await page.locator('//*[@id="showuse_mmap"]').isChecked()).toBeFalsy();
// showverbose
await page.locator('//*[@id="showverbose"]').click();
expect(await page.locator('//*[@id="showverbose"]').isChecked()).toBeFalsy();
// showvocab_only
await page.locator('//*[@id="showvocab_only"]').click();
expect(
await page.locator('//*[@id="showvocab_only"]').isChecked()
await page.locator('//*[@id="showrepeat_last_n"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="saveChangesBtn"]').click();

26
src/frontend/tests/end-to-end/flowPage.spec.ts
View file

@ -1,36 +1,42 @@
import { Page, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(6000);
// test.setTimeout(120000);
});
test.describe("Flow Page tests", () => {
async function goToFlowPage(page: Page) {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.getByRole("button", { name: "New Project" }).click();
}
test("save", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("custom");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.locator('//*[@id="helpersCustom Component"]')
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
// await page.getByTestId("icon-ExternalLink").click();
// await page.locator('//*[@id="checkAndSaveBtn"]').click();
});

32
src/frontend/tests/end-to-end/group.spec.ts
View file

@ -1,4 +1,4 @@
import { expect, test } from "@playwright/test";
import { test } from "@playwright/test";
test.describe("group node test", () => {
/// <reference lib="dom"/>
@ -6,24 +6,22 @@ test.describe("group node test", () => {
await page.goto("/");
await page.locator('//*[@id="new-project-btn"]').click();
await page.getByRole("heading", { name: "Data Ingestion" }).click();
await page
.getByRole("heading", { name: "Basic Prompting" })
.first()
.click();
await page.waitForTimeout(2000);
await page.getByLabel("fit view").click();
await page.keyboard.down("Control");
await page
.getByTestId("title-OpenAIEmbeddings")
.click({ modifiers: ["Control"] });
await page.getByTestId("title-URL").click({ modifiers: ["Control"] });
await page
.getByTestId("title-Recursive Character Text Splitter")
.click({ modifiers: ["Control"] });
await page.keyboard.up("Control");
await page.getByLabel("fit view").first().click();
await page.getByTestId("title-OpenAI").click({ modifiers: ["Control"] });
await page.getByTestId("title-Prompt").click({ modifiers: ["Control"] });
await page.getByTestId("title-OpenAI").click({ modifiers: ["Control"] });
await page.getByRole("button", { name: "Group" }).click();
await page.getByTestId(/input-collection_name_Chroma-.*/).click();
await page.getByTestId(/input-collection_name_Chroma-.*/).fill("test");
await page.getByTestId("title-Group").click();
await page.getByTestId("title-Group").dblclick();
await page.getByTestId("input-title-Group").first().fill("test");
await page.getByTestId("icon-Ungroup").first().click();
await page.keyboard.press("Control+g");
const value = await page.getByTestId("input-collection_name").inputValue();
expect(value).toBe("test");
await page.getByTestId("title-OpenAI").isVisible();
await page.getByTestId("title-Prompt").isVisible();
});
});

25
src/frontend/tests/end-to-end/inputComponent.spec.ts
View file

@ -1,29 +1,36 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(8000);
// test.setTimeout(120000);
});
test("InputComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("Chroma");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("vectorstoresChroma")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("input-collection_name").click();
await page
.getByTestId("input-collection_name")

190
src/frontend/tests/end-to-end/inputListComponent.spec.ts Normal file
View file

@ -0,0 +1,190 @@
import { expect, test } from "@playwright/test";
test("InputListComponent", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("astradb search");
await page.waitForTimeout(1000);
await page
.getByTestId("vectorsearchAstraDB Search")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("div-generic-node").click();
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
expect(
await page.getByTestId("showmetadata_indexing_exclude").isChecked()
).toBeFalsy();
await page.getByTestId("showmetadata_indexing_exclude").click();
expect(
await page.getByTestId("showmetadata_indexing_exclude").isChecked()
).toBeTruthy();
expect(
await page.getByTestId("showmetadata_indexing_include").isChecked()
).toBeFalsy();
await page.getByTestId("showmetadata_indexing_include").click();
expect(
await page.getByTestId("showmetadata_indexing_include").isChecked()
).toBeTruthy();
await page
.getByTestId("input-list-input-edit_metadata_indexing_include-0")
.fill("test test test test");
await page
.getByTestId("input-list-plus-btn-edit_metadata_indexing_include-0")
.click();
await page
.getByTestId("input-list-input-edit_metadata_indexing_include-1")
.fill("test1 test1 test1 test1");
await page.locator('//*[@id="saveChangesBtn"]').click();
await page
.getByTestId("input-list-input_metadata_indexing_include-0")
.fill("test test test test");
const value0 = await page
.getByTestId("input-list-input_metadata_indexing_include-0")
.inputValue();
const value1 = await page
.getByTestId("input-list-input_metadata_indexing_include-1")
.inputValue();
if (
value0 !== "test test test test" ||
value1 !== "test1 test1 test1 test1"
) {
expect(false).toBeTruthy();
}
await page
.getByTestId("input-list-minus-btn_metadata_indexing_include-0")
.click();
const plusButtonLocator = page.getByTestId(
"input-list-plus-btn_metadata_indexing_include-1"
);
const elementCount = await plusButtonLocator.count();
if (elementCount > 0) {
expect(false).toBeTruthy();
}
await page
.getByTestId("input-list-plus-btn_metadata_indexing_include-0")
.click();
await page
.getByTestId("input-list-plus-btn_metadata_indexing_include-1")
.click();
await page
.getByTestId("input-list-plus-btn_metadata_indexing_include-2")
.click();
await page
.getByTestId("input-list-plus-btn_metadata_indexing_include-3")
.click();
await page
.getByTestId("input-list-input_metadata_indexing_include-0")
.fill("test test test test");
await page
.getByTestId("input-list-input_metadata_indexing_include-1")
.fill("test1 test1 test1 test1");
await page
.getByTestId("input-list-input_metadata_indexing_include-2")
.fill("test2 test2 test2 test2");
await page
.getByTestId("input-list-input_metadata_indexing_include-3")
.fill("test3 test3 test3 test3");
await page.getByTestId("div-generic-node").click();
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
const value0Edit = await page
.getByTestId("input-list-input-edit_metadata_indexing_include-0")
.inputValue();
const value1Edit = await page
.getByTestId("input-list-input-edit_metadata_indexing_include-1")
.inputValue();
const value2Edit = await page
.getByTestId("input-list-input-edit_metadata_indexing_include-2")
.inputValue();
const value3Edit = await page
.getByTestId("input-list-input-edit_metadata_indexing_include-3")
.inputValue();
if (
value0Edit !== "test test test test" ||
value1Edit !== "test1 test1 test1 test1" ||
value2Edit !== "test2 test2 test2 test2" ||
value3Edit !== "test3 test3 test3 test3"
) {
expect(false).toBeTruthy();
}
await page
.getByTestId("input-list-minus-btn-edit_metadata_indexing_include-0")
.click();
await page
.getByTestId("input-list-minus-btn-edit_metadata_indexing_include-1")
.click();
await page
.getByTestId("input-list-minus-btn-edit_metadata_indexing_include-1")
.click();
const plusButtonLocatorEdit0 = await page.getByTestId(
"input-list-plus-btn-edit_metadata_indexing_include-0"
);
const elementCountEdit0 = await plusButtonLocatorEdit0.count();
const plusButtonLocatorEdit2 = await page.getByTestId(
"input-list-plus-btn-edit_metadata_indexing_include-2"
);
const elementCountEdit2 = await plusButtonLocatorEdit2.count();
if (elementCountEdit0 > 0 || elementCountEdit2 > 0) {
expect(false).toBeTruthy();
}
const minusButtonLocatorEdit1 = await page.getByTestId(
"input-list-minus-btn-edit_metadata_indexing_include-1"
);
const elementCountMinusEdit1 = await minusButtonLocatorEdit1.count();
const minusButtonLocatorEdit2 = await page.getByTestId(
"input-list-minus-btn-edit_metadata_indexing_include-2"
);
const elementCountMinusEdit2 = await minusButtonLocatorEdit2.count();
if (elementCountMinusEdit1 > 0 || elementCountMinusEdit2 > 0) {
expect(false).toBeTruthy();
}
});

64
src/frontend/tests/end-to-end/intComponent.spec.ts
View file

@ -1,30 +1,37 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(9000);
// test.setTimeout(120000);
});
test("IntComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("openai");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("modelsOpenAI")
.getByTestId("model_specsChatOpenAI")
.first()
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("int-input-max_tokens").click();
await page
.getByTestId("int-input-max_tokens")
@ -45,6 +52,19 @@ test("IntComponent", async ({ page }) => {
expect(false).toBeTruthy();
}
await page.getByTestId("title-ChatOpenAI").click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("more-options-modal").click();
await page.getByTestId("edit-button-modal").click();
@ -59,11 +79,6 @@ test("IntComponent", async ({ page }) => {
.getByTestId("edit-int-input-max_tokens")
.fill("123456789123456789123456789");
await page.locator('//*[@id="showinput_value"]').click();
expect(
await page.locator('//*[@id="showinput_value"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
@ -84,19 +99,11 @@ test("IntComponent", async ({ page }) => {
await page.locator('//*[@id="showopenai_api_key"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showstream"]').click();
expect(await page.locator('//*[@id="showstream"]').isChecked()).toBeFalsy();
await page.locator('//*[@id="showtemperature"]').click();
expect(
await page.locator('//*[@id="showtemperature"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showinput_value"]').click();
expect(
await page.locator('//*[@id="showinput_value"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
@ -117,19 +124,11 @@ test("IntComponent", async ({ page }) => {
await page.locator('//*[@id="showopenai_api_key"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showstream"]').click();
expect(await page.locator('//*[@id="showstream"]').isChecked()).toBeTruthy();
await page.locator('//*[@id="showtemperature"]').click();
expect(
await page.locator('//*[@id="showtemperature"]').isChecked()
).toBeTruthy();
await page.locator('//*[@id="showinput_value"]').click();
expect(
await page.locator('//*[@id="showinput_value"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(
await page.locator('//*[@id="showmodel_kwargs"]').isChecked()
@ -150,9 +149,6 @@ test("IntComponent", async ({ page }) => {
await page.locator('//*[@id="showopenai_api_key"]').isChecked()
).toBeFalsy();
await page.locator('//*[@id="showstream"]').click();
expect(await page.locator('//*[@id="showstream"]').isChecked()).toBeFalsy();
await page.locator('//*[@id="showtemperature"]').click();
expect(
await page.locator('//*[@id="showtemperature"]').isChecked()

25
src/frontend/tests/end-to-end/keyPairListComponent.spec.ts
View file

@ -1,29 +1,36 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(20000);
// test.setTimeout(120000);
});
test("KeypairListComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("csv");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("documentloadersCSVLoader")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.locator('//*[@id="keypair0"]').click();
await page.locator('//*[@id="keypair0"]').fill("testtesttesttest");
await page.locator('//*[@id="keypair100"]').click();

46
src/frontend/tests/end-to-end/langflowShortcuts.spec.ts
View file

@ -1,9 +1,5 @@
import { expect, test } from "@playwright/test";
import uaParser from "ua-parser-js";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(11000);
// test.setTimeout(120000);
});
test("LangflowShortcuts", async ({ page }) => {
const getUA = await page.evaluate(() => navigator.userAgent);
const userAgentInfo = uaParser(getUA);
@ -13,7 +9,7 @@ test("LangflowShortcuts", async ({ page }) => {
control = "Meta";
}
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
@ -21,26 +17,38 @@ test("LangflowShortcuts", async ({ page }) => {
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("llamacpp");
await page.getByPlaceholder("Search").fill("ollama");
await page.waitForTimeout(1000);
await page
.locator('//*[@id="model_specsLlamaCpp"]')
.getByTestId("modelsOllama")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.getByTestId("title-LlamaCpp").click();
await page.keyboard.press(`${control}+e`);
await page.locator('//*[@id="react-flow-id"]/div/div[2]/button[3]').click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("title-Ollama").click();
await page.keyboard.press(`${control}+Shift+A`);
await page.locator('//*[@id="saveChangesBtn"]').click();
await page.getByTestId("title-LlamaCpp").click();
await page.getByTestId("title-Ollama").click();
await page.keyboard.press(`${control}+d`);
let numberOfNodes = await page.getByTestId("title-LlamaCpp").count();
let numberOfNodes = await page.getByTestId("title-Ollama").count();
if (numberOfNodes != 2) {
expect(false).toBeTruthy();
}
@ -52,18 +60,18 @@ test("LangflowShortcuts", async ({ page }) => {
.click();
await page.keyboard.press("Backspace");
numberOfNodes = await page.getByTestId("title-LlamaCpp").count();
numberOfNodes = await page.getByTestId("title-Ollama").count();
if (numberOfNodes != 1) {
expect(false).toBeTruthy();
}
await page.getByTestId("title-LlamaCpp").click();
await page.getByTestId("title-Ollama").click();
await page.keyboard.press(`${control}+c`);
await page.getByTestId("title-LlamaCpp").click();
await page.getByTestId("title-Ollama").click();
await page.keyboard.press(`${control}+v`);
numberOfNodes = await page.getByTestId("title-LlamaCpp").count();
numberOfNodes = await page.getByTestId("title-Ollama").count();
if (numberOfNodes != 2) {
expect(false).toBeTruthy();
}
@ -75,15 +83,15 @@ test("LangflowShortcuts", async ({ page }) => {
.click();
await page.keyboard.press("Backspace");
await page.getByTestId("title-LlamaCpp").click();
await page.getByTestId("title-Ollama").click();
await page.keyboard.press(`${control}+x`);
numberOfNodes = await page.getByTestId("title-LlamaCpp").count();
numberOfNodes = await page.getByTestId("title-Ollama").count();
if (numberOfNodes != 0) {
expect(false).toBeTruthy();
}
await page.keyboard.press(`${control}+v`);
numberOfNodes = await page.getByTestId("title-LlamaCpp").count();
numberOfNodes = await page.getByTestId("title-Ollama").count();
if (numberOfNodes != 1) {
expect(false).toBeTruthy();
}

15
src/frontend/tests/end-to-end/nestedComponent.spec.ts
View file

@ -1,22 +1,19 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(12000);
// test.setTimeout(120000);
});
test("NestedComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("pinecone");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("vectorstoresPinecone")

30
src/frontend/tests/end-to-end/promptModalComponent.spec.ts
View file

@ -1,33 +1,38 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(13000);
// test.setTimeout(120000);
});
test("PromptTemplateComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("prompt");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.locator('//*[@id="inputsPrompt"]')
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("prompt-input-template").click();
// await page.getByTestId("edit-prompt-sanitized").click();
// await page.getByTestId("modal-title").click();
await page
.getByTestId("modal-prompt-input-template")
.fill("{prompt} example {prompt1}");
@ -63,7 +68,8 @@ test("PromptTemplateComponent", async ({ page }) => {
await page.getByTestId("save-button-modal").click();
const replace = await page.getByTestId("replace-button");
const replace = await page.getByTestId("replace-button").isVisible();
if (replace) {
await page.getByTestId("replace-button").click();
}

2
src/frontend/tests/end-to-end/python_api_generation.spec.ts
View file

@ -4,7 +4,7 @@ test("python_api_generation", async ({ page, context }) => {
await page.goto("/");
await page.locator('//*[@id="new-project-btn"]').click();
await context.grantPermissions(["clipboard-read", "clipboard-write"]);
await page.getByRole("heading", { name: "Data Ingestion" }).click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForTimeout(2000);
await page.getByText("API", { exact: true }).click();
await page.getByRole("tab", { name: "Python API" }).click();

29
src/frontend/tests/end-to-end/saveComponents.spec.ts
View file

@ -1,9 +1,6 @@
import { Page, expect, test } from "@playwright/test";
import { readFileSync } from "fs";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(14000);
// test.setTimeout(120000);
});
test.describe("save component tests", () => {
async function saveComponent(page: Page, pattern: RegExp, n: number) {
for (let i = 0; i < n; i++) {
@ -14,11 +11,11 @@ test.describe("save component tests", () => {
/// <reference lib="dom"/>
test("save group component tests", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.locator('//*[@id="new-project-btn"]').click();
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
// Read your file into a buffer.
const jsonContent = readFileSync(
@ -37,7 +34,7 @@ test.describe("save component tests", () => {
return dt;
}, jsonContent);
page.waitForTimeout(2000);
page.waitForTimeout(1000);
// Now dispatch
await page.dispatchEvent(
@ -85,15 +82,15 @@ test.describe("save component tests", () => {
await page.getByTestId("title-Group").click();
await page.getByTestId("icon-SaveAll").click();
const replaceButton = page.getByTestId("replace-button");
const replaceButton = await page.getByTestId("replace-button").isVisible();
if (replaceButton) {
await replaceButton.click();
await page.getByTestId("replace-button").click();
}
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("group");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("saved_componentsGroup")
@ -101,7 +98,17 @@ test.describe("save component tests", () => {
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
textArea = page.getByTestId("div-textarea-description");
elementCountText = await textArea.count();
if (elementCountText > 0) {

218
src/frontend/tests/end-to-end/store.spec.ts Normal file
View file

@ -0,0 +1,218 @@
import { expect, test } from "@playwright/test";
test("should exists Store", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").isVisible();
await page.getByTestId("button-store").isEnabled();
});
test("should not have an API key", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(2000);
await page.getByText("API Key Error").isVisible();
});
test("should find a searched Component on Store", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByTestId("search-store-input").fill("File Loader");
await page.getByTestId("search-store-button").click();
await page.getByText("File Loader").isVisible();
await page.getByTestId("search-store-input").fill("Basic RAG");
await page.getByTestId("search-store-button").click();
await page.getByText("Basic RAG").isVisible();
await page.getByTestId("search-store-input").fill("YouTube QA");
await page.getByTestId("search-store-button").click();
await page.getByText("YouTube QA").isVisible();
});
test("should filter by tag", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByTestId("tag-selector-Agent").click();
await page.getByText("File Loader").isVisible();
await page.getByTestId("tag-selector-Agent").click();
await page.getByText("Album Cover Builder").isVisible();
await page.getByTestId("tag-selector-Memory").click();
await page.getByText("MP3 QA12").isVisible();
await page.getByTestId("tag-selector-Chain").click();
await page.getByText("There are no").isVisible();
await page.getByTestId("tag-selector-Chain").click();
await page.getByTestId("tag-selector-Vector Store").click();
await page.getByText("MP3 QA12").isVisible();
await page.getByTestId("tag-selector-Vector Store").click();
await page.getByTestId("tag-selector-Memory").click();
await page.getByText("Basic RAG").isVisible();
});
test("should order the visualization", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByText("Basic RAG").isVisible();
await page.getByTestId("select-order-store").click();
await page.getByText("Alphabetical").click();
await page.getByText("Album Cover Builder").isVisible();
await page.getByTestId("select-order-store").click();
await page.getByText("Popular").click();
await page.getByText("Basic RAG").isVisible();
});
test("should filter by type", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByText("Website Content QA").isVisible();
await page.getByTestId("flows-button-store").click();
await page.waitForTimeout(3000);
let iconGroup = await page.getByTestId("icon-Group").count();
expect(iconGroup).not.toBe(0);
await page.getByText("icon-ToyBrick").isHidden();
await page.getByTestId("components-button-store").click();
await page.waitForTimeout(3000);
await page.getByTestId("icon-Group").isHidden();
let toyBrick = await page.getByTestId("icon-ToyBrick").count();
expect(toyBrick).not.toBe(0);
await page.getByTestId("all-button-store").click();
await page.waitForTimeout(3000);
iconGroup = await page.getByTestId("icon-Group").count();
toyBrick = await page.getByTestId("icon-ToyBrick").count();
if (iconGroup === 0 || toyBrick === 0) {
expect(false).toBe(true);
}
});
test("should add API-KEY", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByTestId("api-key-button-store").click();
await page
.getByPlaceholder("Insert your API Key")
.fill("testtesttesttesttesttest");
await page.getByTestId("api-key-save-button-store").click();
await page.waitForTimeout(2000);
await page.getByText("Success! Your API Key has been saved.").isVisible();
await page.waitForTimeout(2000);
await page.getByText("API Key Error").isVisible();
await page.getByTestId("api-key-button-store").click();
await page
.getByPlaceholder("Insert your API Key")
.fill("x1fOKU0v2e5zL5d-BZW6CxZBZvoyuFgF");
await page.getByTestId("api-key-save-button-store").click();
await page.waitForTimeout(2000);
await page.getByText("Success! Your API Key has been saved.").isVisible();
await page.waitForTimeout(2000);
await page.getByText("API Key Error").isHidden();
});
test("should like and add components and flows", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.getByTestId("button-store").click();
await page.waitForTimeout(1000);
await page.getByTestId("api-key-button-store").click();
await page
.getByPlaceholder("Insert your API Key")
.fill("x1fOKU0v2e5zL5d-BZW6CxZBZvoyuFgF");
await page.getByTestId("api-key-save-button-store").click();
await page.waitForTimeout(2000);
await page.getByText("Success! Your API Key has been saved.").isVisible();
await page.waitForTimeout(2000);
await page.getByText("API Key Error").isHidden();
const likedValue = await page
.getByTestId("likes-Website Content QA")
.innerText();
await page.getByTestId("like-Website Content QA").click();
await page.waitForTimeout(5000);
const likedValueAfter = await page
.getByTestId("likes-Website Content QA")
.innerText();
if (Number(likedValue) === Number(likedValueAfter)) {
expect(false).toBe(true);
}
const downloadValue = await page
.getByTestId("downloads-Website Content QA")
.innerText();
await page.getByTestId("install-Website Content QA").click();
await page.waitForTimeout(2000);
await page.getByText("Flow Installed Successfully").isVisible();
await page.waitForTimeout(5000);
const downloadValueAfter = await page
.getByTestId("downloads-Website Content QA")
.innerText();
if (Number(downloadValue) === Number(downloadValueAfter)) {
expect(false).toBe(true);
}
await page.getByTestId("install-Basic RAG").click();
await page.waitForTimeout(2000);
await page.getByText("Component Installed Successfully").isVisible();
await page.waitForTimeout(5000);
await page.getByText("My Collection").click();
await page.getByText("Website Content QA").first().isVisible();
await page.getByTestId("sidebar-nav-Components").click();
await page.getByText("Basic RAG").first().isVisible();
});

74
src/frontend/tests/end-to-end/textAreaModalComponent.spec.ts Normal file
View file

@ -0,0 +1,74 @@
import { expect, test } from "@playwright/test";
test("TextAreaModalComponent", async ({ page }) => {
await page.goto("http://localhost:3000/");
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(1000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("prompt");
await page.waitForTimeout(1000);
await page
.locator('//*[@id="inputsPrompt"]')
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("prompt-input-template").click();
await page.getByTestId("modal-prompt-input-template").fill("{text}");
let valueBadgeOne = await page.locator('//*[@id="badge0"]').innerText();
if (valueBadgeOne != "text") {
expect(false).toBeTruthy();
}
await page.getByTestId("genericModalBtnSave").click();
await page
.getByTestId("textarea-text")
.fill(
"test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!"
);
await page.getByTestId("textarea-text-ExternalLink").click();
await page.waitForTimeout(500);
const value = await page.getByTestId("text-area-modal").inputValue();
if (
value !=
"test test test test test test test test test test test !@#%*)( 123456789101010101010101111111111 !!!!!!!!!!"
) {
expect(false).toBeTruthy();
}
await page.getByTestId("text-area-modal").fill("test123123");
await page.getByTestId("genericModalBtnSave").click();
const valueTextArea = await page.getByTestId("textarea-text").inputValue();
if (valueTextArea != "test123123") {
expect(false).toBeTruthy();
}
});

28
src/frontend/tests/end-to-end/toggleComponent.spec.ts
View file

@ -1,27 +1,37 @@
import { expect, test } from "@playwright/test";
test.beforeEach(async ({ page }) => {
// await page.waitForTimeout(15000);
// test.setTimeout(120000);
});
test("ToggleComponent", async ({ page }) => {
await page.goto("/");
await page.goto("http:localhost:3000/");
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("blank-flow").click();
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page.getByTestId("extended-disclosure").click();
await page.getByPlaceholder("Search").click();
await page.getByPlaceholder("Search").fill("directoryLoader");
await page.waitForTimeout(2000);
await page.waitForTimeout(1000);
await page
.getByTestId("documentloadersDirectoryLoader")
.dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page
.locator('//*[@id="react-flow-id"]/div[1]/div[2]/button[2]')
.click();
await page.getByTestId("div-generic-node").click();
await page.getByTestId("more-options-modal").click();

15
src/frontend/tests/end-to-end/tweaks_test.spec.ts
View file

@ -4,7 +4,7 @@ test("curl_api_generation", async ({ page, context }) => {
await page.goto("/");
await page.locator('//*[@id="new-project-btn"]').click();
await context.grantPermissions(["clipboard-read", "clipboard-write"]);
await page.getByRole("heading", { name: "Data Ingestion" }).click();
await page.getByRole("heading", { name: "Basic Prompting" }).click();
await page.waitForTimeout(2000);
await page.getByText("API", { exact: true }).click();
await page.getByRole("tab", { name: "cURL" }).click();
@ -17,15 +17,22 @@ test("curl_api_generation", async ({ page, context }) => {
expect(clipboardContent.length).toBeGreaterThan(0);
await page.getByRole("tab", { name: "Tweaks" }).click();
await page
.getByRole("heading", { name: "URL" })
.getByRole("heading", { name: "OpenAi" })
.locator("div")
.first()
.click();
await page.getByRole("textbox", { name: "Type something..." }).click();
await page
.getByRole("textbox", { name: "Type something..." })
.first()
.click();
await page
.getByRole("textbox", { name: "Type something..." })
.first()
.press("Control+a");
await page.getByRole("textbox", { name: "Type something..." }).fill("teste");
await page
.getByRole("textbox", { name: "Type something..." })
.first()
.fill("teste");
await page.getByRole("tab", { name: "cURL" }).click();
await page.getByRole("button", { name: "Copy Code" }).click();
const handle2 = await page.evaluateHandle(() =>