How to fix "Frame was detached" errors in Playwright?

Frame was detached means the iframe was removed or reloaded while you were using it.

Re-acquire the frame right before acting on it and wait until it is attached.

await page.waitForSelector('iframe[name="checkout"]');

const frame = page.frame({ name: 'checkout' });
if (!frame)
  throw new Error('Checkout frame is not available');

await frame.getByLabel('Card number').fill('4242 4242 4242 4242');

If the app frequently remounts iframes, wait for the triggering network/UI event first.