Update screenshot script

Author: phuocng

bin/generateScreenshot.ts

@@ -0,0 +1,34 @@
+#!/usr/bin/env node
+
+// Run this script from the root folder
+// $ npm run screenshot slug-of-pattern-here
+
+const puppeteer = require('puppeteer');
+
+const main = () => {
+    const args = process.argv;
+    if (!args || !Array.isArray(args) || args.length < 2) {
+        console.log('Please specific the pattern: npm run screenshot slug-of-pattern-here');
+        return;
+    }
+
+    const pattern = args[2];
+    
+    (async () => {
+        const browser = await puppeteer.launch();    
+           
+        const page = await browser.newPage();
+        await page.goto(`http://localhost:1234/patterns/${pattern}`);
+
+        await page.waitForSelector('.demo__live');
+        const element = await page.$('.demo__live');
+        await element.screenshot({
+            path: `public/assets/patterns/${pattern}.png`
+        });
+        await page.close();
+        
+        await browser.close();
+    })();
+};
+
+main();

bin/generateScreenshots.ts

@@ -9,7 +9,7 @@
         "deploy": "npm run build && netlify deploy --dir=dist --prod",
         "analyse": "NODE_ENV=analyse webpack --config webpack.config.js -p",
         "lint": "tslint -c tslint.json -o tslint.log 'client/**/*.{ts,tsx}'",
-        "screenshot": "TS_NODE_COMPILER_OPTIONS='{\"module\":\"commonjs\"}' ts-node bin/generateScreenshots.ts"
+        "screenshot": "TS_NODE_COMPILER_OPTIONS='{\"module\":\"commonjs\"}' ts-node bin/generateScreenshot.ts"
     },
     "dependencies": {
         "@loadable/component": "^5.14.1",