privatenumber / snap-tweet

Snap a screenshot of a tweet 📸

📸 snap-tweet

Command-line tool to capture clean and simple tweet snapshots.

Light mode

Dark mode

Features

• 🎛 Adjustable width
• 💅 Rounded corners & transparent background
• 🌚 Dark mode
• 🌐 Customizable locale
• 🙅‍♀️ No "Share" & "Info" buttons
• 💖 No watermark
• 🔥 Snap multiple tweets at once

_{Support this project by ⭐️ starring and sharing it. Follow me to see what other cool projects I'm working on! ❤️}

🚀 Install

The only requirement is to have Google Chrome Browser.

npm i -g snap-tweet

npx

Use npx to run without installation.

npx snap-tweet

🚦 Quick usage

Basic usage

By default, the tweet snap is opened in your default image viewer so you can decide whether to save or not.

snap-tweet https://twitter.com/jack/status/20

Save to directory

Save the tweet snap to a specified directory using the --output-dir flag.

snap-tweet https://twitter.com/jack/status/20 --output-dir ~/Desktop

Dark mode

Snap a tweet in dark mode using the --dark-mode flag.

snap-tweet https://twitter.com/jack/status/20 --dark-mode

Custom width

Pass in a custom width for the tweet using the --width flag.

snap-tweet https://twitter.com/github/status/1390807474748416006 --width 900

Tweet with a 900px width

Localization

Pass in a different locale using the --locale flag.

snap-tweet https://twitter.com/TwitterJP/status/578707432 --locale ja

Using the Japanese locale (ja)

Show Thread

Use the --show-thread flag to include the parent tweet in the screenshot.

snap-tweet https://twitter.com/jack/status/1108487919969275904 --show-thread

Parent tweet inlcuded in the screenshot

Multiple tweets

Snap multiple tweets at once by passing in multiple tweet URLs.

snap-tweet https://twitter.com/naval/status/1002103497725173760 https://twitter.com/naval/status/1002103559276478464 https://twitter.com/naval/status/1002103627387813888

Manual

snap-tweet

Usage:
  $ snap-tweet <...tweet urls>

Options:
  -o, --output-dir <path>  Tweet screenshot output directory
  -w, --width <width>      Width of tweet (default: 550)
  -t, --show-thread        Show tweet thread
  -d, --dark-mode          Show tweet in dark mode
  -l, --locale <locale>    Locale (default: en)
  -h, --help               Display this message
  -v, --version            Display version number

🏋️‍♀️ Motivation

It all started when I simply wanted to embed a couple tweets into a Google Doc...

Quick googling showed that there's no way to embed an actual tweet because Google Docs doesn't support HTML iframes or JavaScript. And I wasn't going to install a plugin just for some tweets.

I figured I could just take a screenshot of the tweet. But only to realize I would be spending way too much time cropping each tweet, and they still wouldn't be perfect because of the lack of transparency behind the rounded corners. And not to mention, the static screenshot would include buttons like "Copy link to Tweet" that looked actionable but actually weren't.

I found services like Screenshot Guru (and their Twitter Screenshots Chrome extension), Pikaso, etc. but none of them met my needs (low quality images, actionable buttons present, watermarks, etc.).

All I wanted to do was to embed the tweet like how it looks in the official embedder into a static environment. No sign up, no watermark, no BS... It shouldn't be this hard! 🤯

So of course, I spent a few hours developing a tool to save us all the headache 😇

(I know, this is some pretty crazy yak shaving. Checkout my other projects to see how deep I've gone.)

🙋‍♀️ Need help?

If you have a question about usage, ask on Discussions.

If you'd like to make a feature request or file a bug report, open an Issue.

snap-tweet's Issues

bug: "Read replies" button

Bug description

Reproduction

npx snap-tweet https://twitter.com/jack/status/20

Environment

• snap-tweet version:
• Operating System:
• Node version:
• Package manager (npm/yarn/pnpm) and version:

Rename The File When Saving

Hi - cool library. I was wondering if there is a way to add a flag to rename the file when we save it?

Produced image/snap doesn't show replies, RT's and likes... instead shows "Read 10.1k replies"

Bug description

What did you do? (Provide code in next section)
Took a snap of a tweet of one of the built-in examples. @jack's tweet #20.

What did you expect to happen?
For the snap to appear as in the READ.ME on the git page.

What happened instead?
The program executes correctly on the CLI.
But, in the produced snap, instead of there showing an

---

separator and then the replies, rt's and likes.. there's a button that says Read XX replies.

Do you have an error stack-trace?
Don't know what this is, but I'll get it if it can be explained to me :)

Reproduction

Provide one of the following:

1. snap-tweet https://twitter.com/jack/status/20
2. ??
3. Sharing snap instead:

FYI I am not logged in to twitter on the browser, but I doubt that has any effect.

Environment

• snap-tweet version: snap-tweet/1.2.1 win32-x64 node-v16.14.0
• Operating System: Microsoft Windows 10 Home 10.0.19044 N/A Build 19044
• Node version: v16.14.0
• Package manager (npm/yarn/pnpm) and version: npm 8.5.0

Produced tweet is at a lower resolution

Bug description

What did you do? (Provide code in next section)
Took a snap of Jack's tweet number 20.

What did you expect to happen?
Get a large resolution tweet like in the READ.ME in the program's github page.

What happened instead?
Got a lower resolution instead.

Do you have an error stack-trace?
No clue what this is.

Reproduction

1. snap-tweet https://twitter.com/jack/status/20
2. ??
3. I can share two images:

This one is produced by me:

This is produced by @privatenumber (author):

As a small side note, I noticed that the larger snap isn't perfectly filled with color when placed against a black background (some transparency color is inside the tweet's border):

