Deploy playwright on Heroku

Rikusen / りくせん — Fri, 17 Feb 2023 01:52:39 +0000

I found a solution to use playwright on Heroku, since the playwright buildpack is outdated.

Note
This is for someone who is still getting below error even you installed buildpack to Heroku

╔═════════════════════════════════════════════════════════════════════════╗
║ 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                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝

In short,

Add these 2 buildpack (The order is really important, apt should be first):

Add Aptfile at same as Procfile if you have one:

libgtk-3-0
libasound2
libxcomposite1
libxdamage1
libxfixes3
libxrandr2
libxtst6
libatk1.0-0
libdbus-glib-1-2
libwayland-server0
libx11-xcb1
libxcursor1
libxi6

(Optional if you not already doing)
Add engines (package.json):

  "engines": {
    "node": "16.x",
    "yarn": "1.x" // Could be npm, choose for your environment
  },

That's it.

The 2 ways to use global stylesheet in Nuxt

Rikusen / りくせん — Thu, 09 Apr 2020 15:26:01 +0000

The first way is, write any stylesheet in layout/default.vue. This way is very simple and good for small project. You won't need any another file.

and as alternative, you can make style.css file in aseets folder and import it in default.vue. Or, just make the file and load it in nuxt.config.js.

The second way is, use @nuxtjs/style-resources. I think this is not good way because this causes mess the project.

DEV Community: Rikusen / りくせん

Deploy playwright on Heroku

The 2 ways to use global stylesheet in Nuxt