fix: broken playwright setup on NixOS

.envrc

@@ -0,0 +1 @@
+use flake

.gitignore

@@ -54,3 +54,6 @@ node_modules/
 
 # Sentry Config File
 .sentryclirc
+
+.direnv
+!.envrc

flake.nix

@@ -0,0 +1,37 @@
+{
+  description = "Bun + Playwright dev shell";
+
+  inputs = {
+    nixpkgs.url = "github:NixOS/nixpkgs";
+    flake-utils.url = "github:numtide/flake-utils";
+  };
+
+  outputs =
+    {
+      self,
+      nixpkgs,
+      flake-utils,
+      ...
+    }:
+    flake-utils.lib.eachDefaultSystem (
+      system:
+      let
+        pkgs = import nixpkgs { inherit system; };
+        browsers =
+          (builtins.fromJSON (builtins.readFile "${pkgs.playwright-driver}/browsers.json")).browsers;
+        chromium-rev = (builtins.head (builtins.filter (x: x.name == "chromium") browsers)).revision;
+      in
+      {
+        devShells.default = pkgs.mkShell {
+          packages = with pkgs; [
+            bun
+            playwright-driver.browsers
+          ];
+
+          shellHook = ''
+            export PLAYWRIGHT_LAUNCH_OPTIONS_EXECUTABLE_PATH="${pkgs.playwright-driver.browsers}/chromium-${chromium-rev}/chrome-linux64/chrome";
+          '';
+        };
+      }
+    );
+}

playwright.config.ts

@@ -36,7 +36,12 @@ export default defineConfig({
   projects: [
     {
       name: "chromium",
-      use: { ...devices["Desktop Chrome"] },
+      use: {
+        ...devices["Desktop Chrome"],
+        launchOptions: {
+          executablePath: process.env.PLAYWRIGHT_LAUNCH_OPTIONS_EXECUTABLE_PATH,
+        },
+      },
     },
 
     // {
@@ -44,16 +49,16 @@ export default defineConfig({
     //   use: { ...devices["Desktop Firefox"] },
     // },
 
-    {
-      name: "webkit",
-      use: { ...devices["Desktop Safari"] },
-    },
+    // {
+    //   name: "webkit",
+    //   use: { ...devices["Desktop Safari"] },
+    // },
 
     /* Test against mobile viewports. */
-    {
-      name: "Mobile Chrome",
-      use: { ...devices["Pixel 5"] },
-    },
+    // {
+    //   name: "Mobile Chrome",
+    //   use: { ...devices["Pixel 5"] },
+    // },
     // {
     //   name: 'Mobile Safari',
     //   use: { ...devices['iPhone 12'] },