我正在为一个测试页面写一个Playwright测试。这个页面非常简单，它会向后端进行一次提取，以确保它正在响应（称为liveness），这将返回一个OK或FAIL。

<script lang="ts">
    import { onMount } from "svelte";
    import { fetchLiveness } from "$lib/request";

    let liveness: string;

    onMount(async () => {
        liveness = await fetchLiveness();
    });
</script>

<div>
    <p>Liveness Check: {liveness}</p>
</div>

该测试模拟API调用，加载页面，并检查页面内容中的预期值。

import { expect, test } from "@playwright/test";

test("index page has expected liveness result", async ({ page }) => {
    await page.route('**/liveness', async (route) => {
        await route.fulfill({
            status: 200,
            contentType: "application/json",
            body: "OK"
        });
    })
    await page.goto("/");
    expect(await page.textContent('p')).toBe('Liveness Check: OK');
});

在获取完成之前，liveness的值是undefined。当测试运行时，这是我得到的p元素的textContent。虽然我可以确认page.route回调正在被调用，但它似乎没有等待结果。因此，在测试完成之前，页面不会从其初始状态更新。

Error: expect(received).toBe(expected) // Object.is equality

    Expected: "Liveness Check: OK"
    Received: "Liveness Check: undefined"

我还没有找到关于这个的任何信息，我需要做什么来告诉剧作家等待API请求完成吗？或者我应该在svelte组件中做什么，这样剧作家就不会认为页面加载已经完成了吗？