Maybe the border and the filling have different border radius? Don't know.

Environment

• snap-tweet version: snap-tweet v1.2.2
• Operating System: Microsoft Windows 10 Home 10.0.19044 N/A Build 19044
• Node version: v16.14.0
• Package manager (npm/yarn/pnpm) and version: 8.5.0

Warnings

Hey man thanks for you package, However i deploy it on heroku it take the screenshot but it logs some error after that:

~ $ snap-tweet https://twitter.com/jack/status/20
snap-tweet https://twitter.com/jack/status/20
✔ 📸 Snapped tweet #20 by @jack
/app/.heroku/node/lib/node_modules/snap-tweet/node_modules/yoga-layout-prebuilt/yoga-layout/build/Release/nbind.js:53
        throw ex;
        ^

Error: spawn xdg-open ENOENT
    at Process.ChildProcess._handle.onexit (internal/child_process.js:269:19)
    at onErrorNT (internal/child_process.js:467:16)
    at processTicksAndRejections (internal/process/task_queues.js:82:21)
Emitted 'error' event on ChildProcess instance at:
    at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
    at onErrorNT (internal/child_process.js:467:16)
    at processTicksAndRejections (internal/process/task_queues.js:82:21) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'spawn xdg-open',
  path: 'xdg-open',
  spawnargs: [ '/tmp/bcd1cc484539c835853116333adea229/snap-tweet-jack-20.png' ]
}

Invalid search result range Error

On some tweets reply button is not showing by default. This breaks the code and gives an error Invalid search result range

Application outputs error when no input `Error: Missing required parameter "tweet urls"`

Is your feature request related to a problem?

Makes it more presentable.

Describe the solution you'd like

What kind of solution would you like to see?
Have the -h flag be described as Show help (this screen)
Also, first line of output in -h or no input could be a line that explains what the program does: ie. Command-line tool to capture clean and simple tweet snapshots.

What makes it a good solution?
Makes it friendlier, presentable.
Seems nice when running the application without any input that you didn't get anything wrong. Same as running with -h flag.

Describe alternatives you've considered

Running with -h.

Additional context

Default ouput when no input.

Error: Missing required parameter "tweet urls"

snap-tweet v1.2.2

Usage:
  snap-tweet [flags...] <tweet urls...>

