use css for trimming webshot, fix tests

dist/twitter_test.js

@@ -7,13 +7,13 @@ const configPath = './config.json';
 let worker;
 try {
     const config = require(path.resolve(configPath));
-    worker = new twitter_1.default(Object.fromEntries(Object.entries(config).map(([k, v]) => [k.replace('twitter_', ''), v])));
+    worker = new twitter_1.default(Object.fromEntries(Object.entries(config).map(([k, v]) => [k.replace('twitter_', '').replace(/_(.)/g, (_, $1) => $1.toUpperCase()), v])));
 }
 catch (e) {
     console.log('Failed to parse config file: ', configPath);
     process.exit(1);
 }
-const webshot = new webshot_1.default(worker.mode, () => {
+const webshot = new webshot_1.default(config.playwright_ws_spec_endpoint, worker.mode, () => {
     worker.webshot = webshot;
     worker.getTweet('1296935552848035840', (msg, text, author) => {
         console.log(author + text);

dist/webshot.js

@@ -80,7 +80,7 @@ class Webshot extends CallableInstance {
                     })
                         .then(() => page.goto(url, { waitUntil: 'load', timeout: getTimeout() }))
                         .then(() => page.addStyleTag({
-                        content: 'header{display:none!important}path[d=\'M20.207 7.043a1 1 0 0 0-1.414 0L12 13.836 5.207 7.043a1 1 0 0 0-1.414 1.414l7.5 7.5a.996.996 0 0 0 1.414 0l7.5-7.5a1 1 0 0 0 0-1.414z\'],div[role=\'button\']{display: none;}',
+                        content: 'header{display:none!important}div[role=\'button\'],[data-testid="tweet"]+*>[class*=" "]+*{display:none}',
                     }))
                         .then(() => page.addStyleTag({
                         content: '*{font-family:-apple-system,".Helvetica Neue DeskInterface",Hiragino Sans,Hiragino Sans GB,sans-serif!important}',
@@ -142,7 +142,7 @@ class Webshot extends CallableInstance {
                         }).on('parsed', function () {
                             const idx = (x, y) => (this.width * y + x) << 2;
                             let boundary = null;
-                            let x = zoomFactor * 2;
+                            const x = zoomFactor * 2;
                             for (let y = 0; y < this.height; y += zoomFactor) {
                                 if (this.data[idx(x, y)] !== 255 &&
                                     this.data[idx(x, y)] === this.data[idx(x + zoomFactor * 10, y)]) {
@@ -159,39 +159,6 @@ class Webshot extends CallableInstance {
                                 logger.info(`found boundary at ${boundary}, cropping image`);
                                 this.data = this.data.slice(0, idx(this.width, boundary));
                                 this.height = boundary;
-                                boundary = null;
-                                x = Math.floor(16 * zoomFactor);
-                                let flag = false;
-                                let cnt = 0;
-                                for (let y = this.height - 1 - zoomFactor; y >= 0; y -= zoomFactor) {
-                                    if ((this.data[idx(x, y)] === 255) === flag) {
-                                        cnt++;
-                                        flag = !flag;
-                                    }
-                                    else
-                                        continue;
-                                    if (cnt === 2) {
-                                        boundary = y + 1;
-                                    }
-                                    if (cnt === 4) {
-                                        const b = y + 1;
-                                        if (Math.abs(this.height - boundary - (boundary - b)) <= 3 * zoomFactor) {
-                                            boundary = b;
-                                        }
-                                    }
-                                    if (cnt === 6) {
-                                        const c = y + 1;
-                                        if (Math.abs(this.height - boundary - 2 * (boundary - c)) <= 3 * zoomFactor) {
-                                            boundary = c;
-                                            break;
-                                        }
-                                    }
-                                }
-                                if (boundary !== null) {
-                                    logger.info(`found boundary at ${boundary}, trimming image`);
-                                    this.data = this.data.slice(0, idx(this.width, boundary));
-                                    this.height = boundary;
-                                }
                                 sharpToFile(jpeg(this.pack())).then(path => {
                                     logger.info(`finished webshot for ${url}`);
                                     resolve({ path, boundary });

src/twitter_test.js

@@ -9,13 +9,15 @@ let worker;
 try {
   const config = require(path.resolve(configPath));
   worker = new Worker(
-    Object.fromEntries(Object.entries(config).map(([k, v]) => [k.replace('twitter_', ''), v]))
+    Object.fromEntries(Object.entries(config).map(
+      ([k, v]) => [k.replace('twitter_', '').replace(/_(.)/g, (_, $1) => $1.toUpperCase()), v]
+    ))
   );
 } catch (e) {
   console.log('Failed to parse config file: ', configPath);
   process.exit(1);
 }
-const webshot = new Webshot(worker.mode, () => {
+const webshot = new Webshot(config.playwright_ws_spec_endpoint, worker.mode, () => {
   worker.webshot = webshot;
   worker.getTweet('1296935552848035840', (msg, text, author) => {
     console.log(author + text);

src/webshot.ts

@@ -103,7 +103,7 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
             .then(() => page.goto(url, {waitUntil: 'load', timeout: getTimeout()}))
             // hide header, "more options" button, like and retweet count
             .then(() => page.addStyleTag({
-              content: 'header{display:none!important}path[d=\'M20.207 7.043a1 1 0 0 0-1.414 0L12 13.836 5.207 7.043a1 1 0 0 0-1.414 1.414l7.5 7.5a.996.996 0 0 0 1.414 0l7.5-7.5a1 1 0 0 0 0-1.414z\'],div[role=\'button\']{display: none;}',
+              content: 'header{display:none!important}div[role=\'button\'],[data-testid="tweet"]+*>[class*=" "]+*{display:none}',
             }))
             .then(() => page.addStyleTag({
               content: '*{font-family:-apple-system,".Helvetica Neue DeskInterface",Hiragino Sans,Hiragino Sans GB,sans-serif!important}',
@@ -167,7 +167,7 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
                 // eslint-disable-next-line @typescript-eslint/no-shadow
                 const idx = (x: number, y: number) => (this.width * y + x) << 2;
                 let boundary: number = null;
-                let x = zoomFactor * 2;
+                const x = zoomFactor * 2;
                 for (let y = 0; y < this.height; y += zoomFactor) {
                   if (
                     this.data[idx(x, y)] !== 255 &&
@@ -187,44 +187,6 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
                   this.data = this.data.slice(0, idx(this.width, boundary));
                   this.height = boundary;
 
-                  boundary = null;
-                  x = Math.floor(16 * zoomFactor);
-                  let flag = false;
-                  let cnt = 0;
-                  for (let y = this.height - 1 - zoomFactor; y >= 0; y -= zoomFactor) {
-                    if ((this.data[idx(x, y)] === 255) === flag) {
-                      cnt++;
-                      flag = !flag;
-                    } else continue;
-
-                    // line above the "comment", "retweet", "like", "share" button row
-                    if (cnt === 2) {
-                      boundary = y + 1;
-                    }
-
-                    // if there are a "retweet" count and "like" count row, this will be the line above it
-                    if (cnt === 4) {
-                      const b = y + 1;
-                      if (Math.abs(this.height - boundary - (boundary - b)) <= 3 * zoomFactor) {
-                        boundary = b;
-                      }
-                    }
-
-                    // if "retweet" count and "like" count are two rows, this will be the line above the first
-                    if (cnt === 6) {
-                      const c = y + 1;
-                      if (Math.abs(this.height - boundary - 2 * (boundary - c)) <= 3 * zoomFactor) {
-                        boundary = c;
-                        break;
-                      }
-                    }
-                  }
-                  if (boundary !== null) {
-                    logger.info(`found boundary at ${boundary}, trimming image`);
-                    this.data = this.data.slice(0, idx(this.width, boundary));
-                    this.height = boundary;
-                  }
-
                   sharpToFile(jpeg(this.pack())).then(path => {
                     logger.info(`finished webshot for ${url}`);
                     resolve({path, boundary});