dioxus/packages/playwright-tests/web.spec.js
Evan Almloff cab573eefd
Synchronous prevent default (#2792)
* add prevent default methods to the event

* sync prevent default almost working

* sync prevent default working

* Move event handling into the runtime

* update core tests

* restore desktop file dialog

* implement prevent default on web

* add a hint about the new prevent default method

* fix web prevent default

* Fix CTRL+click on links

* fix values memorize in place test

* Fix a few more tests

* Add a playwright test for sync prevent default

* Fix core doc tests

* create a deprecated VirtualDom::handle_event

* fix macos imports in desktop

* Fix onmounted event

* Fix liveview support

* switch to RefCell for metadata

* Remove println

* remove prevent default attribute

* remove web specific link behavior

* Fix liveview links

* more liveview fixes for link

* Fix merge conflicts

* Fix clippy

* use the new prevent default in the file upload example
2024-08-13 11:57:54 -07:00

109 lines
3.5 KiB
JavaScript

// @ts-check
const { test, expect, defineConfig } = require("@playwright/test");
test("button click", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the counter text.
const main = page.locator("#main");
await expect(main).toContainText("hello axum! 0");
// Expect the title to contain the counter text.
await expect(page).toHaveTitle("hello axum! 0");
// Click the increment button.
let button = page.locator("button.increment-button");
await button.click();
// Expect the page to contain the updated counter text.
await expect(main).toContainText("hello axum! 1");
// Expect the title to contain the updated counter text.
await expect(page).toHaveTitle("hello axum! 1");
});
test("svg", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the svg.
const svg = page.locator("svg");
// Expect the svg to contain the circle.
const circle = svg.locator("circle");
await expect(circle).toHaveAttribute("cx", "50");
await expect(circle).toHaveAttribute("cy", "50");
await expect(circle).toHaveAttribute("r", "40");
await expect(circle).toHaveAttribute("stroke", "green");
await expect(circle).toHaveAttribute("fill", "yellow");
});
test("raw attribute", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the raw attribute.
const div = page.locator("div.raw-attribute-div");
await expect(div).toHaveAttribute("raw-attribute", "raw-attribute-value");
});
test("hidden attribute", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the hidden attribute.
const div = page.locator("div.hidden-attribute-div");
await expect(div).toHaveAttribute("hidden", "true");
});
test("dangerous inner html", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the dangerous inner html.
const div = page.locator("div.dangerous-inner-html-div");
await expect(div).toContainText("hello dangerous inner html");
});
test("input value", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the input with the value.
const input = page.locator("input");
await expect(input).toHaveValue("hello input");
});
test("style", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the style.
const div = page.locator("div.style-div");
await expect(div).toHaveText("colored text");
await expect(div).toHaveCSS("color", "rgb(255, 0, 0)");
});
test("eval", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the eval and have no text.
const div = page.locator("div.eval-result");
await expect(div).toHaveText("");
// Click the button to run the eval.
let button = page.locator("button.eval-button");
await button.click();
// Check that the title changed.
await expect(page).toHaveTitle("Hello from Dioxus Eval!");
// Check that the div has the eval value.
await expect(div).toHaveText("returned eval value");
});
test("prevent default", async ({ page }) => {
await page.goto("http://localhost:9999");
// Expect the page to contain the div with the eval and have no text.
const a = page.locator("a.prevent-default");
await expect(a).toHaveText("View source");
// Click the <a> element to change the text
await a.click();
// Check that the <a> element changed.
await expect(a).toHaveText("Psych!");
});