Flags:
  -d, --dark-mode                Show tweet in dark mode
  -h, --help                     Show help
      --locale <locale>          Locale (default: "en")
  -o, --output-dir <path>        Tweet screenshot output directory
  -t, --show-thread              Show tweet thread
      --version                  Show version
  -w, --width <width>            Width of tweet (default: 550)

Examples:
  # Snapshot a tweet
  snap-tweet https://twitter.com/jack/status/20

  # Snapshot a tweet with Japanese locale
  snap-tweet https://twitter.com/TwitterJP/status/578707432 --locale ja

  # Snapshot a tweet with dark mode and 900px width
  snap-tweet https://twitter.com/Interior/status/463440424141459456 --width 900 --dark-mode

How to import snap-tweet in my nodejs app

Hey 👋,
I want to use snap-tweet in my Node.js app.

I have installed the package using this command: npm i -g snap-tweet.

And my code looks like this:

const TweetCamera = require('snap-tweet')

TweetCamera.snapTweet('1420000000000000000');

But I am getting this error: TypeError: TweetCamera.snapTweet is not a function.

So I debugged the TweetCamera object and found that it returned { default: [Getter] }. When I log TweetCamera.default, I get [class yn].

When I write const tweetCamera = new TweetCamera(), I get this error: TypeError: TweetCamera is not a constructor.

So I don't really know what is happening right here. Even after reading the source code, I can't find where I'm messing up. I'm new to Node.js app development, so your help would be awesome.

How to automate tweet screenshot (to IG)?

Considering to create a zap or an automation script where

each new tweet -> screenshot -> post to Instagram

Tips and how to approach is appreciated :)

'Not Found' Error

With both NPM installation and NPX, invoking snap-tweet results in a "Not Found" error

[PARAMETERS] Increase the resolution

It might be interesting to add a parameter to increase the resolution of the snaps. Right now the snaps have a small resolution which makes them blurred.

Any way to run snap-tweet in a headless environment?

How about to run snap-tweet in a headless environment (like a virtual machine)?

Environment:

• Fedora 36 VM
• Node version 16.15.0
• Google Chrome version 103.0.5060.114

I'm getting:

[snap-tweet] Error: connect ECONNREFUSED 127.0.0.1:40353
✖ connect ECONNREFUSED 127.0.0.1:40353:
  https://twitter.com/telegram/status/1507356.......

I know that google-chrome have some flags to run headless:
--headless --disable-gpu

Is there some way to do this?

remove "Tweet your reply" button

Bug description

There's a "Tweet your reply" button at the bottom that was recently added.

Reproduction

$ npx snap-tweet https://twitter.com/ahejlsberg/status/1408192176404635648

Environment

• snap-tweet version:
• Operating System:
• Node version:
• Package manager (npm/yarn/pnpm) and version:

Not working, crashing.

Bug description

What did you expect to happen?

Make the snap of the tweet.

What happened instead?

Crashlog

  ERROR  Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
        1. You might have mismatching versions of React and the renderer (such as React DOM)
        2. You might be breaking the Rules of Hooks
        3. You might have more than one copy of React in the same app
        See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

 - 1. You might have mismatching versions of React and the renderer (such as React DOM)
 - 2. You might be breaking the Rules of Hooks
 - 3. You might have more than one copy of React in the same app
 - See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
 - resolveDispatcher (.npm/_npx/924bde91603cbfe8/node_modules/snap-tweet/node_modules/react/cjs/react.development.js:1476:13)
 - useReducer (.npm/_npx/924bde91603cbfe8/node_modules/snap-tweet/node_modules/react/cjs/react.development.js:1511:20)
 -  (.npm/_npx/924bde91603cbfe8/node_modules/snap-tweet/dist/chunk-TXU6FXSL.js:2635:49)
 - renderWithHooks (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:6036:18)
 - mountIndeterminateComponent (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:8570:13)
 - beginWork$1 (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:9938:16)
 - Object.invokeGuardedCallbackImpl (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:11563:10)
 - invokeGuardedCallback (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:11740:31)
 - beginWork$$1 (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:15778:7)
 - performUnitOfWork (.npm/_npx/924bde91603cbfe8/node_modules/ink/node_modules/react-reconciler/cjs/react-reconciler.development.js:14696:12)

