chore(release): 0.0.45

fix: providing a PRINT destination during SAS invocation.

CHANGELOG.md

@@ -2,6 +2,65 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.0.45](https://github.com/sasjs/server/compare/v0.0.43...v0.0.45) (2022-03-29)
+
+
+### Bug Fixes
+
+* DELETE req cannot have body ([0a5aece](https://github.com/sasjs/server/commit/0a5aeceab560b022197d0c30c3da7f091b261b1e))
+* increased req body size ([6dc39c0](https://github.com/sasjs/server/commit/6dc39c0d91ac13d6d9b8c0a2240446bfc45bdd7f))
+* proving a PRINT destination during SAS invocation. ([7f4201b](https://github.com/sasjs/server/commit/7f4201ba855743144fa6d3efac2b11e816d4696e)), closes [#111](https://github.com/sasjs/server/issues/111)
+* **session:** increased session + bug fixed ([117a53c](https://github.com/sasjs/server/commit/117a53ceeadf487a6326384ae11c10e98646631f))
+* **stp:** use same session from file upload ([dd56a95](https://github.com/sasjs/server/commit/dd56a95314f0b61480489118734e45877e1745ef))
+
+### [0.0.44](https://github.com/sasjs/server/compare/v0.0.43...v0.0.44) (2022-03-29)
+
+
+### Bug Fixes
+
+* DELETE req cannot have body ([0a5aece](https://github.com/sasjs/server/commit/0a5aeceab560b022197d0c30c3da7f091b261b1e))
+* increased req body size ([6dc39c0](https://github.com/sasjs/server/commit/6dc39c0d91ac13d6d9b8c0a2240446bfc45bdd7f))
+* **session:** increased session + bug fixed ([117a53c](https://github.com/sasjs/server/commit/117a53ceeadf487a6326384ae11c10e98646631f))
+* **stp:** use same session from file upload ([dd56a95](https://github.com/sasjs/server/commit/dd56a95314f0b61480489118734e45877e1745ef))
+
+### [0.0.43](https://github.com/sasjs/server/compare/v0.0.42...v0.0.43) (2022-03-23)
+
+
+### Bug Fixes
+
+* **deploy:** user can deploy to same appName with different/same appLoc ([9ace33d](https://github.com/sasjs/server/commit/9ace33d7830a9def42d741c23b46090afe0c5510))
+* fallback logo on AppStream ([5655311](https://github.com/sasjs/server/commit/5655311b9663225823c192b39a03f39d17dda730))
+
+### [0.0.42](https://github.com/sasjs/server/compare/v0.0.41...v0.0.42) (2022-03-23)
+
+
+### Bug Fixes
+
+* execute api, webout as raw ([9c75187](https://github.com/sasjs/server/commit/9c751877d1ed0d0677aff816169a1df7c34c6bf5))
+
+### [0.0.41](https://github.com/sasjs/server/compare/v0.0.40...v0.0.41) (2022-03-23)
+
+
+### Bug Fixes
+
+* **scroll:** closes [#100](https://github.com/sasjs/server/issues/100) ([f4eb75f](https://github.com/sasjs/server/commit/f4eb75ff347e78ac334e55ee26fbdd247bb8eaa2))
+
+### [0.0.40](https://github.com/sasjs/server/compare/v0.0.39...v0.0.40) (2022-03-23)
+
+
+### Bug Fixes
+
+* **deploy:** validating empty file or service in filetree ([27e260e](https://github.com/sasjs/server/commit/27e260e6a453e9978830db63ab669bd48c029897))
+* macros available for SAS ([7a70d40](https://github.com/sasjs/server/commit/7a70d40dbf0cd91cb3af156755f10006b860f917))
+* moved macros from codebase to drive ([d27e070](https://github.com/sasjs/server/commit/d27e070fc83894854278df22a8223b8016a1f5f7))
+
+### [0.0.39](https://github.com/sasjs/server/compare/v0.0.38...v0.0.39) (2022-03-23)
+
+
+### Bug Fixes
+
+* included sasjs core macros at compile time ([e680901](https://github.com/sasjs/server/commit/e68090181acd844f86f3e81153cb5a4e3f4a307f))
+
 ### [0.0.38](https://github.com/sasjs/server/compare/v0.0.37...v0.0.38) (2022-03-23)
 
 

README.md

@@ -48,11 +48,21 @@ When launching the app, it will make use of specific environment variables. Thes
 Example contents of a `.env` file:
 
 ```
-MODE=desktop # options: [desktop|server] default: `desktop`
+# options: [desktop|server] default: `desktop`
-CORS=disable # options: [disable|enable] default: `disable` for `server` & `enable` for `desktop`
+MODE=
-WHITELIST= # options: <http://localhost:3000 https://abc.com ...> space separated urls
+
-PROTOCOL=http # options: [http|https] default: http
+# options: [disable|enable] default: `disable` for `server` & `enable` for `desktop`
-PORT=5000 # default: 5000
+CORS=
+
+# options: <http://localhost:3000 https://abc.com ...> space separated urls
+WHITELIST=
+
+# options: [http|https] default: http
+PROTOCOL=
+
+# default: 5000
+PORT=
+
 
 # optional
 # for MODE: `desktop`, prompts user

api/package.json

@@ -29,6 +29,7 @@
     "assets": [
       "./build/public/**/*",
       "./build/sasjsbuild/**/*",
+      "./build/sasjscore/**/*",
       "./web/build/**/*"
     ],
     "targets": [
@@ -91,7 +92,7 @@
   },
   "nodemonConfig": {
     "ignore": [
-      "tmp/appStreamConfig.json"
+      "tmp/**/*"
     ]
   }
 }

api/public/swagger.yaml

@@ -161,6 +161,8 @@ components:
                                 $ref: '#/components/schemas/FolderMember'
                             -
                                 $ref: '#/components/schemas/ServiceMember'
+                            -
+                                $ref: '#/components/schemas/FileMember'
                     type: array
             required:
                 - name
@@ -172,20 +174,30 @@ components:
             enum:
                 - service
             type: string
-        MemberType.file:
-            enum:
-                - file
-            type: string
         ServiceMember:
             properties:
                 name:
                     type: string
                 type:
-                    anyOf:
+                    $ref: '#/components/schemas/MemberType.service'
-                        -
+                code:
-                            $ref: '#/components/schemas/MemberType.service'
+                    type: string
-                        -
+            required:
-                            $ref: '#/components/schemas/MemberType.file'
+                - name
+                - type
+                - code
+            type: object
+            additionalProperties: false
+        MemberType.file:
+            enum:
+                - file
+            type: string
+        FileMember:
+            properties:
+                name:
+                    type: string
+                type:
+                    $ref: '#/components/schemas/MemberType.file'
                 code:
                     type: string
             required:
@@ -203,6 +215,8 @@ components:
                                 $ref: '#/components/schemas/FolderMember'
                             -
                                 $ref: '#/components/schemas/ServiceMember'
+                            -
+                                $ref: '#/components/schemas/FileMember'
                     type: array
             required:
                 - members
@@ -635,7 +649,6 @@ paths:
                                 required:
                                     - status
                                 type: object
-            description: "It's optional to either provide `_filePath` in url as query parameter\nOr provide `filePath` in body as form field.\nBut it's required to provide else API will respond with Bad Request."
             summary: 'Delete file from SASjs Drive'
             tags:
                 - Drive
@@ -646,19 +659,10 @@ paths:
                 -
                     in: query
                     name: _filePath
-                    required: false
+                    required: true
                     schema:
                         type: string
                     example: /Public/somefolder/some.file
-            requestBody:
-                required: false
-                content:
-                    multipart/form-data:
-                        schema:
-                            type: object
-                            properties:
-                                filePath:
-                                    type: string
         post:
             operationId: SaveFile
             responses:

api/scripts/copySASjsCore.ts

@@ -1,7 +1,14 @@
 import path from 'path'
-import { asyncForEach, copy, createFolder, deleteFolder } from '@sasjs/utils'
+import {
+  asyncForEach,
+  copy,
+  createFile,
+  createFolder,
+  deleteFolder,
+  listFilesInFolder
+} from '@sasjs/utils'
 
-import { apiRoot, sasJSCoreMacros } from '../src/utils'
+import { apiRoot, sasJSCoreMacros, sasJSCoreMacrosInfo } from '../src/utils'
 
 const macroCorePath = path.join(apiRoot, 'node_modules', '@sasjs', 'core')
 
@@ -16,6 +23,10 @@ export const copySASjsCore = async () => {
 
     await copy(coreSubFolderPath, sasJSCoreMacros)
   })
+
+  const fileNames = await listFilesInFolder(sasJSCoreMacros)
+
+  await createFile(sasJSCoreMacrosInfo, fileNames.join('\n'))
 }
 
 copySASjsCore()

api/src/app.ts

@@ -10,7 +10,6 @@ import {
   copySASjsCore,
   getWebBuildFolderPath,
   loadAppStreamConfig,
-  sasJSCoreMacros,
   setProcessVariables
 } from './utils'
 
@@ -34,7 +33,7 @@ if (MODE?.trim() !== 'server' || CORS?.trim() === 'enable') {
 
 app.use(cookieParser())
 app.use(morgan('tiny'))
-app.use(express.json({ limit: '50mb' }))
+app.use(express.json({ limit: '100mb' }))
 app.use(express.static(path.join(__dirname, '../public')))
 
 const onError: ErrorRequestHandler = (err, req, res, next) => {
@@ -56,8 +55,6 @@ export default setProcessVariables().then(async () => {
   // index.html needs to be injected with some js script.
   app.use(express.static(getWebBuildFolderPath()))
 
-  console.log('sasJSCoreMacros', sasJSCoreMacros)
-
   app.use(onError)
 
   await connectDB()

api/src/controllers/drive.ts

@@ -108,20 +108,14 @@ export class DriveController {
   }
 
   /**
-   * It's optional to either provide `_filePath` in url as query parameter
-   * Or provide `filePath` in body as form field.
-   * But it's required to provide else API will respond with Bad Request.
    *
    * @summary Delete file from SASjs Drive
    * @query _filePath Location of SAS program
    * @example _filePath "/Public/somefolder/some.file"
    */
   @Delete('/file')
-  public async deleteFile(
+  public async deleteFile(@Query() _filePath: string) {
-    @Query() _filePath?: string,
+    return deleteFile(_filePath)
-    @FormField() filePath?: string
-  ) {
-    return deleteFile((_filePath ?? filePath)!)
   }
 
   /**
@@ -305,9 +299,3 @@ const updateFile = async (
 
   return { status: 'success' }
 }
-
-const validateFilePath = async (filePath: string) => {
-  if (!(await fileExists(filePath))) {
-    throw 'DriveController: File does not exists.'
-  }
-}

api/src/controllers/internal/Execution.ts

@@ -8,7 +8,7 @@ import {
   moveFile,
   readFileBinary
 } from '@sasjs/utils'
-import { PreProgramVars, TreeNode } from '../../types'
+import { PreProgramVars, Session, TreeNode } from '../../types'
 import {
   extractHeaders,
   generateFileUploadSasCode,
@@ -39,7 +39,8 @@ export class ExecutionController {
     preProgramVariables: PreProgramVars,
     vars: ExecutionVars,
     otherArgs?: any,
-    returnJson?: boolean
+    returnJson?: boolean,
+    session?: Session
   ) {
     if (!(await fileExists(programPath)))
       throw 'ExecutionController: SAS file does not exist.'
@@ -51,7 +52,8 @@ export class ExecutionController {
       preProgramVariables,
       vars,
       otherArgs,
-      returnJson
+      returnJson,
+      session
     )
   }
 
@@ -60,11 +62,13 @@ export class ExecutionController {
     preProgramVariables: PreProgramVars,
     vars: ExecutionVars,
     otherArgs?: any,
-    returnJson?: boolean
+    returnJson?: boolean,
+    sessionByFileUpload?: Session
   ): Promise<ExecuteReturnRaw | ExecuteReturnJson> {
     const sessionController = getSessionController()
 
-    const session = await sessionController.getSession()
+    const session =
+      sessionByFileUpload ?? (await sessionController.getSession())
     session.inUse = true
     session.consumed = true
 

api/src/controllers/internal/FileUploadController.ts

@@ -23,7 +23,9 @@ export class FileUploadController {
 
     const sessionController = getSessionController()
     session = await sessionController.getSession()
-    session.inUse = true
+    // marking consumed true, so that it's not available
+    // as readySession for any other request
+    session.consumed = true
 
     req.sasSession = session
 

api/src/controllers/internal/Session.ts

@@ -31,7 +31,7 @@ export class SessionController {
       ? readySessions[0]
       : await this.createSession()
 
-    if (readySessions.length < 2) this.createSession()
+    if (readySessions.length < 3) this.createSession()
 
     return session
   }
@@ -87,6 +87,8 @@ ${autoExecContent}`
       codePath,
       '-LOG',
       path.join(session.path, 'log.log'),
+      '-PRINT',
+      path.join(session.path, 'output.lst'),
       '-WORK',
       session.path,
       '-AUTOEXEC',

api/src/controllers/internal/deploy.ts

@@ -1,11 +1,17 @@
 import path from 'path'
-import { MemberType, FolderMember, ServiceMember, FileTree } from '../../types'
+import {
+  MemberType,
+  FolderMember,
+  ServiceMember,
+  FileTree,
+  FileMember
+} from '../../types'
 import { getTmpFilesFolderPath } from '../../utils/file'
 import { createFolder, createFile, asyncForEach } from '@sasjs/utils'
 
 // REFACTOR: export FileTreeCpntroller
 export const createFileTree = async (
-  members: (FolderMember | ServiceMember)[],
+  members: (FolderMember | ServiceMember | FileMember)[],
   parentFolders: string[] = []
 ) => {
   const destinationPath = path.join(
@@ -13,29 +19,32 @@ export const createFileTree = async (
     path.join(...parentFolders)
   )
 
-  await asyncForEach(members, async (member: FolderMember | ServiceMember) => {
+  await asyncForEach(
-    let name = member.name
+    members,
+    async (member: FolderMember | ServiceMember | FileMember) => {
+      let name = member.name
 
-    if (member.type === MemberType.service) name += '.sas'
+      if (member.type === MemberType.service) name += '.sas'
 
-    if (member.type === MemberType.folder) {
+      if (member.type === MemberType.folder) {
-      await createFolder(path.join(destinationPath, name)).catch((err) =>
+        await createFolder(path.join(destinationPath, name)).catch((err) =>
-        Promise.reject({ error: err, failedToCreate: name })
+          Promise.reject({ error: err, failedToCreate: name })
-      )
+        )
 
-      await createFileTree(member.members, [...parentFolders, name]).catch(
+        await createFileTree(member.members, [...parentFolders, name]).catch(
-        (err) => Promise.reject({ error: err, failedToCreate: name })
+          (err) => Promise.reject({ error: err, failedToCreate: name })
-      )
+        )
-    } else {
+      } else {
-      const encoding = member.type === MemberType.file ? 'base64' : undefined
+        const encoding = member.type === MemberType.file ? 'base64' : undefined
 
-      await createFile(
+        await createFile(
-        path.join(destinationPath, name),
+          path.join(destinationPath, name),
-        member.code,
+          member.code,
-        encoding
+          encoding
-      ).catch((err) => Promise.reject({ error: err, failedToCreate: name }))
+        ).catch((err) => Promise.reject({ error: err, failedToCreate: name }))
+      }
     }
-  })
+  )
 
   return Promise.resolve()
 }

api/src/controllers/stp.ts

@@ -143,9 +143,8 @@ const executeReturnRaw = async (
         query
       )) as ExecuteReturnRaw
 
-    // Should over-ride response header for
+    // Should over-ride response header for debug
-    // debug on GET request to see entire log
+    // on GET request to see entire log rendering on browser.
-    // rendering on browser.
     if (isDebugOn(query)) {
       httpHeaders['content-type'] = 'text/plain'
     }
@@ -185,7 +184,8 @@ const executeReturnJson = async (
         getPreProgramVariables(req),
         { ...req.query, ...req.body },
         { filesNamesMap: filesNamesMap },
-        true
+        true,
+        req.sasSession
       )) as ExecuteReturnJson
 
     let weboutRes: string | IRecordOfAny = webout

api/src/routes/api/drive.ts

@@ -57,12 +57,11 @@ driveRouter.get('/file', async (req, res) => {
 
 driveRouter.delete('/file', async (req, res) => {
   const { error: errQ, value: query } = fileParamValidation(req.query)
-  const { error: errB, value: body } = fileBodyValidation(req.body)
 
-  if (errQ && errB) return res.status(400).send(errQ.details[0].message)
+  if (errQ) return res.status(400).send(errQ.details[0].message)
 
   try {
-    const response = await controller.deleteFile(query._filePath, body.filePath)
+    const response = await controller.deleteFile(query._filePath)
     res.send(response)
   } catch (err: any) {
     res.status(403).send(err.toString())

api/src/routes/appStream/appStreamHtml.ts

@@ -14,12 +14,12 @@ const style = `<style>
   width: 150px;
   margin: 10px;
   overflow: hidden;
-  border-radius: 10px 10px 0 0;
   text-align: center;
 }
 .app-container .app img{
   width: 100%;
   margin-bottom: 10px;
+  border-radius: 10px;
 }
 </style>`
 
@@ -31,7 +31,10 @@ const singleAppStreamHtml = (
   logo?: string
 ) =>
   ` <a class="app" href="${streamServiceName}" title="${appLoc}">
-      <img src="${logo ? streamServiceName + '/' + logo : defaultAppLogo}" />
+      <img
+        src="${logo ? streamServiceName + '/' + logo : defaultAppLogo}"
+        onerror="this.src = '${defaultAppLogo}';"
+      />
       ${streamServiceName}
     </a>`
 

api/src/routes/appStream/index.ts

@@ -40,17 +40,6 @@ export const publishAppStream = async (
 
     if (!streamServiceName) {
       streamServiceName = `AppStreamName${appCount + 1}`
-    } else {
-      const alreadyDeployed = process.appStreamConfig[streamServiceName]
-      if (alreadyDeployed) {
-        if (alreadyDeployed.appLoc === appLoc) {
-          // redeploying to same streamServiceName
-        } else {
-          // trying to deploy to another existing streamServiceName
-          // assign new streamServiceName
-          streamServiceName = `${streamServiceName}-${appCount + 1}`
-        }
-      }
     }
 
     router.use(`/${streamServiceName}`, express.static(pathToDeployment))

api/src/types/FileTree.ts

@@ -1,23 +1,28 @@
-export interface FileTree {
+export enum MemberType {
-  members: (FolderMember | ServiceMember)[]
+  service = 'service',
+  file = 'file',
+  folder = 'folder'
 }
 
-export enum MemberType {
+export interface ServiceMember {
-  folder = 'folder',
+  name: string
-  service = 'service',
+  type: MemberType.service
-  file = 'file'
+  code: string
+}
+
+export interface FileMember {
+  name: string
+  type: MemberType.file
+  code: string
 }
 
 export interface FolderMember {
   name: string
   type: MemberType.folder
-  members: (FolderMember | ServiceMember)[]
+  members: (FolderMember | ServiceMember | FileMember)[]
 }
-
+export interface FileTree {
-export interface ServiceMember {
+  members: (FolderMember | ServiceMember | FileMember)[]
-  name: string
-  type: MemberType.service | MemberType.file
-  code: string
 }
 
 export const isFileTree = (arg: any): arg is FileTree =>
@@ -25,11 +30,25 @@ export const isFileTree = (arg: any): arg is FileTree =>
   arg.members &&
   Array.isArray(arg.members) &&
   arg.members.filter(
-    (member: FolderMember | ServiceMember) =>
+    (member: ServiceMember | FileMember | FolderMember) =>
-      !isFolderMember(member) && !isServiceMember(member)
+      !isServiceMember(member, '-') &&
+      !isFileMember(member, '-') &&
+      !isFolderMember(member, '-')
   ).length === 0
 
-const isFolderMember = (arg: any): arg is FolderMember =>
+const isServiceMember = (arg: any, pre: string): arg is ServiceMember =>
+  arg &&
+  typeof arg.name === 'string' &&
+  arg.type === MemberType.service &&
+  typeof arg.code === 'string'
+
+const isFileMember = (arg: any, pre: string): arg is ServiceMember =>
+  arg &&
+  typeof arg.name === 'string' &&
+  arg.type === MemberType.file &&
+  typeof arg.code === 'string'
+
+const isFolderMember = (arg: any, pre: string): arg is FolderMember =>
   arg &&
   typeof arg.name === 'string' &&
   arg.type === MemberType.folder &&
@@ -37,21 +56,7 @@ const isFolderMember = (arg: any): arg is FolderMember =>
   Array.isArray(arg.members) &&
   arg.members.filter(
     (member: FolderMember | ServiceMember) =>
-      !isFolderMember(member) &&
+      !isServiceMember(member, pre + '-') &&
-      !isServiceMember(member) &&
+      !isFileMember(member, pre + '-') &&
-      !isFileMember(member)
+      !isFolderMember(member, pre + '-')
   ).length === 0
-
-const isServiceMember = (arg: any): arg is ServiceMember =>
-  arg &&
-  typeof arg.name === 'string' &&
-  arg.type === MemberType.service &&
-  arg.code &&
-  typeof arg.code === 'string'
-
-const isFileMember = (arg: any): arg is ServiceMember =>
-  arg &&
-  typeof arg.name === 'string' &&
-  arg.type === MemberType.file &&
-  arg.code &&
-  typeof arg.code === 'string'

api/src/utils/appStreamConfig.ts

@@ -5,6 +5,8 @@ import { AppStreamConfig } from '../types'
 import { getTmpAppStreamConfigPath } from './file'
 
 export const loadAppStreamConfig = async () => {
+  if (process.env.NODE_ENV === 'test') return
+
   const appStreamConfigPath = getTmpAppStreamConfigPath()
 
   const content = (await fileExists(appStreamConfigPath))

api/src/utils/copySASjsCore.ts

@@ -1,8 +1,34 @@
-import { copy } from '@sasjs/utils'
+import path from 'path'
+import {
+  asyncForEach,
+  createFile,
+  createFolder,
+  deleteFolder,
+  readFile
+} from '@sasjs/utils'
 
-import { getTmpMacrosPath, sasJSCoreMacros } from '.'
+import { getTmpMacrosPath, sasJSCoreMacros, sasJSCoreMacrosInfo } from '.'
 
 export const copySASjsCore = async () => {
+  if (process.env.NODE_ENV === 'test') return
+
+  console.log('Copying Macros from container to drive(tmp).')
+
   const macrosDrivePath = getTmpMacrosPath()
-  await copy(sasJSCoreMacros, macrosDrivePath)
+
+  await deleteFolder(macrosDrivePath)
+  await createFolder(macrosDrivePath)
+
+  const macros = await readFile(sasJSCoreMacrosInfo)
+
+  await asyncForEach(macros.split('\n'), async (macroName) => {
+    const macroFileSourcePath = path.join(sasJSCoreMacros, macroName)
+    const macroContent = await readFile(macroFileSourcePath)
+
+    const macroFileDestPath = path.join(macrosDrivePath, macroName)
+
+    await createFile(macroFileDestPath, macroContent)
+  })
+
+  console.log('Macros Drive Path:', macrosDrivePath)
 }

api/src/utils/file.ts

@@ -9,6 +9,7 @@ export const sysInitCompiledPath = path.join(
 )
 
 export const sasJSCoreMacros = path.join(apiRoot, 'sasjscore')
+export const sasJSCoreMacrosInfo = path.join(apiRoot, 'sasjscore', '.macrolist')
 
 export const getWebBuildFolderPath = () =>
   path.join(codebaseRoot, 'web', 'build')

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "server",
-  "version": "0.0.38",
+  "version": "0.0.45",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "server",
-      "version": "0.0.38",
+      "version": "0.0.45",
       "devDependencies": {
         "prettier": "^2.3.1",
         "standard-version": "^9.3.2"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "server",
-  "version": "0.0.38",
+  "version": "0.0.45",
   "description": "NodeJS wrapper for calling the SAS binary executable",
   "repository": "https://github.com/sasjs/server",
   "scripts": {

web/src/containers/Studio/index.tsx

@@ -54,11 +54,11 @@ const Studio = () => {
 
         let weboutString: string
         try {
-          weboutString = res.data.webout
+          weboutString = res.data._webout
             .split('>>weboutBEGIN<<')[1]
             .split('>>weboutEND<<')[0]
         } catch (_) {
-          weboutString = res?.data?.webout ?? ''
+          weboutString = res?.data?._webout ?? ''
         }
 
         let webout: string
@@ -70,6 +70,9 @@ const Studio = () => {
 
         setWebout(`<pre><code>${webout}</code></pre>`)
         setTab('2')
+
+        // Scroll to bottom of log
+        window.scrollTo(0, document.body.scrollHeight)
       })
       .catch((err) => console.log(err))
   }