fix(parameterComponent): add unique id to textarea and input components for accessibility and testing purposes
fix(codeAreaComponent): add id prop to Input component for accessibility and testing purposes fix(promptComponent): add id prop to GenericModal and span elements for accessibility and testing purposes fix(textAreaComponent): add id prop to Input component for accessibility and testing purposes fix(EditNodeModal): add unique id to textarea and input components for accessibility and testing purposes fix(codeAreaModal): add id prop to Input component for accessibility and testing purposes fix(genericModal): add id prop to GenericModal and span elements for accessibility and testing purposes fix(components/types): add id prop to component types for consistency and future use feat(tests): add tests for CodeAreaModalComponent and PromptTemplateComponent
This commit is contained in:
cristhianzl
parent
ecf99cf179
commit
88657553cb
10 changed files with 347 additions and 2 deletions
144
src/frontend/tests/codeAreaModalComponent.spec.ts
Normal file
144
src/frontend/tests/codeAreaModalComponent.spec.ts
Normal file
|
|
@ -0,0 +1,144 @@
|
|||
import { expect, test } from "@playwright/test";
|
||||
|
||||
test("CodeAreaModalComponent", async ({ page }) => {
|
||||
await page.goto("http://localhost:3000/");
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page.locator('//*[@id="new-project-btn"]').click();
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page.getByPlaceholder("Search").click();
|
||||
await page.getByPlaceholder("Search").fill("pythonfunctiontool");
|
||||
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page
|
||||
.locator('//*[@id="sidePythonFunctionTool"]')
|
||||
.dragTo(page.locator('//*[@id="react-flow-id"]'));
|
||||
await page.mouse.up();
|
||||
await page.mouse.down();
|
||||
|
||||
await page.locator('//*[@id="code-input-0"]').click();
|
||||
|
||||
let value = await page.locator('//*[@id="codeValue"]').inputValue();
|
||||
|
||||
if (
|
||||
value !=
|
||||
'def python_function(text: str) -> str: """This is a default python function that returns the input text""" return text'
|
||||
) {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page.locator('//*[@id="checkAndSaveBtn"]').click();
|
||||
|
||||
await page
|
||||
.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div')
|
||||
.click();
|
||||
await page.locator('//*[@id="advancedIcon"]').click();
|
||||
await page.locator('//*[@id="editAdvancedBtn"]').click();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showdescription"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showdescription"]').isChecked()
|
||||
).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showname"]').click();
|
||||
expect(await page.locator('//*[@id="showname"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showreturn_direct"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showreturn_direct"]').isChecked()
|
||||
).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showdescription"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showdescription"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showname"]').click();
|
||||
expect(await page.locator('//*[@id="showname"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showreturn_direct"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showreturn_direct"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showdescription"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showdescription"]').isChecked()
|
||||
).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showname"]').click();
|
||||
expect(await page.locator('//*[@id="showname"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showreturn_direct"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showreturn_direct"]').isChecked()
|
||||
).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showdescription"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showdescription"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showname"]').click();
|
||||
expect(await page.locator('//*[@id="showname"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showreturn_direct"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showreturn_direct"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="saveChangesBtn"]').click();
|
||||
|
||||
const plusButtonLocator = page.locator('//*[@id="code-input-0"]');
|
||||
const elementCount = await plusButtonLocator.count();
|
||||
if (elementCount === 0) {
|
||||
expect(true).toBeTruthy();
|
||||
|
||||
await page
|
||||
.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div')
|
||||
.click();
|
||||
await page.locator('//*[@id="advancedIcon"]').click();
|
||||
await page.locator('//*[@id="editAdvancedBtn"]').click();
|
||||
|
||||
await page.locator('//*[@id="showcode"]').click();
|
||||
expect(await page.locator('//*[@id="showcode"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page
|
||||
.locator(
|
||||
'//*[@id="radix-:r2l:"]/div[2]/div/div[2]/div/div/div/table/tbody/tr[1]/td[2]/div/div/button/div/span'
|
||||
)
|
||||
.click();
|
||||
|
||||
let value = await page.locator('//*[@id="codeValue"]').inputValue();
|
||||
|
||||
if (
|
||||
value !=
|
||||
'def python_function(text: str) -> str: """This is a default python function that returns the input text""" return text'
|
||||
) {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page.locator('//*[@id="checkAndSaveBtn"]').click();
|
||||
|
||||
await page.locator('//*[@id="saveChangesBtn"]').click();
|
||||
|
||||
await page.locator('//*[@id="code-input-0"]').click();
|
||||
}
|
||||
});
|
||||
174
src/frontend/tests/promptModalComponent.spec.ts
Normal file
174
src/frontend/tests/promptModalComponent.spec.ts
Normal file
|
|
@ -0,0 +1,174 @@
|
|||
import { expect, test } from "@playwright/test";
|
||||
|
||||
test("PromptTemplateComponent", async ({ page }) => {
|
||||
await page.goto("http://localhost:3000/");
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page.locator('//*[@id="new-project-btn"]').click();
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page.getByPlaceholder("Search").click();
|
||||
await page.getByPlaceholder("Search").fill("promptTemplate");
|
||||
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
await page
|
||||
.locator('//*[@id="sidePromptTemplate"]')
|
||||
.dragTo(page.locator('//*[@id="react-flow-id"]'));
|
||||
await page.mouse.up();
|
||||
await page.mouse.down();
|
||||
|
||||
await page.locator('//*[@id="prompt-input-3"]').click();
|
||||
await page
|
||||
.locator('//*[@id="modal-prompt-input-3"]')
|
||||
.fill("{prompt} example {prompt1}");
|
||||
|
||||
let value = await page
|
||||
.locator('//*[@id="modal-prompt-input-3"]')
|
||||
.inputValue();
|
||||
|
||||
if (value != "{prompt} example {prompt1}") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
let valueBadgeOne = await page.locator('//*[@id="badge0"]').innerText();
|
||||
if (valueBadgeOne != "prompt") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
let valueBadgeTwo = await page.locator('//*[@id="badge1"]').innerText();
|
||||
if (valueBadgeTwo != "prompt1") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page.locator('//*[@id="genericModalBtnSave"]').click();
|
||||
|
||||
await page.locator('//*[@id="textarea-6"]').click();
|
||||
await page.locator('//*[@id="textarea-6"]').fill("prompt_value_!@#!@#");
|
||||
|
||||
value = await page.locator('//*[@id="textarea-6"]').inputValue();
|
||||
|
||||
if (value != "prompt_value_!@#!@#") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page.locator('//*[@id="textarea-7"]').click();
|
||||
await page
|
||||
.locator('//*[@id="textarea-7"]')
|
||||
.fill("prompt_name_test_123123!@#!@#");
|
||||
|
||||
value = await page.locator('//*[@id="textarea-7"]').inputValue();
|
||||
|
||||
if (value != "prompt_name_test_123123!@#!@#") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
value = await page.locator('//*[@id="prompt-input-3"]').innerText();
|
||||
|
||||
if (value != "{prompt} example {prompt1}") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page.locator('//*[@id="editAdvancedIcon"]').click();
|
||||
|
||||
value = await page.locator('//*[@id="textarea-edit-1"]').inputValue();
|
||||
|
||||
if (value != "prompt_value_!@#!@#") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
value = await page.locator('//*[@id="textarea-edit-2"]').inputValue();
|
||||
|
||||
if (value != "prompt_name_test_123123!@#!@#") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
value = await page.locator('//*[@id="prompt-area-edit0"]').innerText();
|
||||
|
||||
if (value != "{prompt} example {prompt1}") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
await page
|
||||
.locator('//*[@id="textarea-edit-2"]')
|
||||
.fill("prompt_edit_test_12312312321!@#$");
|
||||
await page
|
||||
.locator('//*[@id="textarea-edit-1"]')
|
||||
.fill("prompt_edit_test_44444444444!@#$");
|
||||
|
||||
await page.locator('//*[@id="showtemplate"]').click();
|
||||
expect(await page.locator('//*[@id="showtemplate"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showprompt"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showprompt1"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt1"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showtemplate"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showtemplate"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showprompt"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showprompt1"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt1"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showtemplate"]').click();
|
||||
expect(await page.locator('//*[@id="showtemplate"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showprompt"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showprompt1"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt1"]').isChecked()).toBeFalsy();
|
||||
|
||||
await page.locator('//*[@id="showtemplate"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showtemplate"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="showprompt"]').click();
|
||||
expect(await page.locator('//*[@id="showprompt"]').isChecked()).toBeTruthy();
|
||||
|
||||
await page.locator('//*[@id="saveChangesBtn"]').click();
|
||||
|
||||
const plusButtonLocator = page.locator('//*[@id="textarea-7"]');
|
||||
const elementCount = await plusButtonLocator.count();
|
||||
if (elementCount === 0) {
|
||||
expect(true).toBeTruthy();
|
||||
|
||||
await page
|
||||
.locator(
|
||||
'//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div/div[1]'
|
||||
)
|
||||
.click();
|
||||
|
||||
await page.locator('//*[@id="editAdvancedIcon"]').click();
|
||||
|
||||
await page.locator('//*[@id="showprompt1"]').click();
|
||||
expect(
|
||||
await page.locator('//*[@id="showprompt1"]').isChecked()
|
||||
).toBeTruthy();
|
||||
|
||||
value = await page.locator('//*[@id="textarea-edit-1"]').inputValue();
|
||||
|
||||
if (value != "prompt_edit_test_44444444444!@#$") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
value = await page.locator('//*[@id="textarea-edit-2"]').inputValue();
|
||||
|
||||
if (value != "prompt_edit_test_12312312321!@#$") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
|
||||
value = await page.locator('//*[@id="prompt-area-edit0"]').innerText();
|
||||
|
||||
if (value != "{prompt} example {prompt1}") {
|
||||
expect(false).toBeTruthy();
|
||||
}
|
||||
}
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue