chore(lint): bumped prettier and fixed lint issues

## [0.35.2](https://github.com/sasjs/server/compare/v0.35.1...v0.35.2) (2023-08-07)

### Bug Fixes

* add _debug as optional query param in swagger apis for GET stp/execute ([9586dbb](9586dbb2d0))

.github/workflows/release.yml

@@ -56,4 +56,4 @@ jobs:
 
       - name: Release
         run: |
-          GITHUB_TOKEN=${{ secrets.GH_TOKEN }} semantic-release
+          GITHUB_TOKEN=${{ secrets.GITHUB_TOKEN }} semantic-release

CHANGELOG.md

@@ -1,3 +1,40 @@
+## [0.35.2](https://github.com/sasjs/server/compare/v0.35.1...v0.35.2) (2023-08-07)
+
+
+### Bug Fixes
+
+* add _debug as optional query param in swagger apis for GET stp/execute ([9586dbb](https://github.com/sasjs/server/commit/9586dbb2d0d6611061c9efdfb84030144f62c2ee))
+
+## [0.35.1](https://github.com/sasjs/server/compare/v0.35.0...v0.35.1) (2023-07-25)
+
+
+### Bug Fixes
+
+* **log-separator:** log separator should always wrap log ([8940f4d](https://github.com/sasjs/server/commit/8940f4dc47abae2036b4fcdeb772c31a0ca07cca))
+
+# [0.35.0](https://github.com/sasjs/server/compare/v0.34.2...v0.35.0) (2023-05-03)
+
+
+### Bug Fixes
+
+* **editor:** fixed log/webout/print tabs ([d2de9dc](https://github.com/sasjs/server/commit/d2de9dc13ef2e980286dd03cca5e22cea443ed0c))
+* **execute:** added atribute indicating stp api ([e78f87f](https://github.com/sasjs/server/commit/e78f87f5c00038ea11261dffb525ac8f1024e40b))
+* **execute:** fixed adding print output ([9aaffce](https://github.com/sasjs/server/commit/9aaffce82051d81bf39adb69942bb321e9795141))
+* **execution:** removed empty webout from response ([6dd2f4f](https://github.com/sasjs/server/commit/6dd2f4f87673336135bc7a6de0d2e143e192c025))
+* **webout:** fixed adding empty webout to response payload ([31df72a](https://github.com/sasjs/server/commit/31df72ad88fe2c771d0ef8445d6db9dd147c40c9))
+
+
+### Features
+
+* **editor:** parse print output in response payload ([eb42683](https://github.com/sasjs/server/commit/eb42683fff701bd5b4d2b68760fe0c3ecad573dd))
+
+## [0.34.2](https://github.com/sasjs/server/compare/v0.34.1...v0.34.2) (2023-05-01)
+
+
+### Bug Fixes
+
+* use custom logic for handling sequence ids ([dba53de](https://github.com/sasjs/server/commit/dba53de64664c9d8a40fe69de6281c53d1c73641))
+
 ## [0.34.1](https://github.com/sasjs/server/compare/v0.34.0...v0.34.1) (2023-04-28)
 
 

README.md

@@ -158,7 +158,7 @@ CORS=
 WHITELIST=
 
 # HELMET Cross Origin Embedder Policy
-# Sets the Cross-Origin-Embedder-Policy header to require-corp when `true`
+# Sets the Cross-Origin-Embedder-Policy header to require-corp when `true`
 # options: [true|false] default: true
 # Docs: https://helmetjs.github.io/#reference (`crossOriginEmbedderPolicy`)
 HELMET_COEP=

api/package.json

@@ -18,10 +18,10 @@
     "lint": "npx prettier --check \"src/**/*.{ts,tsx,js,jsx,html,css,sass,less,yml,md,graphql}\"",
     "exe": "npm run build && pkg .",
     "copy:files": "npm run public:copy && npm run sasjsbuild:copy && npm run sas:copy && npm run web:copy",
-    "public:copy": "cp -r ./public/ ./build/public/",
-    "sasjsbuild:copy": "cp -r ./sasjsbuild/ ./build/sasjsbuild/",
-    "sas:copy": "cp -r ./sas/ ./build/sas/",
-    "web:copy": "rimraf web && mkdir web && cp -r ../web/build/ ./web/build/",
+    "public:copy": "cpr ./public/ ./build/public/",
+    "sasjsbuild:copy": "cpr ./sasjsbuild/ ./build/sasjsbuild/",
+    "sas:copy": "cpr ./sas/ ./build/sas/",
+    "web:copy": "rimraf web && mkdir web && cpr ../web/build/ ./web/build/",
     "compileSysInit": "ts-node ./scripts/compileSysInit.ts",
     "copySASjsCore": "ts-node ./scripts/copySASjsCore.ts",
     "downloadMacros": "ts-node ./scripts/downloadMacros.ts"
@@ -58,10 +58,9 @@
     "express-session": "^1.17.2",
     "helmet": "^5.0.2",
     "joi": "^17.4.2",
-    "jsonwebtoken": "^8.5.1",
+    "jsonwebtoken": "^9.0.2",
     "ldapjs": "2.3.3",
     "mongoose": "^6.0.12",
-    "mongoose-sequence": "^5.3.1",
     "morgan": "^1.10.0",
     "multer": "^1.4.5-lts.1",
     "rate-limiter-flexible": "2.4.1",
@@ -80,7 +79,6 @@
     "@types/jest": "^26.0.24",
     "@types/jsonwebtoken": "^8.5.5",
     "@types/ldapjs": "^2.2.4",
-    "@types/mongoose-sequence": "^3.0.6",
     "@types/morgan": "^1.9.3",
     "@types/multer": "^1.4.7",
     "@types/node": "^15.12.2",
@@ -89,6 +87,7 @@
     "@types/unzipper": "^0.10.5",
     "adm-zip": "^0.5.9",
     "axios": "0.27.2",
+    "cpr": "^3.0.1",
     "csrf": "^3.1.0",
     "dotenv": "^10.0.0",
     "http-headers-validation": "^0.0.1",
@@ -97,7 +96,7 @@
     "nodejs-file-downloader": "4.10.2",
     "nodemon": "^2.0.7",
     "pkg": "5.6.0",
-    "prettier": "^2.3.1",
+    "prettier": "^3.0.3",
     "rimraf": "^3.0.2",
     "supertest": "^6.1.3",
     "ts-jest": "^27.0.3",

api/public/swagger.yaml

@@ -772,7 +772,7 @@ paths:
                             examples:
                                 'Example 1':
                                     value: [{clientId: someClientID1234, clientSecret: someRandomCryptoString, accessTokenExpiration: 86400}, {clientId: someOtherClientID, clientSecret: someOtherRandomCryptoString, accessTokenExpiration: 86400}]
-            summary: 'Admin only task. Returns the list of all the clients   *'
+            summary: 'Admin only task. Returns the list of all the clients'
             tags:
                 - Client
             security:
@@ -792,7 +792,7 @@ paths:
                                     - {type: string}
                                     - {type: string, format: byte}
             description: 'Execute Code on the Specified Runtime'
-            summary: 'Run Code and Return Webout Content and Log'
+            summary: "Run Code and Return Webout Content, Log and Print output\nThe order of returned parts of the payload is:\n1. Webout (if present)\n2. Logs UUID (used as separator)\n3. Log\n4. Logs UUID (used as separator)\n5. Print (if present and if the runtime is SAS)\nPlease see"
             tags:
                 - Code
             security:
@@ -1789,7 +1789,7 @@ paths:
                                 anyOf:
                                     - {type: string}
                                     - {type: string, format: byte}
-            description: "Trigger a Stored Program using the _program URL parameter.\n\nAccepts URL parameters and file uploads.  For more details, see docs:\n\nhttps://server.sasjs.io/storedprograms"
+            description: "Trigger a Stored Program using the _program URL parameter.\n\nAccepts additional URL parameters (converted to session variables)\nand file uploads.  For more details, see docs:\n\nhttps://server.sasjs.io/storedprograms"
             summary: 'Execute a Stored Program, returns _webout and (optionally) log.'
             tags:
                 - STP
@@ -1805,6 +1805,15 @@ paths:
                     schema:
                         type: string
                     example: /Projects/myApp/some/program
+                -
+                    description: 'Optional query param for setting debug mode, which will return the session log.'
+                    in: query
+                    name: _debug
+                    required: false
+                    schema:
+                        format: double
+                        type: number
+                    example: 131
         post:
             operationId: ExecutePostRequest
             responses:

api/src/controllers/code.ts

@@ -28,7 +28,14 @@ interface ExecuteCodePayload {
 export class CodeController {
   /**
    * Execute Code on the Specified Runtime
-   * @summary Run Code and Return Webout Content and Log
+   * @summary Run Code and Return Webout Content, Log and Print output
+   * The order of returned parts of the payload is:
+   * 1. Webout (if present)
+   * 2. Logs UUID (used as separator)
+   * 3. Log
+   * 4. Logs UUID (used as separator)
+   * 5. Print (if present and if the runtime is SAS)
+   * Please see @sasjs/server/api/src/controllers/internal/Execution.ts for more information
    */
   @Post('/execute')
   public async executeCode(
@@ -55,7 +62,8 @@ const executeCode = async (
       preProgramVariables: getPreProgramVariables(req),
       vars: { ...req.query, _debug: 131 },
       otherArgs: { userAutoExec },
-      runTime: runTime
+      runTime: runTime,
+      includePrintOutput: true
     })
 
     return result

api/src/controllers/internal/Execution.ts

@@ -33,6 +33,7 @@ interface ExecuteFileParams {
 
 interface ExecuteProgramParams extends Omit<ExecuteFileParams, 'programPath'> {
   program: string
+  includePrintOutput?: boolean
 }
 
 export class ExecutionController {
@@ -67,7 +68,8 @@ export class ExecutionController {
     otherArgs,
     session: sessionByFileUpload,
     runTime,
-    forceStringResult
+    forceStringResult,
+    includePrintOutput
   }: ExecuteProgramParams): Promise<ExecuteReturnRaw> {
     const sessionController = getSessionController(runTime)
 
@@ -78,7 +80,6 @@ export class ExecutionController {
 
     const logPath = path.join(session.path, 'log.log')
     const headersPath = path.join(session.path, 'stpsrv_header.txt')
-
     const weboutPath = path.join(session.path, 'webout.txt')
     const tokenFile = path.join(session.path, 'reqHeaders.txt')
 
@@ -122,12 +123,29 @@ export class ExecutionController {
     // it should be deleted by scheduleSessionDestroy
     session.inUse = false
 
+    const resultParts = []
+
+    // INFO: webout can be a Buffer, that is why it's length should be checked to determine if it is empty
+    if (webout && webout.length !== 0) resultParts.push(webout)
+
+    // INFO: log separator wraps the log from the beginning and the end
+    resultParts.push(process.logsUUID)
+    resultParts.push(log)
+    resultParts.push(process.logsUUID)
+
+    if (includePrintOutput && runTime === RunTimeType.SAS) {
+      const printOutputPath = path.join(session.path, 'output.lst')
+      const printOutput = (await fileExists(printOutputPath))
+        ? await readFile(printOutputPath)
+        : ''
+
+      if (printOutput) resultParts.push(printOutput)
+    }
+
     return {
       httpHeaders,
       result:
-        isDebugOn(vars) || session.crashed
-          ? `${webout}\n${process.logsUUID}\n${log}`
-          : webout
+        isDebugOn(vars) || session.crashed ? resultParts.join(`\n`) : webout
     }
   }
 

api/src/controllers/internal/Session.ts

@@ -190,7 +190,8 @@ ${autoExecContent}`
   }
 
   private scheduleSessionDestroy(session: Session) {
-    setTimeout(async () => {
+    setTimeout(
+      async () => {
         if (session.inUse) {
           // adding 10 more minutes
           const newDeathTimeStamp = parseInt(session.deathTimeStamp) + 10 * 1000
@@ -200,7 +201,9 @@ ${autoExecContent}`
         } else {
           await this.deleteSession(session)
         }
-    }, parseInt(session.deathTimeStamp) - new Date().getTime() - 100)
+      },
+      parseInt(session.deathTimeStamp) - new Date().getTime() - 100
+    )
   }
 }
 

api/src/controllers/stp.ts

@@ -3,12 +3,11 @@ import { Request, Security, Route, Tags, Post, Body, Get, Query } from 'tsoa'
 import { ExecutionController, ExecutionVars } from './internal'
 import {
   getPreProgramVariables,
-  HTTPHeaders,
-  LogLine,
   makeFilesNamesMap,
   getRunTimeAndFilePath
 } from '../utils'
 import { MulterFile } from '../types/Upload'
+import { debug } from 'console'
 
 interface ExecutePostRequestPayload {
   /**
@@ -25,20 +24,31 @@ export class STPController {
   /**
    * Trigger a Stored Program using the _program URL parameter.
    *
-   * Accepts URL parameters and file uploads.  For more details, see docs:
+   * Accepts additional URL parameters (converted to session variables)
+   * and file uploads.  For more details, see docs:
    *
    * https://server.sasjs.io/storedprograms
    *
    * @summary Execute a Stored Program, returns _webout and (optionally) log.
    * @param _program Location of code in SASjs Drive
+   * @param _debug Optional query param for setting debug mode, which will return the session log.
    * @example _program "/Projects/myApp/some/program"
+   * @example _debug 131
    */
   @Get('/execute')
   public async executeGetRequest(
     @Request() request: express.Request,
-    @Query() _program: string
+    @Query() _program: string,
+    @Query() _debug?: number
   ): Promise<string | Buffer> {
-    const vars = request.query as ExecutionVars
+    let vars = request.query as ExecutionVars
+    if (_debug) {
+      vars = {
+        ...vars,
+        _debug
+      }
+    }
+
     return execute(request, _program, vars)
   }
 

api/src/model/Counter.ts

@@ -0,0 +1,15 @@
+import mongoose, { Schema } from 'mongoose'
+
+const CounterSchema = new Schema({
+  id: {
+    type: String,
+    required: true,
+    unique: true
+  },
+  seq: {
+    type: Number,
+    required: true
+  }
+})
+
+export default mongoose.model('Counter', CounterSchema)

api/src/model/Group.ts

@@ -1,8 +1,7 @@
-import mongoose, { Schema, model, Document, Model } from 'mongoose'
+import { Schema, model, Document, Model } from 'mongoose'
 import { GroupDetailsResponse } from '../controllers'
 import User, { IUser } from './User'
-import { AuthProviderType } from '../utils'
-const AutoIncrement = require('mongoose-sequence')(mongoose)
+import { AuthProviderType, getSequenceNextValue } from '../utils'
 
 export const PUBLIC_GROUP_NAME = 'Public'
 
@@ -44,6 +43,10 @@ const groupSchema = new Schema<IGroupDocument>({
     required: true,
     unique: true
   },
+  groupId: {
+    type: Number,
+    unique: true
+  },
   description: {
     type: String,
     default: 'Group description.'
@@ -59,9 +62,13 @@ const groupSchema = new Schema<IGroupDocument>({
   users: [{ type: Schema.Types.ObjectId, ref: 'User' }]
 })
 
-groupSchema.plugin(AutoIncrement, { inc_field: 'groupId' })
-
 // Hooks
+groupSchema.pre('save', async function () {
+  if (this.isNew) {
+    this.groupId = await getSequenceNextValue('groupId')
+  }
+})
+
 groupSchema.post('save', function (group: IGroup, next: Function) {
   group.populate('users', 'id username displayName -_id').then(function () {
     next()

api/src/model/Permission.ts

@@ -1,6 +1,6 @@
-import mongoose, { Schema, model, Document, Model } from 'mongoose'
-const AutoIncrement = require('mongoose-sequence')(mongoose)
+import { Schema, model, Document, Model } from 'mongoose'
 import { PermissionDetailsResponse } from '../controllers'
+import { getSequenceNextValue } from '../utils'
 
 interface GetPermissionBy {
   user?: Schema.Types.ObjectId
@@ -23,6 +23,10 @@ interface IPermissionModel extends Model<IPermission> {
 }
 
 const permissionSchema = new Schema<IPermissionDocument>({
+  permissionId: {
+    type: Number,
+    unique: true
+  },
   path: {
     type: String,
     required: true
@@ -39,7 +43,12 @@ const permissionSchema = new Schema<IPermissionDocument>({
   group: { type: Schema.Types.ObjectId, ref: 'Group' }
 })
 
-permissionSchema.plugin(AutoIncrement, { inc_field: 'permissionId' })
+// Hooks
+permissionSchema.pre('save', async function () {
+  if (this.isNew) {
+    this.permissionId = await getSequenceNextValue('permissionId')
+  }
+})
 
 // Static Methods
 permissionSchema.static('get', async function (getBy: GetPermissionBy): Promise<

api/src/model/User.ts

@@ -1,7 +1,6 @@
-import mongoose, { Schema, model, Document, Model } from 'mongoose'
-const AutoIncrement = require('mongoose-sequence')(mongoose)
+import { Schema, model, Document, Model } from 'mongoose'
 import bcrypt from 'bcryptjs'
-import { AuthProviderType } from '../utils'
+import { AuthProviderType, getSequenceNextValue } from '../utils'
 
 export interface UserPayload {
   /**
@@ -66,6 +65,10 @@ const userSchema = new Schema<IUserDocument>({
     required: true,
     unique: true
   },
+  id: {
+    type: Number,
+    unique: true
+  },
   password: {
     type: String,
     required: true
@@ -107,7 +110,15 @@ const userSchema = new Schema<IUserDocument>({
     }
   ]
 })
-userSchema.plugin(AutoIncrement, { inc_field: 'id' })
+
+// Hooks
+userSchema.pre('save', async function (next) {
+  if (this.isNew) {
+    this.id = await getSequenceNextValue('id')
+  }
+
+  next()
+})
 
 // Static Methods
 userSchema.static('hashPassword', (password: string): string => {

api/src/routes/api/stp.ts

@@ -13,7 +13,11 @@ stpRouter.get('/execute', async (req, res) => {
   if (error) return res.status(400).send(error.details[0].message)
 
   try {
-    const response = await controller.executeGetRequest(req, query._program)
+    const response = await controller.executeGetRequest(
+      req,
+      query._program,
+      query._debug
+    )
 
     if (response instanceof Buffer) {
       res.writeHead(200, (req as any).sasHeaders)

api/src/utils/getSequenceNextValue.ts

@@ -0,0 +1,15 @@
+import Counter from '../model/Counter'
+
+export const getSequenceNextValue = async (seqName: string) => {
+  const seqDoc = await Counter.findOne({ id: seqName })
+  if (!seqDoc) {
+    await Counter.create({ id: seqName, seq: 1 })
+    return 1
+  }
+
+  seqDoc.seq += 1
+
+  await seqDoc.save()
+
+  return seqDoc.seq
+}

api/src/utils/index.ts

@@ -14,6 +14,7 @@ export * from './getCertificates'
 export * from './getDesktopFields'
 export * from './getPreProgramVariables'
 export * from './getRunTimeAndFilePath'
+export * from './getSequenceNextValue'
 export * from './getServerUrl'
 export * from './getTokensFromDB'
 export * from './instantiateLogger'

api/src/utils/upload.ts

@@ -51,9 +51,8 @@ export const generateFileUploadSasCode = async (
   let fileCount = 0
   const uploadedFiles: UploadedFiles[] = []
 
-  const sasSessionFolderList: string[] = await listFilesInFolder(
-    sasSessionFolder
-  )
+  const sasSessionFolderList: string[] =
+    await listFilesInFolder(sasSessionFolder)
   sasSessionFolderList.forEach((fileName) => {
     let fileCountString = fileCount < 100 ? '0' + fileCount : fileCount
     fileCountString = fileCount < 10 ? '00' + fileCount : fileCount

api/src/utils/validation.ts

@@ -180,7 +180,8 @@ export const runCodeValidation = (data: any): Joi.ValidationResult =>
 
 export const executeProgramRawValidation = (data: any): Joi.ValidationResult =>
   Joi.object({
-    _program: Joi.string().required()
+    _program: Joi.string().required(),
+    _debug: Joi.number()
   })
     .pattern(/^/, Joi.alternatives(Joi.string(), Joi.number()))
     .validate(data)

web/package-lock.json

@@ -56,7 +56,7 @@
         "file-loader": "^6.2.0",
         "html-webpack-plugin": "5.5.0",
         "path": "0.12.7",
-        "prettier": "^2.4.1",
+        "prettier": "^3.0.3",
         "sass": "^1.44.0",
         "sass-loader": "^12.3.0",
         "style-loader": "^3.3.1",
@@ -9413,15 +9413,18 @@
       }
     },
     "node_modules/prettier": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz",
-      "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz",
+      "integrity": "sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==",
       "dev": true,
       "bin": {
-        "prettier": "bin-prettier.js"
+        "prettier": "bin/prettier.cjs"
       },
       "engines": {
-        "node": ">=10.13.0"
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
       }
     },
     "node_modules/pretty-error": {
@@ -18615,9 +18618,9 @@
       "dev": true
     },
     "prettier": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz",
-      "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz",
+      "integrity": "sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==",
       "dev": true
     },
     "pretty-error": {

web/package.json

@@ -4,7 +4,9 @@
   "private": true,
   "scripts": {
     "start": "webpack-dev-server --config webpack.dev.ts --hot",
-    "build": "webpack --config webpack.prod.ts"
+    "build": "webpack --config webpack.prod.ts",
+    "lint": "npx prettier --check \"src/**/*.{ts,tsx,js,jsx,html,css,sass,less,yml,md,graphql}\"",
+    "lint:fix": "npx prettier --write \"src/**/*.{ts,tsx,js,jsx,html,css,sass,less,yml,md,graphql}\""
   },
   "dependencies": {
     "@emotion/react": "^11.4.1",
@@ -55,7 +57,7 @@
     "file-loader": "^6.2.0",
     "html-webpack-plugin": "5.5.0",
     "path": "0.12.7",
-    "prettier": "^2.4.1",
+    "prettier": "^3.0.3",
     "sass": "^1.44.0",
     "sass-loader": "^12.3.0",
     "style-loader": "^3.3.1",

web/src/components/snackbar.tsx

@@ -3,12 +3,11 @@ import Snackbar from '@mui/material/Snackbar'
 import MuiAlert, { AlertProps } from '@mui/material/Alert'
 import Slide, { SlideProps } from '@mui/material/Slide'
 
-const Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(
-  props,
-  ref
-) {
+const Alert = React.forwardRef<HTMLDivElement, AlertProps>(
+  function Alert(props, ref) {
     return <MuiAlert elevation={6} ref={ref} variant="filled" {...props} />
-})
+  }
+)
 
 const Transition = (props: SlideProps) => {
   return <Slide {...props} direction="up" />

web/src/containers/Studio/editor.tsx

@@ -62,6 +62,7 @@ const SASjsEditor = ({
     selectedRunTime,
     showDiff,
     webout,
+    printOutput,
     Dialog,
     handleChangeRunTime,
     handleDiffEditorDidMount,
@@ -153,6 +154,7 @@ const SASjsEditor = ({
           >
             <TabList onChange={handleTabChange} centered>
               <StyledTab label="Code" value="code" />
+              {log && (
                 <StyledTab
                   label={logWithErrorsOrWarnings ? '' : 'log'}
                   value="log"
@@ -169,6 +171,8 @@ const SASjsEditor = ({
                     if (logWrapper) logWrapper.scrollTop = 0
                   }}
                 />
+              )}
+              {webout && (
                 <StyledTab
                   label={
                     <Tooltip title="Displays content from the _webout fileref">
@@ -177,6 +181,8 @@ const SASjsEditor = ({
                   }
                   value="webout"
                 />
+              )}
+              {printOutput && <StyledTab label="print" value="printOutput" />}
             </TabList>
           </Box>
 
@@ -222,11 +228,20 @@ const SASjsEditor = ({
               <LogComponent log={log} selectedRunTime={selectedRunTime} />
             )}
           </StyledTabPanel>
+          {webout && (
             <StyledTabPanel value="webout">
               <div>
                 <pre>{webout}</pre>
               </div>
             </StyledTabPanel>
+          )}
+          {printOutput && (
+            <StyledTabPanel value="printOutput">
+              <div>
+                <pre>{printOutput}</pre>
+              </div>
+            </StyledTabPanel>
+          )}
         </TabContext>
       )}
       <Dialog />

web/src/containers/Studio/internal/components/log/log.module.css

@@ -7,8 +7,10 @@
   border: none;
   outline: none;
   transition: 0.4s;
-  box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px,
-    rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;
+  box-shadow:
+    rgba(0, 0, 0, 0.2) 0px 2px 1px -1px,
+    rgba(0, 0, 0, 0.14) 0px 1px 1px 0px,
+    rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;
 }
 
 .ChunkDetails {

web/src/containers/Studio/internal/hooks/useEditor.ts

@@ -39,14 +39,14 @@ const useEditor = ({
   const { Snackbar, setOpenSnackbar, setSnackbarMessage, setSnackbarSeverity } =
     useSnackbar()
   const [isLoading, setIsLoading] = useState(false)
-
   const [prevFileContent, setPrevFileContent] = useStateWithCallback('')
   const [fileContent, setFileContent] = useState('')
   const [log, setLog] = useState<LogObject | string>()
-  const [webout, setWebout] = useState('')
+  const [webout, setWebout] = useState<string>()
+  const [printOutput, setPrintOutput] = useState<string>()
   const [runTimes, setRunTimes] = useState<string[]>([])
-  const [selectedRunTime, setSelectedRunTime] = useState<RunTimeType | string>(
-    ''
+  const [selectedRunTime, setSelectedRunTime] = useState<RunTimeType>(
+    RunTimeType.SAS
   )
   const [selectedFileExtension, setSelectedFileExtension] = useState('')
   const [openFilePathInputModal, setOpenFilePathInputModal] = useState(false)
@@ -169,25 +169,30 @@ const useEditor = ({
           ),
           runTime: selectedRunTime
         })
-        .then((res: any) => {
-          if (selectedRunTime === RunTimeType.SAS) {
-            const { errors, warnings, logLines } = parseErrorsAndWarnings(
-              res.data.split(SASJS_LOGS_SEPARATOR)[1]
-            )
+        .then((res: { data: string }) => {
+          // INFO: the order of payload parts is set in @sasjs/server/api/src/controllers/internal/Execution.ts
+          const resDataSplitted = res.data.split(SASJS_LOGS_SEPARATOR)
+          const webout = resDataSplitted[0]
+          const log = resDataSplitted[1]
+          const printOutput = resDataSplitted[2]
 
-            const log: LogObject = {
+          if (selectedRunTime === RunTimeType.SAS) {
+            const { errors, warnings, logLines } = parseErrorsAndWarnings(log)
+
+            const logObject: LogObject = {
               body: logLines.join(`\n`),
               errors,
               warnings,
               linesCount: logLines.length
             }
 
-            setLog(log)
+            setLog(logObject)
           } else {
-            setLog(res.data.split(SASJS_LOGS_SEPARATOR)[1] ?? '')
+            setLog(log)
           }
 
-          setWebout(res.data.split(SASJS_LOGS_SEPARATOR)[0] ?? '')
+          setWebout(webout)
+          setPrintOutput(printOutput)
           setTab('log')
 
           // Scroll to bottom of log
@@ -335,6 +340,7 @@ const useEditor = ({
     selectedRunTime,
     showDiff,
     webout,
+    printOutput,
     Dialog,
     handleChangeRunTime,
     handleDiffEditorDidMount,

web/src/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />