diff --git a/dist/extension.js b/dist/extension.js index 64d4598..e388aed 100644 --- a/dist/extension.js +++ b/dist/extension.js @@ -1029,21 +1029,14 @@ const url_1 = __webpack_require__(/*! url */ "url"); const path = __webpack_require__(/*! path */ "path"); const fs = __webpack_require__(/*! fs */ "fs"); const ps = __webpack_require__(/*! ps-node */ "./node_modules/ps-node/index.js"); -let PORT = 6006; -const host = 'localhost'; -// import * as express from 'express'; -// import { resolveCliPathFromVSCodeExecutablePath } from 'vscode-test'; -// const server = express(); +const child_process = __webpack_require__(/*! child_process */ "child_process"); function activate(context) { - // server.get('/', (req, res) => { - // vscode.window.showInformationMessage('Aesop server online'); - // res.end(); - // }); - // server.listen(PORT); - //set the extension context equal to "aesop is running" - vscode.commands.executeCommand("setContext", "is-running-aesop", true); + let PORT = 6006; + const host = 'localhost'; //create disposable variable type, registers awaken command & opens webview let disposable = vscode.commands.registerCommand('extension.aesopAwaken', () => { + let checkedProcesses = false; + let foundSb = false; //define a path to the root working directory of the user const rootDir = url_1.fileURLToPath(vscode.workspace.workspaceFolders[0].uri.toString(true)); //check first to ensure that Storybook has been depended into the current working directory @@ -1053,63 +1046,151 @@ function activate(context) { vscode.window.showErrorMessage(`Aesop could not find Storybook as a dependency in the active folder, ${rootDir}`); } else { - //check to see if a storybook node process is already running - ps.lookup({ - command: 'node', - psargs: 'ux' - }, (err, resultList) => { - if (err) { - vscode.window.showErrorMessage(`Failed looking for running Node processes. Error: ${err}`); - } - else { - //if the process lookup was able to find running processes, iterate through to review them - //potential problem: we may also need to account for running processes given no port flag - resultList.forEach((process) => { - // ---> OUTPUT LOGGER <--- // - fs.writeFile(path.join(rootDir, 'YOLO.txt'), `Here is the JSON-stringified version of a process:\n${JSON.stringify(process)}\n`, (err) => { console.log(`Couldn't output process information to YOLO.txt: ${err}`); }); - vscode.window.showInformationMessage('Check YOLO.txt for output information'); - //check if any running processes are using the start-storybook script - if (process.arguments[0].includes('storybook')) { - //stretch goal: check for multiple instances of storybook and reconcile + vscode.window.showInformationMessage(`Aesop has found your Storybook dependency. Just a moment...`); + if (checkedProcesses === false) { + //check to see if a storybook node process is already running + ps.lookup({ command: 'node', psargs: 'ux' }, (err, resultList) => { + if (err) { + vscode.window.showErrorMessage(`Failed looking for running Node processes. Error: ${err}`); + } + else { + vscode.window.showInformationMessage(`Aesop is checking for a running Storybook...`); + //if the process lookup was able to find running processes, iterate through to review them + resultList.forEach((process) => { // ---> OUTPUT LOGGER <--- // - fs.appendFile(path.join(rootDir, 'YOLO.txt'), `This process matches for 'storybook'search string:\n - PID: ${process.pid}, COMMAND:${process.command}, ARGUMENTS: ${process.arguments}\n`, (err) => { console.log(err); }); - //if so, extract port number and use that value to populate the webview with that contents - const sbProcess = process.arguments; - const portFlag = '-p'; - const pFlagIndex = sbProcess.indexOf(portFlag); - if (pFlagIndex !== -1) { - PORT = Number(process.arguments[pFlagIndex + 1]); - } - else { - //if no processes match 'storybook', we will have to spin up the storybook server - //starts by extracting the existing storybook script in the package.json - fs.readFile(path.join(rootDir, 'package.json'), (err, data) => { - if (err) { - vscode.window.showErrorMessage(`Does this root folder contain a "package.json" file?`); - } - else { - //enter the package.JSON file and retrieve its contents as a string - let packageJSONText = data.toString(); - // ---> OUTPUT LOGGER <--- // - fs.appendFile(path.join(rootDir, 'YOLO.txt'), `Here is the full contents of the package.json file from the user's workspace folder:\n${packageJSONText}\n`, (err) => { console.log(err); }); - //find where the "storybook" script is defined - let targetScriptStartIndex = packageJSONText.indexOf(`\"storybook\"\:`) + 12; - //retrieve the value (i.e. the entire line of text) of the "storybook" script - let retrievedScript = packageJSONText.slice(targetScriptStartIndex, packageJSONText.indexOf(vscode.EndOfLine.toString())); - // ---> OUTPUT LOGGER <--- // - fs.appendFile(path.join(rootDir, 'YOLO.txt'), `This is what our readFile function (line 72) returns when it attempts to retrieve (line 82) the "storybook" script from your app's package.json:\n${retrievedScript}\n`, (err) => { console.log(err); }); - //iterate through that text string and parse out important flags - //it is more helpful to split it into an array separated by whitespace to grab these - let retrievedScriptAsArray = retrievedScript.split(' '); - for (let i = 0; i < retrievedScriptAsArray.length; i++) { - //add flags - if (retrievedScriptAsArray[i] === '-p') { - PORT = Number(retrievedScriptAsArray[i + 1]); - } + fs.writeFile(path.join(rootDir, 'YOLO.txt'), `Attempted launch log:\n`, (err) => { console.log(`Couldn't output process information to YOLO.txt: ${err}`); }); + //check if any running processes are using the start-storybook script + if (process.arguments[0].includes('storybook')) { + //stretch goal: check for multiple instances of storybook and reconcile + //if so, extract port number and use that value to populate the webview with that contents + const pFlagIndex = process.arguments.indexOf('-p'); + if (pFlagIndex !== -1) { + PORT = parseInt(process.arguments[pFlagIndex + 1]); + } + // ---> OUTPUT LOGGER <--- // + fs.appendFile(path.join(rootDir, 'YOLO.txt'), `This process matches for 'storybook':\n + PID: ${process.pid}, COMMAND:${process.command}, ARGUMENTS: ${process.arguments}\n + PORT has been assigned to: ${PORT}`, (err) => { console.log(err); }); + foundSb = true; + } //---> close if process.arguments[0] contains storybook + }); //---> close resultList.forEach() + checkedProcesses = true; + //if no processes match 'storybook', we will have to spin up the storybook server + if (checkedProcesses === true && foundSb === false) { + //starts by extracting the existing storybook port script in the package.json + fs.readFile(path.join(rootDir, 'package.json'), (err, data) => { + if (err) { + vscode.window.showErrorMessage(`Aesop is attempting to read ${rootDir}. Is there a package.json file here?`); + } + else { + //enter the package.JSON file and retrieve its contents as a string + let packageJSON = JSON.parse(data.toString()); + let storybookScript = packageJSON.scripts.storybook; + // ---> OUTPUT LOGGER <--- // + fs.appendFile(path.join(rootDir, 'YOLO.txt'), `Here is the script for "storybook":\n + ${storybookScript}`, (err) => { console.log(err); }); + //iterate through that text string and parse out important flags + //it is more helpful to split it into an array separated by whitespace to grab these + let retrievedScriptArray = storybookScript.split(' '); + for (let i = 0; i < retrievedScriptArray.length; i++) { + //add flags as we implement further functionality + if (retrievedScriptArray[i] === '-p') { + PORT = parseInt(retrievedScriptArray[i + 1]); + fs.appendFile(path.join(rootDir, 'YOLO.txt'), `Port from script":\n${parseInt(retrievedScriptArray[i + 1])}\n + Port at this moment:\n${PORT}\n`, (err) => { console.log(err); }); + break; } - /* - vscode.tasks.registerTaskProvider('runStorybook', { + else if (i === retrievedScriptArray.length - 1) { + fs.appendFile(path.join(rootDir, 'YOLO.txt'), `Script found, but no port flag detected.\n + Port when no port flag found:\n${PORT}\n`, (err) => { console.log(err); }); + //ADD LOGIC TO HANDLE WHEN NO SCRIPT FLAG IS GIVEN + } + } + //add --ci tag to existing package.json with an fs function? + //process.scripts.storybook = `${storybookScript} --ci` + //execute Ola's logic to launch the child process, passing rootDir as an options arg + const runSb = child_process.spawn('npm', ['run', 'storybook']); + vscode.window.showInformationMessage("Done looking. Aesop will now run Storybook."); + runSb.stdout.on('data', (data) => { + console.log(`stdout: ${data}`); + }); + runSb.on('error', function (err) { + console.error(err); + process.exit(1); + }); + //This will make sure the child process is terminated on process exit + runSb.on('close', (code) => { + console.log(`Child process exited with code ${code}`); + }); + } + }); + } //close spin up server + const panel = vscode.window.createWebviewPanel('aesop-sb', 'Aesop', vscode.ViewColumn.Beside, { + enableScripts: true, + localResourceRoots: [vscode.Uri.file(context.extensionPath)] + }); + panel.webview.html = + ` + +
+ + +