Reproduction

Run the npx snap-tweet with public tweet url and no options.

Environment

snap-tweet/0.0.0-semantic-release linux-x64 node-v16.1.0

Snap includes only amount of likes and a reply button. Missing amount of replies.

Bug description

What did you do? (Provide code in next section)
Tried to take a snap of the example tweets in the help docs. (jack's tweet #20)

What did you expect to happen?
Get a snap.

What happened instead?
Snap produced only amount of likes. Amount of replies is not shown, instead shows a Reply button.

Do you have an error stack-trace?
Haven't got a clue of what this is.

Reproduction

1. snap-tweet https://twitter.com/jack/status/20
2. ??
3. I can share the following..:

Environment

• snap-tweet version: snap-tweet v1.2.2
• Operating System: Microsoft Windows 10 Home 10.0.19044 N/A Build 19044
• Node version: v16.14.0
• Package manager (npm/yarn/pnpm) and version: 8.5.0

Monitor and snap automatically

## Is your feature request related to a problem?
<!-- not really just asking for automation 

  What's the motivation behind this issue?

<!-- Keep record keep an eye on accounts 
Like football players and people reaction after matches or PPV games for hilarious laughing 

  Eg. I'm frustrated when...
-->

## Describe the solution you'd like
<!-- just keep track on that user and take a picture on each new tweet automatically 

  What kind of solution would you like to see?
<!-- Script can get users profiles links from either config.json or users_list.ymal file or any file format6
  What makes it a good solution?
--> I don't know what else I could say 

## Describe alternatives you've considered
<!--
  What else did you try?
 <!-- Nothing just thanks for the hard work mate 
  Do you have a workaround?
--> didn't try anything 

## Additional context
<!--
  Anything else to share?

  Screenshots? Links?

Majority of tweets snapped return "Selector "[role="button"]" not found:" error

Bug description

example error:

Selector "[role="button"]" not found: https://twitter.com/AfggaJlevasseur/status/1490455291317600257

this seems to occur for the majority of tweets I try to snap

Reproduction

snap-tweet https://twitter.com/thesummermarie/status/1474347267549241360

Environment

npm version                                                                                                                                                                                                                        
  'snap-tweet': '0.0.0-semantic-release',
  npm: '8.5.5',
  node: '12.22.9',
  v8: '7.8.279.23-node.56',
  uv: '1.44.1',
  zlib: '1.2.11',
  brotli: '1.0.9',
  ares: '1.18.1',
  modules: '72',
  nghttp2: '1.43.0',
  napi: '8',
  llhttp: '2.1.4',
  http_parser: '2.9.4',
  openssl: '1.1.1m',
  cldr: '37.0',
  icu: '67.1',
  tz: '2019c',
  unicode: '13.0'

Getting ECONNREFUSED at first try of running snap-tweet

Bug description

What did you do? (Provide code in next section)
I tried to take a screensnap of a tweet.

What did you expect to happen?
For snap-tweet to take a snap of a tweet.

What happened instead?
Got a ECONNREFUSED error message.

Do you have an error stack-trace?
Don't know what this is, but I can get it if it can be explained to me ;)

Reproduction

1. snap-tweet https://twitter.com/elonmusk/status/1492227328386154509
2. How do I do this?
3. :

C:\>snap-tweet https://twitter.com/elonmusk/status/1492227328386154509
[snap-tweet] Error: connect ECONNREFUSED ::1:53221
× connect ECONNREFUSED ::1:53221: https://twitter.com/elonmusk/status/1492227328386154509

Environment

• snap-tweet version: snap-tweet/1.2.1 win32-x64 node-v17.5.0
• Operating System: Windows 10
• Node version: node-v17.5.0
• Package manager (npm/yarn/pnpm) and version: npm 8.5.0