add new test to store
This commit is contained in:
parent
cdf9ac9da0
commit
c6b04d20b3
8 changed files with 1993 additions and 1757 deletions
File diff suppressed because it is too large
Load diff
|
|
@ -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"}
|
||||
|
|
|
|||
|
|
@ -103,6 +103,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>
|
||||
|
|
|
|||
|
|
@ -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(
|
||||
|
|
|
|||
|
|
@ -88,6 +88,7 @@ export function TagsSelector({
|
|||
updateTags(tag.name);
|
||||
}}
|
||||
key={idx}
|
||||
data-testid={`tag-selector-${tag.name}`}
|
||||
>
|
||||
<Badge
|
||||
key={idx}
|
||||
|
|
|
|||
|
|
@ -129,6 +129,7 @@ export default function StoreApiKeyModal({
|
|||
|
||||
<Form.Submit asChild>
|
||||
<Button
|
||||
data-testid="api-key-save-button-store"
|
||||
className="mt-8"
|
||||
onClick={() => {
|
||||
handleSaveKey();
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
218
src/frontend/tests/end-to-end/store.spec.ts
Normal file
218
src/frontend/tests/end-to-end/store.spec.ts
Normal 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();
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue