basic lcp test

import { chromium } from '@playwright/test' does not work, but const { chromium } = require('playwright') works

import { chromium } from '@playwright/test'

;(async () => {
    try {
        const browser = await chromium.launch()
        const page = await browser.newPage()
        await page.goto('http://localhost:5173')
        // ---------------------
        // Complete
        const LCP: number | undefined = await page.evaluate(() => {
            return new Promise((resolve) => {
                new PerformanceObserver((list) => {
                    const entries = list.getEntries()
                    const latestEntry: PerformanceEntry | undefined = entries.at(-1)
                    resolve(latestEntry ? latestEntry.startTime : undefined)
                }).observe({ type: 'largest-contentful-paint', buffered: true })
            })
        })

        if (LCP !== undefined) {
            console.log(parseInt(String(LCP), 10))
        } else {
            console.log('LCP is undefined')
        }
        await browser.close()
    } catch (error) {
        console.error(error)
        process.exit(1)
    }
})()

is there a way I can run this in ts file?

this will give you LCP and other WebVitals automatically: https://github.com/scalewright/scalewright#description