Merge pull request #34 from linkwarden/hot-fix

Hot fix

.gitignore

@@ -39,3 +39,6 @@ next-env.d.ts
 
 # tests
 /tests
+/test-results/
+/playwright-report/
+/playwright/.cache/

components/Modal/Link/LinkDetails.tsx

@@ -137,8 +137,7 @@ export default function LinkDetails({ link }: Props) {
               try {
                 const color = colorThief.getPalette(
                   e.target as HTMLImageElement,
-                  4,
+                  4
-                  20
                 );
 
                 setColorPalette(color);

components/SortDropdown.tsx

@@ -21,7 +21,7 @@ export default function SortDropdown({
         const target = e.target as HTMLInputElement;
         if (target.id !== "sort-dropdown") toggleSortDropdown();
       }}
-      className="absolute top-8 right-0 border border-sky-100 shadow-md bg-gray-50 rounded-md p-2 z-10 w-48"
+      className="absolute top-8 right-0 border border-sky-100 shadow-md bg-gray-50 rounded-md p-2 z-20 w-48"
     >
       <p className="mb-2 text-sky-900 text-center font-semibold">Sort by</p>
       <div className="flex flex-col gap-2">

lib/api/archive.ts

@@ -1,8 +1,5 @@
-import { Page } from "puppeteer";
+import { Page, chromium, devices } from "playwright";
 import { prisma } from "@/lib/api/db";
-import puppeteer from "puppeteer-extra";
-import AdblockerPlugin from "puppeteer-extra-plugin-adblocker";
-import StealthPlugin from "puppeteer-extra-plugin-stealth";
 import createFile from "@/lib/api/storage/createFile";
 
 export default async function archive(
@@ -10,17 +7,13 @@ export default async function archive(
   collectionId: number,
   linkId: number
 ) {
-  const browser = await puppeteer.launch();
+  const browser = await chromium.launch();
+  const context = await browser.newContext(devices["Desktop Chrome"]);
+  const page = await context.newPage();
 
   try {
-    puppeteer.use(AdblockerPlugin()).use(StealthPlugin());
-
-    const page = await browser.newPage();
-
     await page.goto(url, { waitUntil: "domcontentloaded", timeout: 300000 });
 
-    await page.setViewport({ width: 1080, height: 1024 });
-
     await autoScroll(page);
 
     const linkExists = await prisma.link.findUnique({

package.json

@@ -31,26 +31,23 @@
     "crypto-js": "^4.1.1",
     "eslint": "8.33.0",
     "eslint-config-next": "13.1.6",
-    "multer": "^1.4.5-lts.1",
     "next": "13.1.6",
     "next-auth": "^4.22.1",
     "nodemailer": "^6.9.3",
-    "puppeteer": "^19.8.0",
+    "playwright": "^1.35.1",
-    "puppeteer-extra": "^3.3.6",
-    "puppeteer-extra-plugin-adblocker": "^2.13.6",
-    "puppeteer-extra-plugin-stealth": "^2.11.2",
     "react": "18.2.0",
     "react-colorful": "^5.6.1",
     "react-dom": "18.2.0",
     "react-hot-toast": "^2.4.1",
     "react-image-file-resizer": "^0.4.8",
     "react-select": "^5.7.0",
+    "sharp": "^0.32.1",
     "typescript": "4.9.4",
     "zustand": "^4.3.3"
   },
   "devDependencies": {
+    "@playwright/test": "^1.35.1",
     "@types/bcrypt": "^5.0.0",
-    "@types/multer": "^1.4.7",
     "autoprefixer": "^10.4.14",
     "postcss": "^8.4.24",
     "prisma": "^4.9.0",

playwright.config.ts

@@ -0,0 +1,77 @@
+import { defineConfig, devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+  testDir: './e2e',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    // baseURL: 'http://127.0.0.1:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+
+    {
+      name: 'firefox',
+      use: { ...devices['Desktop Firefox'] },
+    },
+
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
+
+    /* Test against mobile viewports. */
+    // {
+    //   name: 'Mobile Chrome',
+    //   use: { ...devices['Pixel 5'] },
+    // },
+    // {
+    //   name: 'Mobile Safari',
+    //   use: { ...devices['iPhone 12'] },
+    // },
+
+    /* Test against branded browsers. */
+    // {
+    //   name: 'Microsoft Edge',
+    //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
+    // },
+    // {
+    //   name: 'Google Chrome',
+    //   use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+    // },
+  ],
+
+  /* Run your local dev server before starting the tests */
+  // webServer: {
+  //   command: 'npm run start',
+  //   url: 'http://127.0.0.1:3000',
+  //   reuseExistingServer: !process.env.CI,
+  // },
+});