From 3895da968b34c4f4dd926d5741b09de89ca29512 Mon Sep 17 00:00:00 2001 From: WeStOn2000 <161762685+WeStOn2000@users.noreply.github.com> Date: Thu, 17 Oct 2024 21:33:20 -0400 Subject: [PATCH 1/2] Added code Readability in this file --- tasks/screencast-start.js | 23 +++++++++++++++-------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/tasks/screencast-start.js b/tasks/screencast-start.js index 4e02d4069ff..ae066fa26ee 100644 --- a/tasks/screencast-start.js +++ b/tasks/screencast-start.js @@ -13,46 +13,53 @@ const execa = require('execa'); const meow = require('meow'); const multimatch = require('multimatch'); +//The main entry point for the program, which starts execution based on CLI arguments main(meow()); +//Main function that controls the execution of the command specified by the user function main(cli) { - let count = 0; + let count = 0;// Keeps track of the times the pattern has matched - const start = Date.now(); - const duration = parseInt(cli.flags.timeout, 10) * 1000; + const start = Date.now();//start time for the process + const duration = parseInt(cli.flags.timeout, 10) * 1000;//time limit in milliseconds const cp = execa(cli.flags.command, { shell: true }); const target = parseInt(cli.flags.patternCount || '1', 10); + //listening to standard output (stdout) of the running command. cp.stdout.on('data', data => { process.stdout.write(data); const matches = multimatch([String(data)], cli.flags.pattern); const errMatches = multimatch([String(data)], cli.flags.errorPattern); if (matches.length > 0) { - count++; + count++;//increment the match count } if (errMatches.length > 0) { - process.exit(1); + process.exit(1);//exits the err if err is found } + //if the target number of matches is reached, exit after a delay. if (count >= target) { setTimeout(() => { - process.exit(0); + process.exit(0);//exits successfully (code 0) }, duration); } }); + //Handles when command exits cp.on('exit', e => { - const elapsed = Date.now() - start; + const elapsed = Date.now() - start;//Calculate the elapsed time since the command started + //if the process took longer than the timeout, exit immediately if (elapsed >= duration) { return; } + //Waiting for the remaining duration before exiting with the same exit code setTimeout(() => { - process.exit(e.exitCode); + process.exit(e.exitCode);//exit with the code returned by the command }, duration - elapsed); }); } From 7ce68a8d495f7a8ea2079493b68b4ad6615b7eb3 Mon Sep 17 00:00:00 2001 From: WeStOn2000 <161762685+WeStOn2000@users.noreply.github.com> Date: Wed, 13 Nov 2024 18:20:03 -0500 Subject: [PATCH 2/2] .. --- package-lock.json | 3 +++ package.json | 3 +++ tasks/screencast.js | 45 ++++++++++++++++++++++++++++----------------- 3 files changed, 34 insertions(+), 17 deletions(-) diff --git a/package-lock.json b/package-lock.json index 19784b84c8c..6228214bc3f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,9 @@ "packages/*", "docusaurus/website" ], + "dependencies": { + "react-scripts": "^5.0.1" + }, "devDependencies": { "@testing-library/jest-dom": "^5.15.1", "@testing-library/react": "^12.1.2", diff --git a/package.json b/package.json index d4217526b63..50ce28d05e6 100644 --- a/package.json +++ b/package.json @@ -56,5 +56,8 @@ "*.{js,json,yml,yaml,css,scss,ts,tsx,md}": [ "prettier --write" ] + }, + "dependencies": { + "react-scripts": "^5.0.1" } } diff --git a/tasks/screencast.js b/tasks/screencast.js index 79dd2290ca5..6657d4f0170 100644 --- a/tasks/screencast.js +++ b/tasks/screencast.js @@ -9,66 +9,77 @@ 'use strict'; +// Import necessary modules const fs = require('fs'); const path = require('path'); const execa = require('execa'); const tempy = require('tempy'); -main(); +main();// Execute the main function function main() { - const previous = process.cwd(); - const cwd = tempy.directory(); + const previous = process.cwd();// Store the current working directory + const cwd = tempy.directory();// Create a temporary directory for the screencast - const cast = path.join(cwd, 'screencast.json'); - const script = path.join(__dirname, 'screencast.sh'); - const out = path.join(previous, 'screencast.svg'); + const cast = path.join(cwd, 'screencast.json');// Path for the screencast JSON file + const script = path.join(__dirname, 'screencast.sh');// Path for the shell script to run + const out = path.join(previous, 'screencast.svg'); // Path for the output SVG file + // Define functions to identify specific lines in the output const resolveLine = l => l.indexOf('🔍 Resolving packages...') > -1; const fetchLine = l => l.indexOf('🚚 Fetching packages...') > -1; const countLine = l => l.match(/Saved [0-9]+ new dependencies/); const doneLine = l => l.indexOf('✨ Done in') > -1; try { - process.chdir(cwd); - console.log(`Recording screencast ...`); + process.chdir(cwd);// Change to the temporary directory + console.log(`Recording screencast ...`);// Log the recording start message + // Execute the 'asciinema' command to record the output of the shell script execa.sync('asciinema', ['rec', '--command', `sh ${script}`, cast], { cwd, - stdio: 'inherit', + stdio: 'inherit',// Inherit stdio to see the output }); - console.log('Cleaning data ...'); - const data = require(cast); + console.log('Cleaning data ...');// Log the data cleaning start message + const data = require(cast); // Load the recorded screencast data + // Cut the recorded frames to keep only relevant parts cut(data.stdout, { start: resolveLine, end: fetchLine }); cut(data.stdout, { start: countLine, end: doneLine }); + // Replace the current working directory in the frames with '~' for privacy replace(data.stdout, [{ in: cwd, out: '~' }]); + // Write the cleaned data back to the screencast JSON file fs.writeFileSync(cast, JSON.stringify(data, null, ' ')); - console.log('Rendering SVG ...'); + console.log('Rendering SVG ...');// Log the SVG rendering start message + // Execute the 'svg-term' command to render the screencast into an SVG file execa.sync('svg-term', ['--window', '--in', cast, '--out', out]); + // Log success messages for both the recorded screencast and rendered SVG console.log(`Recorded screencast to ${cast}`); console.log(`Rendered SVG to ${out}`); } finally { - process.chdir(previous); + process.chdir(previous);// Ensure the working directory is restored } } +// Function to cut the frames based on specified start and end conditions function cut(frames, { start, end }) { - const si = frames.findIndex(([, l]) => start(l)); - const ei = frames.findIndex(([, l]) => end(l)); + const si = frames.findIndex(([, l]) => start(l)); // Find the start index + const ei = frames.findIndex(([, l]) => end(l));// Find the end index + // If either index is not found, exit the function if (si === -1 || ei === -1) { return; } + // Remove the frames between the start and end indices frames.splice(si + 1, ei - si - 1); } - +// Function to replace specified strings in the frames function replace(frames, replacements) { frames.forEach(frame => { - replacements.forEach(r => (frame[1] = frame[1].split(r.in).join(r.out))); + replacements.forEach(r => (frame[1] = frame[1].split(r.in).join(r.out)));// Replace occurrences of 'in' with 'out' }); }