Playwright: replace assert with expect (#1465)

Replace calls to `assert`-prefixed assertions with Playwright's
`expect`-based assertions in the following files:

* `src/tests/functional/async_script_tests.js`
* `src/tests/functional/cache_observer_tests.js`
* `src/tests/functional/drive_disabled_tests.js`
* `src/tests/functional/drive_tests.js`
* `src/tests/functional/drive_view_transition_legacy_tests.js`
* `src/tests/functional/import_tests.js`
* `src/tests/functional/link_prefetch_observer_tests.js`
* `src/tests/functional/pausable_rendering_tests.js`
* `src/tests/functional/preloader_tests.js`

Some `nextBody` calls are made unnecessary by invoking Playwright's
wait-and-retry expectations, so this commit removes them when possible.

Author: seanpdoyle

src/tests/functional/async_script_tests.js

@@ -1,5 +1,4 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
+import { expect, test } from "@playwright/test"
 import { readEventLogs, visitAction } from "../helpers/page"
 
 test.beforeEach(async ({ page }) => {
@@ -10,11 +9,11 @@ test.beforeEach(async ({ page }) => {
 test("does not emit turbo:load when loaded asynchronously after DOMContentLoaded", async ({ page }) => {
   const events = await readEventLogs(page)
 
-  assert.deepEqual(events, [])
+  expect(events).toEqual([])
 })
 
 test("following a link when loaded asynchronously after DOMContentLoaded", async ({ page }) => {
   await page.click("#async-link")
 
-  assert.equal(await visitAction(page), "advance")
+  expect(await visitAction(page)).toEqual("advance")
 })

src/tests/functional/cache_observer_tests.js

@@ -1,24 +1,21 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
-import { hasSelector, nextBody } from "../helpers/page"
+import { expect, test } from "@playwright/test"
+import { nextEventNamed } from "../helpers/page"
 
 test("removes temporary elements", async ({ page }) => {
   await page.goto("/src/tests/fixtures/cache_observer.html")
 
-  assert.equal(await page.textContent("#temporary"), "data-turbo-temporary")
+  await expect(page.locator("#temporary")).toHaveText("data-turbo-temporary")
 
   await page.click("#link")
-  await nextBody(page)
+  await nextEventNamed(page, "turbo:load")
   await page.goBack()
-  await nextBody(page)
 
-  assert.notOk(await hasSelector(page, "#temporary"))
+  await expect(page.locator("#temporary")).not.toBeAttached()
 })
 
 test("following a redirect renders [data-turbo-temporary] elements before the cache removes", async ({ page }) => {
   await page.goto("/src/tests/fixtures/navigation.html")
   await page.click("#redirect-to-cache-observer")
-  await nextBody(page)
 
-  assert.equal(await page.textContent("#temporary"), "data-turbo-temporary")
+  await expect(page.locator("#temporary")).toHaveText("data-turbo-temporary")
 })

src/tests/functional/drive_disabled_tests.js

@@ -1,13 +1,11 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
+import { expect, test } from "@playwright/test"
 import {
   getFromLocalStorage,
-  nextBody,
   nextEventOnTarget,
-  pathname,
-  searchParams,
   setLocalStorageFromEvent,
-  visitAction
+  visitAction,
+  withPathname,
+  withSearchParam
 } from "../helpers/page"
 
 const path = "/src/tests/fixtures/drive_disabled.html"
@@ -18,30 +16,27 @@ test.beforeEach(async ({ page }) => {
 
 test("drive disabled by default; click normal link", async ({ page }) => {
   await page.click("#drive_disabled")
-  await nextBody(page)
 
-  assert.equal(pathname(page.url()), path)
-  assert.equal(await visitAction(page), "load")
+  await expect(page).toHaveURL(withPathname(path))
+  expect(await visitAction(page)).toEqual("load")
 })
 
 test("drive disabled by default; click link inside data-turbo='true'", async ({ page }) => {
   await page.click("#drive_enabled")
-  await nextBody(page)
 
-  assert.equal(pathname(page.url()), path)
-  assert.equal(await visitAction(page), "advance")
+  await expect(page).toHaveURL(withPathname(path))
+  expect(await visitAction(page)).toEqual("advance")
 })
 
 test("drive disabled by default; submit form inside data-turbo='true'", async ({ page }) => {
   await setLocalStorageFromEvent(page, "turbo:submit-start", "formSubmitted", "true")
 
   await page.click("#no_submitter_drive_enabled a#requestSubmit")
-  await nextBody(page)
 
-  assert.ok(await getFromLocalStorage(page, "formSubmitted"))
-  assert.equal(pathname(page.url()), "/src/tests/fixtures/form.html")
-  assert.equal(await visitAction(page), "advance")
-  assert.equal(await searchParams(page.url()).get("greeting"), "Hello from a redirect")
+  await expect(page).toHaveURL(withPathname("/src/tests/fixtures/form.html"))
+  await expect(page).toHaveURL(withSearchParam("greeting", "Hello from a redirect"))
+  expect(await getFromLocalStorage(page, "formSubmitted")).toBeTruthy()
+  expect(await visitAction(page)).toEqual("advance")
 })
 
 test("drive disabled by default; links within <turbo-frame> navigate with Turbo", async ({ page }) => {

src/tests/functional/drive_tests.js

@@ -1,6 +1,5 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
-import { nextBody, pathname, visitAction } from "../helpers/page"
+import { expect, test } from "@playwright/test"
+import { visitAction, withPathname } from "../helpers/page"
 
 const path = "/src/tests/fixtures/drive.html"
 
@@ -10,8 +9,8 @@ test.beforeEach(async ({ page }) => {
 
 test("drive enabled by default; click normal link", async ({ page }) => {
   await page.click("#drive_enabled")
-  await nextBody(page)
-  assert.equal(pathname(page.url()), path)
+
+  await expect(page).toHaveURL(withPathname(path))
 })
 
 test("drive to external link", async ({ page }) => {
@@ -20,16 +19,14 @@ test("drive to external link", async ({ page }) => {
   })
 
   await page.click("#drive_enabled_external")
-  await nextBody(page)
 
-  assert.equal(await page.evaluate(() => window.location.href), "https://example.com/")
-  assert.equal(await page.textContent("body"), "Hello from the outside world")
+  await expect(page).toHaveURL("https://example.com/")
+  await expect(page.locator("body")).toHaveText("Hello from the outside world")
 })
 
 test("drive enabled by default; click link inside data-turbo='false'", async ({ page }) => {
   await page.click("#drive_disabled")
-  await nextBody(page)
 
-  assert.equal(pathname(page.url()), path)
-  assert.equal(await visitAction(page), "load")
+  await expect(page).toHaveURL(withPathname(path))
+  expect(await visitAction(page)).toEqual("load")
 })

src/tests/functional/drive_view_transition_legacy_test.js renamed to src/tests/functional/drive_view_transition_legacy_tests.js

@@ -1,5 +1,4 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
+import { expect, test } from "@playwright/test"
 import { nextBody } from "../helpers/page"
 
 test.beforeEach(async ({ page }) => {
@@ -17,14 +16,12 @@ test("navigating triggers the view transition", async ({ page }) => {
   await page.locator("#go-right").click()
   await nextBody(page)
 
-  const called = await page.evaluate(`window.startViewTransitionCalled`)
-  assert.isTrue(called)
+  expect(await page.evaluate(`window.startViewTransitionCalled`)).toEqual(true)
 })
 
 test("navigating does not trigger a view transition when meta tag not present", async ({ page }) => {
   await page.locator("#go-other").click()
   await nextBody(page)
 
-  const called = await page.evaluate(`window.startViewTransitionCalled`)
-  assert.isUndefined(called)
+  expect(await page.evaluate(`window.startViewTransitionCalled`)).toEqual(undefined)
 })

src/tests/functional/import_tests.js

@@ -1,5 +1,4 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
+import { expect, test } from "@playwright/test"
 
 test("window variable with ESM", async ({ page }) => {
   await page.goto("/src/tests/fixtures/esm.html")
@@ -39,5 +38,5 @@ async function assertTypeOf(page, propertyName, propertyType) {
     return typeof object
   }, propertyName)
 
-  assert.equal(type, propertyType, `Expected ${propertyName} to be ${propertyType}`)
+  expect(type, `Expected ${propertyName} to be ${propertyType}`).toEqual(propertyType)
 }

src/tests/functional/link_prefetch_observer_tests.js

@@ -1,5 +1,4 @@
 import { expect, test } from "@playwright/test"
-import { assert } from "chai"
 import { nextBeat, nextEventOnTarget, noNextEventNamed, noNextEventOnTarget, sleep } from "../helpers/page"
 import fs from "fs"
 import path from "path"
@@ -24,7 +23,7 @@ test("it prefetches the page", async ({ page }) => {
   await nextEventOnTarget(page, "anchor_for_prefetch", "turbo:before-prefetch")
   const { url, fetchOptions } = await nextEventOnTarget(page, "anchor_for_prefetch", "turbo:before-fetch-request")
 
-  expect(url).toEqual(await link.evaluate(a => a.href))
+  await expect(link).toHaveJSProperty("href", url)
   expect(fetchOptions.headers["X-Sec-Purpose"]).toEqual("prefetch")
   expect(fetchOptions.priority).toEqual("low")
 
@@ -40,7 +39,7 @@ test("it doesn't follow the link", async ({ page }) => {
   await goTo({ page, path: "/hover_to_prefetch.html" })
   await hoverSelector({ page, selector: "#anchor_for_prefetch" })
 
-  assert.equal(await page.title(), "Hover to Prefetch")
+  await expect(page).toHaveTitle("Hover to Prefetch")
 })
 
 test("prefetches the page when link has a whole valid url as a href", async ({ page }) => {
@@ -84,7 +83,6 @@ test("allows to cancel prefetch requests with custom logic", async ({ page }) =>
   const link = page.locator("#anchor_for_prefetch")
   await link.evaluate(a => a.addEventListener("turbo:before-prefetch", event => event.preventDefault()))
 
-  await page.pause()
   await link.hover()
   await nextEventOnTarget(page, "anchor_for_prefetch", "turbo:before-prefetch")
   await noNextEventNamed(page, "turbo:before-fetch-request")
@@ -193,7 +191,7 @@ test("it prefetches links inside a turbo frame", async ({ page }) => {
 
   await assertPrefetchedOnHover({ page, selector: "#anchor_for_prefetch_in_frame", callback: (request) => {
     const turboFrameHeader = request.headers()["turbo-frame"]
-    assert.equal(turboFrameHeader, "frame_for_prefetch")
+    expect(turboFrameHeader).toEqual("frame_for_prefetch")
   }})
 })
 
@@ -203,7 +201,7 @@ test("doesn't include a turbo-frame header when the link is inside a turbo frame
 
   await assertPrefetchedOnHover({ page, selector: "#anchor_for_prefetch_in_frame_target_top", callback: (request) => {
     const turboFrameHeader = request.headers()["turbo-frame"]
-    assert.equal(undefined, turboFrameHeader)
+    expect(turboFrameHeader).toEqual(undefined)
   }})
 })
 
@@ -243,13 +241,13 @@ test("it resets the cache when a link is hovered", async ({ page }) => {
   await page.hover("#anchor_for_prefetch")
   await sleep(200)
 
-  assert.equal(requestCount, 1)
+  expect(requestCount).toEqual(1)
   await page.mouse.move(0, 0)
 
   await page.hover("#anchor_for_prefetch")
   await sleep(200)
 
-  assert.equal(requestCount, 2)
+  expect(requestCount).toEqual(2)
 })
 
 test("it does not make a network request when clicking on a link that has been prefetched", async ({ page }) => {
@@ -265,7 +263,7 @@ test("it follows the link using the cached response when clicking on a link that
   await hoverSelector({ page, selector: "#anchor_for_prefetch" })
 
   await clickSelector({ page, selector: "#anchor_for_prefetch" })
-  assert.equal(await page.title(), "Prefetched Page")
+  await expect(page).toHaveTitle("Prefetched Page")
 })
 
 const assertPrefetchedOnHover = async ({ page, selector, callback }) => {
@@ -296,7 +294,7 @@ const assertRequestMade = async (page, action, callback) => {
 
   await action()
 
-  assert.equal(!!requestMade, true, "Network request wasn't made when it should have been.")
+  expect(!!requestMade, "Network request wasn't made when it should have been.").toEqual(true)
 
   if (callback) {
     await callback(requestMade)
@@ -309,7 +307,7 @@ const assertRequestNotMade = async (page, action, callback) => {
 
   await action()
 
-  assert.equal(!!requestMade, false, "Network request was made when it should not have been.")
+  expect(!!requestMade, "Network request was made when it should not have been.").toEqual(false)
 
   if (callback) {
     await callback(requestMade)

src/tests/functional/pausable_rendering_tests.js

@@ -1,50 +1,46 @@
-import { test } from "@playwright/test"
-import { assert } from "chai"
-import { nextBeat } from "../helpers/page"
+import { expect, test } from "@playwright/test"
 
 test.beforeEach(async ({ page }) => {
   await page.goto("/src/tests/fixtures/pausable_rendering.html")
 })
 
 test("pauses and resumes rendering", async ({ page }) => {
   page.on("dialog", (dialog) => {
-    assert.strictEqual(dialog.message(), "Continue rendering?")
+    expect(dialog.message()).toEqual("Continue rendering?")
     dialog.accept()
   })
 
   await page.click("#link")
-  await nextBeat()
 
-  assert.equal(await page.textContent("h1"), "One")
+  await expect(page.locator("h1")).toHaveText("One")
 })
 
 test("aborts rendering", async ({ page }) => {
   const [firstDialog] = await Promise.all([page.waitForEvent("dialog"), page.click("#link")])
 
-  assert.strictEqual(firstDialog.message(), "Continue rendering?")
+  expect(firstDialog.message()).toEqual("Continue rendering?")
 
   firstDialog.dismiss()
 
-  assert.equal(await page.textContent("h1"), "Pausable Rendering")
+  await expect(page.locator("h1")).toHaveText("Pausable Rendering")
 })
 
 test("pauses and resumes rendering a Frame", async ({ page }) => {
   page.on("dialog", (dialog) => {
-    assert.strictEqual(dialog.message(), "Continue rendering?")
+    expect(dialog.message()).toEqual("Continue rendering?")
     dialog.accept()
   })
 
   await page.click("#frame-link")
-  await nextBeat()
 
-  assert.equal(await page.textContent("#hello h2"), "Hello from a frame")
+  await expect(page.locator("#hello h2")).toHaveText("Hello from a frame")
 })
 
 test("aborts rendering a Frame", async ({ page }) => {
   page.on("dialog", (dialog) => {
-    assert.strictEqual(dialog.message(), "Continue rendering?")
+    expect(dialog.message()).toEqual("Continue rendering?")
     dialog.dismiss()
   })
 
-  assert.equal(await page.textContent("#hello h2"), "Pausable Frame Rendering")
+  await expect(page.locator("#hello h2")).toHaveText("Pausable Frame Rendering")
 })