try to fix waiting for article element

dist/webshot.js

@@ -84,7 +84,7 @@ class Webshot extends CallableInstance {
                         .then(() => page.route('*:\/\/video.twimg.com\/**', route => { route.abort(); }))
                         .then(() => page.goto(url, { waitUntil: 'load', timeout: getTimeout() }))
                         .then(() => Promise.race([
-                        page.waitForSelector('article'),
+                        page.waitForSelector('article', { state: 'attached', timeout: getTimeout() }),
                         page.click('#placeholder+#ScriptLoadFailure input[value="Try again"]', { timeout: getTimeout() }),
                     ]))
                         .then(() => page.addStyleTag({
@@ -104,7 +104,7 @@ class Webshot extends CallableInstance {
                             });
                         }, 250);
                     }))
-                        .then(() => page.waitForSelector('xpath=//section/*/*/div[.//article[not(.//time[not(ancestor::div[@aria-labelledby])])]]', { timeout: getTimeout() }))
+                        .then(() => page.waitForSelector('xpath=//section/*/*/div[.//article[not(.//time[not(ancestor::div[@aria-labelledby])])]]', { state: 'attached', timeout: getTimeout() }))
                         .then(handle => handle.$$('xpath=..//a[contains(@href,"content_you_see")]/../../..//*[@role="button"]')
                         .then(sensitiveToggles => {
                         const count = sensitiveToggles.length;
@@ -117,8 +117,16 @@ class Webshot extends CallableInstance {
                         .catch((err) => {
                         if (err.name !== 'TimeoutError')
                             throw err;
-                        logger.warn(`navigation timed out at ${getTimerTime()} seconds`);
-                        return null;
+                        logger.warn(`${err} (${getTimerTime()} ms)`);
+                        return page.evaluate(() => document.documentElement.outerHTML).then(html => {
+                            const path = temp.path({ suffix: '.html' });
+                            fs_1.writeFileSync(path, html);
+                            logger.warn(`saved debug html to ${path}`);
+                        }).then(() => page.screenshot()).then(screenshot => {
+                            sharpToFile(sharp(screenshot).jpeg({ quality: 90 })).then(fileUri => {
+                                logger.warn(`saved debug screenshot to ${fileUri.substring(7)}`);
+                            });
+                        }).then(() => null);
                     })
                         .then((handle) => {
                         if (handle === null)

src/webshot.ts

@@ -110,7 +110,7 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
             .then(() => page.route('*:\/\/video.twimg.com\/**', route => { route.abort(); }))
             .then(() => page.goto(url, {waitUntil: 'load', timeout: getTimeout()}))
             .then(() => Promise.race([
-              page.waitForSelector('article'),
+              page.waitForSelector('article', {state: 'attached', timeout: getTimeout()}),
               page.click('#placeholder+#ScriptLoadFailure input[value="Try again"]', {timeout: getTimeout()}),
             ]))
             // hide header, "more options" button, like and retweet count
@@ -135,7 +135,7 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
             // find main tweet
             .then(() => page.waitForSelector(
               'xpath=//section/*/*/div[.//article[not(.//time[not(ancestor::div[@aria-labelledby])])]]',
-              {timeout: getTimeout()}
+              {state: 'attached', timeout: getTimeout()}
             ))
             // toggle visibility of sensitive tweets
             .then(handle => handle.$$('xpath=..//a[contains(@href,"content_you_see")]/../../..//*[@role="button"]')
@@ -149,9 +149,18 @@ class Webshot extends CallableInstance<[Tweets, (...args) => void, number], Prom
             // throw early if tweet is unavailable
             .then(handle => handle.$('[data-testid="tweet"]').then(owner => owner ? handle : null))
             .catch((err: Error): Promise<puppeteer.ElementHandle<HTMLDivElement> | null> => {
-              if (err.name !== 'TimeoutError') throw err;
-              logger.warn(`navigation timed out at ${getTimerTime()} seconds`);
-              return null;
+              if (err.name !== 'TimeoutError')
+              throw err;
+              logger.warn(`${err} (${getTimerTime()} ms)`);
+              return page.evaluate(() => document.documentElement.outerHTML).then(html => {
+                const path = temp.path({ suffix: '.html' });
+                writeFileSync(path, html);
+                logger.warn(`saved debug html to ${path}`);
+              }).then(() => page.screenshot()).then(screenshot => {
+                sharpToFile(sharp(screenshot).jpeg({ quality: 90 })).then(fileUri => {
+                  logger.warn(`saved debug screenshot to ${fileUri.substring(7)}`);
+                });
+              }).then(() => null);
             })
             // scroll back at least 2 tweets revealing 2nd last tweet by owner in thread, or top of thread, if any
             .then((handle: puppeteer.ElementHandle<HTMLDivElement>) => {