Refactor: Screenshots scripts

.github/workflows/screenshots.yml

@@ -0,0 +1,29 @@
+name: Take screenshots
+on:
+  schedule:
+    - cron: 5 0 * * *
+  workflow_dispatch:
+
+jobs:
+  screenshots:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js 14.x
+        uses: actions/setup-node@v2
+        with:
+          node-version: "14"
+          cache: "npm"
+      - run: npm install
+      - name: Take screenshots
+        id: screenshots
+        run: npm run screenshots
+      - name: Commit screenshots
+        env:
+          LATEST_VERSION: ${{ steps.screenshots.outputs.latest-version }}
+        run: |
+          git config user.name kristiandrex
+          git config user.email cristiandrestorres@gmail.com
+          git add -A
+          git commit -m "Take screenshots to LoL version $LATEST_VERSION"
+          git push

.github/workflows/update.yml

@@ -18,11 +18,7 @@ jobs:
       - name: Download latest version
         id: download
         run: npm run update
-      - name: Take screenshots
-        if: steps.download.outputs.should-update == 'true'
-        run: npm run screenshots
       - name: Commit latest version
-        if: steps.download.outputs.should-update == 'true'
         env:
           LATEST_VERSION: ${{ steps.download.outputs.latest-version }}
         run: |

package.json

@@ -43,6 +43,7 @@
     "eslint-config-next": "^11.0.1"
   },
   "volta": {
-    "node": "14.18.2"
+    "node": "14.18.2",
+    "npm": "6.14.15"
   }
 }

scripts/screenshots.js

@@ -1,56 +1,22 @@
-const { spawn } = require("child_process");
+"use strict";
+
 const puppeteer = require("puppeteer");
 const chalk = require("chalk");
+const core = require("@actions/core");
 
-const { champions } = require("../public/data/latest.json");
-
-function logProcess(child) {
-  child.stdout.on("data", (data) => {
-    console.log(data.toString());
-  });
-
-  child.stderr.on("data", (data) => {
-    console.error(data.toString());
-  });
-}
-
-async function run() {
-  await new Promise((resolve, reject) => {
-    const build = spawn("npm.cmd", ["run", "build"]);
-
-    build.on("close", (code) => {
-      console.log(`Build process close all stdio with code ${code}`);
-      resolve(code);
-    });
+const { champions, version } = require("../public/data/latest.json");
 
-    build.on("error", (err) => {
-      reject(err);
-    });
-
-    logProcess(build);
-  });
-
-  const server = spawn("npm.cmd", ["run", "start"]);
-
-  server.on("close", (code) => {
-    console.log(`Build process close all stdio with code ${code}`);
-  });
-
-  server.on("error", (err) => {
-    console.error(err);
-  });
-
-  logProcess(server);
-
-  await takeScreenshots();
-  server.kill();
-  process.exit(0);
+/**
+ *
+ * @returns {string} Champion id
+ */
+function getRandomChampion() {
+  const index = Math.floor(Math.random() * champions.length);
+  return champions[index].id;
 }
 
-async function takeScreenshots() {
+(async () => {
   try {
-    const champion = getRandomChampion();
-
     const browser = await puppeteer.launch({
       defaultViewport: {
         width: 375,
@@ -59,33 +25,30 @@ async function takeScreenshots() {
     });
 
     const page = await browser.newPage();
+    const PAGE_URL = "https://league-of-react.vercel.app";
 
     console.log(chalk.cyan("Taking screenshot on /"));
-    await page.goto("http://localhost:3000", {
+    await page.goto(PAGE_URL, {
       waitUntil: "networkidle0",
       timeout: 0
     });
+
     await page.screenshot({ path: "docs/images/home.png" });
     console.log(chalk.green("Screenshot successfully"));
 
+    const champion = getRandomChampion();
     console.log(chalk.cyan(`Taking screenshot on /champions/${champion}`));
-    await page.goto(`http://localhost:3000/champions/${champion}`, {
+
+    await page.goto(`${PAGE_URL}/champions/${champion}`, {
       waitUntil: "networkidle0",
       timeout: 0
     });
 
     await page.screenshot({ path: "docs/images/champion.png" });
     console.log(chalk.green("Screenshot successfully"));
-
     await browser.close();
+    core.setOutput("latest-version", version);
   } catch (error) {
     console.error(error);
   }
-}
-
-function getRandomChampion() {
-  const index = Math.floor(Math.random() * champions.length);
-  return champions[index].id;
-}
-
-run();
+})();

scripts/update.js

@@ -1,3 +1,5 @@
+"use strict";
+
 const { promises: fs } = require("fs");
 const path = require("path");
 const fetch = require("node-fetch");
@@ -53,7 +55,6 @@ async function update(versions) {
   );
 
   core.setOutput("latest-version", latest);
-  core.setOutput("should-update", true);
   console.log(chalk.green(`Version ${latest} successfully downloaded.`));
 }
 

scripts/worker.js

@@ -1,3 +1,5 @@
+"use strict";
+
 const Vibrant = require("node-vibrant");
 
 /**