5 ms·
Screenshoteer – Command-line website screenshots and mobile emulations
- tronko 8y agoNice small project. This uses a chrome-headless on the background to perform the screenshot, isn't it? Also, you have included a .DS_Store file in your repository.
- vladocar 8y agoYes, it uses puppeteer(headless chrome). For the .DS_Store I totally forgot to put .gitignore :)
- astrodust 8y agoThe version from NPM is 0.3.2 but the GitHub docs are for 1.0.1? Looks like the --url option doesn't (yet) exist on NPM.
- vladocar 8y agoThat is super strange.. I never inserted 0.3.2. The current version is 1.0.1
- astrodust 8y agoThere's another NPM package with an almost but not quite similar name to yours.
- Dragory 8y agoThe one that's 0.3.2 is called "screenshooter", while this tool is called "screenshoteer".
- astrodust 8y agoOh. Well, that would explain.
- vladocar 8y agoThe name is inspired by the "puppeteer" => screenshot + puppe-teer = screenshoteer
- based2 8y agohttps://blog.nightly.mozilla.org/2018/08/23/screenshots-from-the-console/ https://blog.nightly.mozilla.org/2018/08/23/screenshots-from... https://support.mozilla.org/en-US/kb/firefox-screenshots https://support.mozilla.org/en-US/kb/firefox-screenshots
- gpantazes 8y agoThe distinction here is that the links you've posted are from the browser console line, while the tool in question can take screenshots from the terminal/command line (sans browser, can be automated). Firefox and Chrome, and most major browsers can indeed take screenshots from the browser _console_, but taking screenshots from the command line is a separate, interesting concept.
- flanbiscuit 8y agoNice. I made something almost exactly like this using puppeteer as well except it took screenshots of all the pages of a site. It crawled first getting all site pages, then created a JSON config file that would be used to take screenshots with. I should really throw this up on GitHub as well. Funnily enough, I called mine: Screenshotr
- blorenz 8y agoPlease do. Yours sounds a bit more comprehensive than the current state of OP's.
- flanbiscuit 8y agoI'll put it up once I get home from work and post it here (or maybe submit it as a new thread)
- bberenberg 8y agoI would really like to see this as well. We're looking to monitor a set of websites and all child pages (which change dynamically) to identify possible data leaks.
- leppr 8y agoMaybe the interface could be simplified: you're always going to give it URLs so you can allow those as non-option arguments (also can you pass it multiple URLs?).
- ohitsdom 8y agoSeconding this, a very good suggestion to simplify the API.
- fabrik42 8y agoVery cool! I made something similar a while ago: https://github.com/fabrik42/responsive_mockups https://github.com/fabrik42/responsive_mockups My version is less configurable but wraps the screenshots in some beautiful mockups :)
- ajnin 8y agoCool, I was just looking for something like this. A useful feature would be the possibility to screenshot a specific element only instead of the whole page (using something like https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#elementhandlescreenshotoptions https://github.com/GoogleChrome/puppeteer/blob/master/docs/a... ). Also an option to set the ouput filename is a must for scripting !
- vladocar 8y agoI just pushed the version 1.0.2 to npm. Now you can do this: screenshoteer --url https://news.ycombinator.com/item?id=18598672 https://news.ycombinator.com/item?id=18598672 --el ".fatitem"
- philipov 8y agoI like this. Your motto should be "How do I screenshot web?"
- misterxi 8y agoThe code looks pretty clean! I made something very similar a few months back: https://github.com/astronomersiva/mockgen https://github.com/astronomersiva/mockgen This basically generates screenshots with Puppeteer and merges them with a device mock.
- atum47 8y agowhy don't just use chrome/chromium without puppeteer? google-chrome --headless --screenshot http://site.com http://site.com It's a one line command.
- _eht 8y agoBut then you wouldn't need JavaScript...
- mbrumlow 8y agoRead no further than 'npm'...
- deleted 8y ago[deleted]
- rgrieselhuber 8y agoAdding a click-accept feature would be great, so it can automatically click GDPR notices, popup email subscribe boxes, etc.
- eastendguy 8y agoIf you need to do some "work" like closing banners or form filling before taking the screenshot, use the kantu Selenium IDE: https://a9t9.com/kantu/docs/selenium-ide/capturescreenshot https://a9t9.com/kantu/docs/selenium-ide/capturescreenshot Command line options: https://a9t9.com/kantu/docs#cmd https://a9t9.com/kantu/docs#cmd (... and it works in Chrome and Firefox.)
- rgrieselhuber 8y agoThanks!
- deleted 8y ago[deleted]
- beepboopah 8y agoA similar thing I wrote one evening lol https://github.com/Weston-Boldt/webscrot https://github.com/Weston-Boldt/webscrot
- raminv 8y agoI needed to crawl sitemaps, create snapshots in three device sizes (mobile, tablet and desktop) and compare my snapshots with their previous versions. I ended up creating this tool https://github.com/raminv80/webTimeMachine https://github.com/raminv80/webTimeMachine it is not perfect but does the job. I might continue improving it if others find it useful.