Read the mutation logs to assert the direction attribute change

It's less dependent on the timing of the mutation. Even if the attribute
is no longer present, we can still assert that it was present at some
point.

src/tests/functional/visit_tests.js

@@ -6,15 +6,16 @@ import {
   getSearchParam,
   isScrolledToSelector,
   isScrolledToTop,
+  nextAttributeMutationNamed,
   nextBeat,
   nextEventNamed,
   noNextAttributeMutationNamed,
   pathname,
   readEventLogs,
+  resetMutationLogs,
   scrollToSelector,
   visitAction,
   waitUntilNoSelector,
-  waitUntilSelector,
   willChangeBody
 } from "../helpers/page"
 
@@ -224,14 +225,15 @@ test("test Visit with network error", async ({ page }) => {
 
 test("Visit direction data attribute when clicking a link", async ({ page }) => {
   page.click("#same-origin-link")
-
   await assertVisitDirectionAttribute(page, "forward")
 })
 
 test("Visit direction data attribute when navigating back", async ({ page }) => {
   await page.click("#same-origin-link")
   await nextEventNamed(page, "turbo:load")
 
+  await resetMutationLogs(page)
+
   page.goBack()
 
   await assertVisitDirectionAttribute(page, "back")
@@ -270,6 +272,6 @@ async function visitLocation(page, location) {
 }
 
 async function assertVisitDirectionAttribute(page, direction) {
-  await waitUntilSelector(page, `[data-turbo-visit-direction='${direction}']`)
+  assert.equal(await nextAttributeMutationNamed(page, "html", "data-turbo-visit-direction"), direction)
   await waitUntilNoSelector(page, "[data-turbo-visit-direction]")
 }

src/tests/helpers/page.js

@@ -162,6 +162,12 @@ export function propertyForSelector(page, selector, propertyName) {
   return page.locator(selector).evaluate((element, propertyName) => element[propertyName], propertyName)
 }
 
+export function resetMutationLogs(page) {
+  return page.evaluate(() => {
+    window.mutationLogs = []
+  })
+}
+
 async function readArray(page, identifier, length) {
   return page.evaluate(
     ({ identifier, length }) => {