Revert "Browser: initial screenshot support"

This reverts commit 4a02923.
enricoros · Dec 8, 2023 · 1cda7d1 · 1cda7d1
1 parent 4a02923
commit 1cda7d1
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 37 deletions.
diff --git a/src/modules/browse/browse.client.ts b/src/modules/browse/browse.client.ts
@@ -28,25 +28,12 @@ export async function callBrowseFetchPage(url: string): Promise<string | null> {
         ...(!!clientWssEndpoint && { wssEndpoint: clientWssEndpoint }),
       },
       subjects: [{ url }],
-      screenshotWidth: 512,
-      screenshotHeight: 512,
     });
 
     if (results.objects.length !== 1)
       return `Browsing error: expected 1 result, got ${results.objects.length}`;
 
     const firstResult = results.objects[0];
-
-    // DEBUG: if there's a screenshot, append it to the dom
-    /*if (firstResult.screenshot) {
-
-      const img = document.createElement('img');
-      img.src = firstResult.screenshot.imageDataUrl;
-      img.style.width = `${firstResult.screenshot.width}px`;
-      img.style.height = `${firstResult.screenshot.height}px`;
-      document.body.appendChild(img);
-    }*/
-
     return !firstResult.error ? firstResult.content : `Browsing service error: ${JSON.stringify(firstResult)}`;
 
   } catch (error: any) {

diff --git a/src/modules/browse/browse.router.ts b/src/modules/browse/browse.router.ts
@@ -1,6 +1,6 @@
 import { z } from 'zod';
 import { TRPCError } from '@trpc/server';
-import { connect, Page, ScreenshotOptions, TimeoutError } from '@cloudflare/puppeteer';
+import { connect, Page, TimeoutError } from '@cloudflare/puppeteer';
 
 import { createTRPCRouter, publicProcedure } from '~/server/api/trpc.server';
 import { env } from '~/server/env.mjs';
@@ -22,8 +22,6 @@ const fetchPageInputSchema = z.object({
   subjects: z.array(z.object({
     url: z.string().url(),
   })),
-  screenshotWidth: z.number().optional(),
-  screenshotHeight: z.number().optional(),
 });
 
 
@@ -35,8 +33,7 @@ const fetchPageWorkerOutputSchema = z.object({
   error: z.string().optional(),
   stopReason: z.enum(['end', 'timeout', 'error']),
   screenshot: z.object({
-    imageDataUrl: z.string().startsWith('data:image/'),
-    mimeType: z.string().startsWith('image/'),
+    base64: z.string(),
     width: z.number(),
     height: z.number(),
   }).optional(),
@@ -52,12 +49,12 @@ export const browseRouter = createTRPCRouter({
   fetchPages: publicProcedure
     .input(fetchPageInputSchema)
     .output(fetchPagesOutputSchema)
-    .mutation(async ({ input: { access, subjects, screenshotHeight, screenshotWidth } }) => {
+    .mutation(async ({ input: { access, subjects } }) => {
       const results: FetchPageWorkerOutputSchema[] = [];
 
       for (const subject of subjects) {
         try {
-          results.push(await workerPuppeteer(access, subject.url, screenshotWidth, screenshotHeight));
+          results.push(await workerPuppeteer(access, subject.url));
         } catch (error: any) {
           results.push({
             url: subject.url,
@@ -77,7 +74,7 @@ export const browseRouter = createTRPCRouter({
 type BrowseAccessSchema = z.infer<typeof browseAccessSchema>;
 type FetchPageWorkerOutputSchema = z.infer<typeof fetchPageWorkerOutputSchema>;
 
-async function workerPuppeteer(access: BrowseAccessSchema, targetUrl: string, screenshotWidth?: number, screenshotHeight?: number): Promise<FetchPageWorkerOutputSchema> {
+async function workerPuppeteer(access: BrowseAccessSchema, targetUrl: string): Promise<FetchPageWorkerOutputSchema> {
 
   // access
   const browserWSEndpoint = (access.wssEndpoint || env.PUPPETEER_WSS_ENDPOINT || '').trim();
@@ -137,25 +134,21 @@ async function workerPuppeteer(access: BrowseAccessSchema, targetUrl: string, sc
 
   // get a screenshot of the page
   try {
-    if (screenshotWidth && screenshotHeight) {
-      const width = screenshotWidth;
-      const height = screenshotHeight;
-      const scale = 0.5; // 10%
+    const width = 100;
+    const height = 100;
+    const scale = 0.1; // 10%
 
-      await page.setViewport({ width: width / scale, height: height / scale, deviceScaleFactor: scale });
+    await page.setViewport({ width: width / scale, height: height / scale, deviceScaleFactor: scale });
 
-      const imageType: ScreenshotOptions['type'] = 'webp';
-      const mimeType = `image/${imageType}`;
-
-      const dataString = await page.screenshot({
-        type: imageType,
-        encoding: 'base64',
+    result.screenshot = {
+      base64: await page.screenshot({
+        type: 'webp',
         clip: { x: 0, y: 0, width: width / scale, height: height / scale },
-        quality: undefined,
-      }) as string;
-
-      result.screenshot = { imageDataUrl: `data:${mimeType};base64,${dataString}`, mimeType, width, height };
-    }
+        encoding: 'base64',
+      }) as string,
+      width,
+      height,
+    };
   } catch (error: any) {
     console.error('workerPuppeteer: page.screenshot', error);
   }