nuxt / framework

Old repo of Nuxt 3 framework, now on nuxt/nuxt

Home Page:https://nuxt.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Playwright chromioum works in dev but fails on production

MuhammadM1998 opened this issue · comments

Environment

  • Operating System: Windows_NT
  • Node Version: v18.12.1
  • Nuxt Version: 3.0.0
  • Nitro Version: 1.0.0
  • Package Manager: yarn@1.22.19
  • Builder: vite
  • User Config: -
  • Runtime Modules: -
  • Build Modules: -

Reproduction

https://github.com/MuhammadM1998/nuxt-playwright
https://stackblitz.com/edit/github-dseiey

Describe the bug

I'm using Playwright in a Nuxt 3 project as a nitro plugin to scrape data from a website then use it in the frontend.

It works in my local maching but not in production or stackblitz.

I've tried to implement this microsoft/playwright#2321 (comment) and it didn't work too.

Additional context

server/plugins/playwright.js

import { chromium } from 'playwright-core';
import bundledChromium from 'chrome-aws-lambda';
import { db } from '../db';

export default defineNitroPlugin(async () => {
  const browser = await Promise.resolve(bundledChromium.executablePath).then(
    (executablePath) =>
      !executablePath
        ? chromium.launch({ headless: false }) // Local execution
        : chromium.launch({ executablePath }) // Remote execution
  );

  const context = await browser.newContext();
  const page = await context.newPage();
  await page.goto('https://www.google.com/');
  await page.waitForTimeout(2000);
  await browser.close();

  db.push('works'); // I'm fetching db and showing it at index.html to test if this works
});

server/routes/playwright.js

import { db } from '../db';
export default defineEventHandler(() => db);

server/db.js

export const db = [];

pages/index.vue

<script setup>
  const { data } = await useFetch('/playwright');
</script>

<template>
  <div>
    <p>Nuxt with Playwright Demo</p>
    <p>{{ data }}</p>
  </div>
</template>

I've opened an issue at playwright repo with fairly the same content as I think the error at both sides?

Logs

This is what's logged when deploying the repo mentioned above to vercel

[info] Building server...
[success] Server built in 549ms
[success] [nitro] Generated public .vercel/output/static
[info] [nitro] Initializing prerenderer
[info] [nitro] Prerendering 3 initial routes with crawler
[error] [unhandledRejection] browserType.launch: Executable doesnt exist 
at /vercel/.cache/ms-playwright/chromium-1033/chrome-linux/chrome
╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     npx playwright install                                              ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝

╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     npx playwright install                                              ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝
at .nuxt/prerender/chunks/nitro/nitro-prerenderer.mjs:340:52
at async .nuxt/prerender/chunks/nitro/nitro-prerenderer.mjs:339:19
[error] [nitro] [dev] [unhandledRejection] Error: browserType.launch: Executable doesnt exist 
at /vercel/.cache/ms-playwright/chromium-1033/chrome-linux/chrome
╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     npx playwright install                                              ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