Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add testing for edits

Browse Source
This commit is contained in:
Abi Raja 2024-05-17 17:06:51 -04:00
parent 610400bc49
commit 992344ac8d
1 changed files with 98 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
frontend/src/tests/qa.test.ts
View File

@ -11,8 +11,15 @@ describe("Simple Puppeteer Test", () => {
let browser: Browser;
let page: Page;
const DEBUG = true;
const stacks = Object.values(Stack).slice(0, DEBUG ? 1 : undefined);
const models = Object.values(CodeGenerationModel).slice(
0,
DEBUG ? 1 : undefined
);
beforeAll(async () => {
browser = await puppeteer.launch({ headless: true });
browser = await puppeteer.launch({ headless: false });
page = await browser.newPage();
await page.goto("http://localhost:5173/");
@ -33,47 +40,70 @@ describe("Simple Puppeteer Test", () => {
await browser.close();
});
const stacks = Object.values(Stack).slice(0, 1);
const models = Object.values(CodeGenerationModel);
// For debugging
//.slice(0, 1);
models.forEach((model) => {
stacks.forEach((stack) => {
it(`should load the homepage and check the title for stack: ${stack}`, async () => {
const testId = `${model}_${stack}`;
it(
`should load the homepage and check the title for stack: ${stack}`,
async () => {
const testId = `${model}_${stack}`;
const screenshotPathPrefix = `${SCREENSHOTS_PATH}/${testId}`;
await setupLocalStorage(page, stack, model);
await setupLocalStorage(page, stack, model);
// Upload file
const fileInput = (await page.$(
".file-input"
)) as ElementHandle<HTMLInputElement>;
// Upload file
const fileInput = (await page.$(
".file-input"
)) as ElementHandle<HTMLInputElement>;
if (!fileInput) {
throw new Error("File input element not found");
}
await fileInput.uploadFile(IMAGE_PATH);
// Screenshot the first step
await page.screenshot({
path: `${SCREENSHOTS_PATH}/${testId}_image_uploaded.png`,
});
// Click the generate button and wait for the code to be generated
await page.waitForNetworkIdle();
await page.waitForFunction(
() => document.body.innerText.includes("v1"),
{
timeout: 30000,
if (!fileInput) {
throw new Error("File input element not found");
}
);
await page.screenshot({
path: `${SCREENSHOTS_PATH}/${testId}_image_results.png`,
});
});
await fileInput.uploadFile(IMAGE_PATH);
// Screenshot the first step
await page.screenshot({
path: `${screenshotPathPrefix}_image_uploaded.png`,
});
// Click the generate button and wait for the code to be generated
await page.waitForNetworkIdle();
await page.waitForFunction(
() => document.body.innerText.includes("v1"),
{
timeout: 30000,
}
);
await page.screenshot({
path: `${screenshotPathPrefix}_image_results.png`,
});
await makeEdit(
page,
"make the header blue",
"v2",
screenshotPathPrefix
);
await makeEdit(
page,
"make all text italic",
"v3",
screenshotPathPrefix
);
await page.evaluate(() => {
document.querySelectorAll("div").forEach((div) => {
if (div.innerText.includes("v2")) {
div.click();
}
});
});
await makeEdit(page, "make all text red", "v4", screenshotPathPrefix);
},
60 * 1000
);
});
});
});
@ -98,3 +128,35 @@ async function setupLocalStorage(page: Page, stack: string, model: string) {
// Reload the page to apply the local storage
await page.reload();
}
async function makeEdit(
page: Page,
edit: string,
version: string,
screenshotPathPrefix: string
) {
await page.type(
'textarea[placeholder="Tell the AI what to change..."]',
edit
);
await page.screenshot({
path: `${screenshotPathPrefix}_typed_${version}.png`,
});
await page.click(".update-btn");
console.log(version);
await page.waitForFunction(
(version: string) => document.body.innerText.includes(version),
{
timeout: 30000,
},
version
);
await page.screenshot({
path: `${screenshotPathPrefix}_done_${version}.png`,
});
}