fix unit + browser tests (#926)

This commit is contained in:
pngwn 2022-04-06 11:47:19 +01:00 committed by GitHub
parent bca035bde0
commit 5313a4edf1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 25 additions and 25 deletions

View File

@ -5,7 +5,7 @@
export let label: string;
export let value: string = " ";
export let default_value: string;
export let default_value: string | false = false;
export let style: string = "";
export let lines: number;
export let placeholder: string = "";

View File

@ -9,26 +9,26 @@ describe("Textbox", () => {
afterEach(() => cleanup());
test("renders provided value", () => {
const { container } = render(Textbox, {
theme: "default",
const { container, getByLabelText } = render(Textbox, {
lines: 1,
mode: "dynamic",
value: "hello world"
value: "hello world",
label: "Textbox"
});
const item: HTMLInputElement = container.querySelector(".input-text ")!;
const item: HTMLInputElement = getByLabelText("Textbox");
assert.equal(item.value, "hello world");
});
test("changing the text should update the value", async () => {
const { container, component } = render(Textbox, {
theme: "default",
const { component, getByLabelText } = render(Textbox, {
lines: 1,
mode: "dynamic",
value: ""
value: "",
label: "Textbox"
});
const item: HTMLInputElement = container.querySelector(".input-text ")!;
const item: HTMLInputElement = getByLabelText("Textbox");
const mock = spy();
component.$on("change", mock);
@ -46,15 +46,15 @@ describe("Textbox", () => {
});
test("component should respect placeholder", async () => {
const { container, component } = render(Textbox, {
theme: "default",
const { getByLabelText } = render(Textbox, {
lines: 1,
mode: "dynamic",
value: "",
placeholder: "placeholder text"
placeholder: "placeholder text",
label: "Textbox"
});
const item: HTMLInputElement = container.querySelector(".input-text ")!;
const item: HTMLInputElement = getByLabelText("Textbox");
assert.equal(item.placeholder, "placeholder text");
});
});

View File

@ -32,7 +32,7 @@ test("renders the correct elements", async ({ page }) => {
const description = await page.locator(".output-markdown");
await expect(description).toContainText("Detect Disease From Scan");
const checkboxes = await page.locator(".input-checkbox-group");
const checkboxes = await page.locator("data-testid=checkbox-group");
await expect(checkboxes).toContainText("Covid Malaria Lung Cancer");
const tabs = await page.locator("button", { hasText: /X-ray|CT Scan/ });
@ -58,8 +58,11 @@ test("can run an api request and display the data", async ({ page }) => {
await page.goto("http://localhost:3000");
await page.locator('button:has-text("Covid")').click();
await page.locator('button:has-text("Lung Cancer")').click();
// await page.locator('button:has-text("Covid")').click();
// await page.locator('button:has-text("Lung Cancer")').click();
await page.check("label:has-text('Covid')");
await page.check("label:has-text('Lung Cancer')");
const run_button = await page.locator("button", { hasText: /Run/ });
@ -69,10 +72,5 @@ test("can run an api request and display the data", async ({ page }) => {
]);
const json = await page.locator(".output-json");
await expect(await json.innerText()).toContain(
`{
Covid: 0.75,
Lung Cancer: 0.25
}`
);
await expect(json).toContainText(`Covid: 0.75, Lung Cancer: 0.25`);
});

View File

@ -30,12 +30,14 @@ test("a component acts as both input and output", async ({ page }) => {
await mock_api(page, [["world hello"]]);
await page.goto("http://localhost:3000");
const textbox = await page.locator(".input-text");
const textbox = await page.locator("label:has-text('None')");
const button = await page.locator("button");
await textbox.fill("hello world");
await Promise.all([button.click(), page.waitForResponse("**/api/predict/")]);
await expect(await page.inputValue(".input-text")).toEqual("world hello");
await expect(await page.inputValue("label:has-text('None')")).toEqual(
"world hello"
);
});

View File

@ -25,7 +25,7 @@
>
<BlockTitle>{label}</BlockTitle>
<div class="flex flex-wrap gap-2">
<div class="flex flex-wrap gap-2" data-testid="checkbox-group">
{#each choices as choice, i}
<label class="gr-box gr-box-sm ">
<input