feat: linux support (#513)

Co-authored-by: Cristiano Ventura <mrk.cristiano@gmail.com>
Co-authored-by: Uladzimir Dzmitračkoŭ <3773351+going-confetti@users.noreply.github.com>

Author: 3 people

.github/workflows/release.yml

@@ -10,9 +10,11 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        # linux disabled until we get to work to support it
-        #platform: [macos-latest, ubuntu-20.04, windows-latest]
-        platform: [macos-latest, windows-latest]
+        # There is a bug on Ubuntu 22.04 (ubuntu-latest) regarding stripping a binary for a different
+        # architecture. Since we include both x86_64 and arm64 in linux a solution is to use ubuntu 20.04
+        # https://github.com/electron/forge/issues/3102
+        # https://github.com/electron/forge/issues/3701
+        platform: [macos-latest, windows-latest, ubuntu-20.04]
 
     runs-on: ${{ matrix.platform }}
     steps:
@@ -91,6 +93,22 @@ jobs:
           SENTRY_PROJECT: ${{ vars.SENTRY_PROJECT }}
         run: npm run publish
 
+      - name: publish Linux
+        if: startsWith(matrix.platform, 'ubuntu-')
+        env:
+          NODE_OPTIONS: '--max_old_space_size=8192'
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          # sentry integration
+          SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
+          # sentry vite plugin integration during build
+          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
+          SENTRY_ORG: ${{ vars.SENTRY_ORG }}
+          SENTRY_PROJECT: ${{ vars.SENTRY_PROJECT }}
+        run: |
+          sudo apt install -y rpm
+          npm run publish
+          npm run publish -- --arch=arm64
+
       - name: cleanup macos certificates
         if: startsWith(matrix.platform, 'macos-')
         run: |

forge.config.ts

@@ -16,13 +16,17 @@ function getPlatformSpecificResources() {
   // Otherwise the x86_64 build will still be having the resources/arm64 only binaries
   if (getPlatform() === 'mac') {
     return ['./resources/mac/arm64', './resources/mac/x86_64']
+  } else if (getPlatform() === 'linux') {
+    return ['./resources/linux/arm64', './resources/linux/x86_64']
   }
 
   return [path.join('./resources/', getPlatform(), getArch())]
 }
 
 const config: ForgeConfig = {
   packagerConfig: {
+    name: 'Grafana k6 Studio',
+    executableName: 'k6-studio',
     icon: './resources/icons/logo',
     asar: true,
     extraResource: [
@@ -64,9 +68,8 @@ const config: ForgeConfig = {
       },
       ['darwin']
     ),
-    new MakerRpm({}),
-    new MakerRpm({}),
-    new MakerDeb({ options: { icon: './src/assets/icons/logo.png' } }),
+    new MakerRpm({ options: { icon: './resources/icons/logo.png' } }),
+    new MakerDeb({ options: { icon: './resources/icons/logo.png' } }),
   ],
   plugins: [
     new VitePlugin({

install-k6.js

@@ -5,6 +5,8 @@ const K6_VERSION = 'v0.55.0'
 const K6_PATH_MAC_AMD = `k6-${K6_VERSION}-macos-amd64`
 const K6_PATH_MAC_ARM = `k6-${K6_VERSION}-macos-arm64`
 const K6_PATH_WIN_AMD = `k6-${K6_VERSION}-windows-amd64`
+const K6_PATH_LINUX_AMD = `k6-${K6_VERSION}-linux-amd64`
+const K6_PATH_LINUX_ARM = `k6-${K6_VERSION}-linux-arm64`
 
 const getMacOSK6Binary = () => {
   const command = `
@@ -52,6 +54,32 @@ Remove-Item -Path "${K6_PATH_WIN_AMD}" -Recurse
   execSync(command, { shell: 'powershell.exe' })
 }
 
+const getLinuxK6Binary = () => {
+  const command = `
+# download binaries
+curl -LO https://github.com/grafana/k6/releases/download/${K6_VERSION}/${K6_PATH_LINUX_AMD}.tar.gz
+curl -LO https://github.com/grafana/k6/releases/download/${K6_VERSION}/${K6_PATH_LINUX_ARM}.tar.gz
+
+# unzip & smoke test
+tar -zxf ${K6_PATH_LINUX_AMD}.tar.gz
+tar -zxf ${K6_PATH_LINUX_ARM}.tar.gz
+${K6_PATH_LINUX_AMD}/k6 version
+# ${K6_PATH_LINUX_ARM}/k6 version  ## if we move to separate images for architectures we could test this one as well
+
+# move to resource folder
+mv ${K6_PATH_LINUX_AMD}/k6 resources/linux/x86_64
+mv ${K6_PATH_LINUX_ARM}/k6 resources/linux/arm64
+
+# cleanup
+rm ${K6_PATH_LINUX_AMD}.tar.gz
+rm ${K6_PATH_LINUX_ARM}.tar.gz
+rmdir ${K6_PATH_LINUX_AMD}
+rmdir ${K6_PATH_LINUX_ARM}
+`
+
+  execSync(command)
+}
+
 switch (process.platform) {
   case 'darwin':
     // we check only for one arch since we include both binaries
@@ -70,6 +98,15 @@ switch (process.platform) {
       console.log('k6 binary download completed')
     }
     break
+  case 'linux':
+    // we check only for one arch since we include both binaries
+    if (!existsSync('resources/linux/x86_64/k6')) {
+      console.log('k6 binary not found')
+      console.log('downloading k6... this might take some time...')
+      getLinuxK6Binary()
+      console.log('k6 binary download completed')
+    }
+    break
   default:
     console.log(`unsupported platform found: ${process.platform}`)
 }

resources/linux/arm64/k6-studio-proxy

@@ -10,15 +10,23 @@ import { mkdtemp } from 'fs/promises'
 import path from 'path'
 import os from 'os'
 import { appSettings } from './main'
+import { exec, spawn } from 'child_process'
+import { getPlatform } from './utils/electron'
+import log from 'electron-log/main'
 
 const createUserDataDir = async () => {
   return mkdtemp(path.join(os.tmpdir(), 'k6-studio-'))
 }
 
-export function getBrowserPath() {
+export async function getBrowserPath() {
   const { recorder } = appSettings
 
   if (recorder.detectBrowserPath) {
+    if (getPlatform() === 'linux' && process.arch === 'arm64') {
+      // Chrome is not available for arm64, use Chromium instead
+      return await getChromiumPath()
+    }
+
     return computeSystemExecutablePath({
       browser: Browser.CHROME,
       channel: ChromeReleaseChannel.STABLE,
@@ -32,7 +40,7 @@ export const launchBrowser = async (
   browserWindow: BrowserWindow,
   url?: string
 ) => {
-  const path = getBrowserPath()
+  const path = await getBrowserPath()
   console.info(`browser path: ${path}`)
 
   const userDataDir = await createUserDataDir()
@@ -54,24 +62,51 @@ export const launchBrowser = async (
     return Promise.resolve()
   }
 
+  const args = [
+    '--new',
+    '--args',
+    `--user-data-dir=${userDataDir}`,
+    '--hide-crash-restore-bubble',
+    '--test-type',
+    '--no-default-browser-check',
+    '--no-first-run',
+    '--disable-background-networking',
+    '--disable-component-update',
+    '--disable-search-engine-choice-screen',
+    `--proxy-server=http://localhost:${appSettings.proxy.port}`,
+    `--ignore-certificate-errors-spki-list=${certificateSPKI}`,
+    disableChromeOptimizations,
+    url?.trim() || 'about:blank',
+  ]
+
+  // if we are on linux we spawn the browser directly and attach the on exit callback
+  if (getPlatform() === 'linux') {
+    const browserProc = spawn(path, args)
+    browserProc.once('exit', sendBrowserClosedEvent)
+    return browserProc
+  }
+
+  // macOS & windows
   return launch({
     executablePath: path,
-    args: [
-      '--new',
-      '--args',
-      `--user-data-dir=${userDataDir}`,
-      '--hide-crash-restore-bubble',
-      '--test-type',
-      '--no-default-browser-check',
-      '--no-first-run',
-      '--disable-background-networking',
-      '--disable-component-update',
-      '--disable-search-engine-choice-screen',
-      `--proxy-server=http://localhost:${appSettings.proxy.port}`,
-      `--ignore-certificate-errors-spki-list=${certificateSPKI}`,
-      disableChromeOptimizations,
-      url?.trim() || 'about:blank',
-    ],
+    args: args,
     onExit: sendBrowserClosedEvent,
   })
 }
+
+function getChromiumPath(): Promise<string> {
+  return new Promise((resolve, reject) => {
+    exec('which chromium', (error, stdout, stderr) => {
+      if (error) {
+        log.error(error)
+        return reject(error)
+      }
+      if (stderr) {
+        log.error(stderr)
+        return reject(stderr)
+      }
+
+      return resolve(stdout.trim())
+    })
+  })
+}

src/browser.ts

@@ -4,6 +4,7 @@ import path from 'node:path'
 import { FSWatcher, watch } from 'chokidar'
 import { BrowserWindow } from 'electron'
 import fs from 'fs/promises'
+import { getPlatform } from './utils/electron'
 
 let watcher: FSWatcher
 
@@ -34,8 +35,9 @@ export function openLogFolder() {
   const logFile = log.transports.file.getFile().path
   const logPath = path.dirname(logFile)
 
-  // supports only Mac and Windows at this time
-  const executable = process.platform === 'darwin' ? 'open' : 'explorer'
+  const executable = ['mac', 'linux'].includes(getPlatform())
+    ? 'open'
+    : 'explorer'
   spawn(executable, [logPath])
 }
 

src/logger.ts

@@ -66,6 +66,7 @@ import { DataFilePreview } from './types/testData'
 import { parseDataFile } from './utils/dataFile'
 import { createNewGeneratorFile } from './utils/generator'
 import { GeneratorFileDataSchema } from './schemas/generator'
+import { ChildProcessWithoutNullStreams } from 'child_process'
 import { COPYFILE_EXCL } from 'constants'
 
 if (process.env.NODE_ENV !== 'development') {
@@ -102,7 +103,7 @@ let currentClientRoute = '/'
 let wasAppClosedByClient = false
 export let appSettings = defaultSettings
 
-let currentBrowserProcess: Process | null
+let currentBrowserProcess: Process | ChildProcessWithoutNullStreams | null
 let currentk6Process: K6Process | null
 let watcher: FSWatcher
 let splashscreenWindow: BrowserWindow
@@ -318,8 +319,16 @@ ipcMain.handle('browser:start', async (event, url?: string) => {
 
 ipcMain.on('browser:stop', async () => {
   console.info('browser:stop event received')
+
   if (currentBrowserProcess) {
-    await currentBrowserProcess.close()
+    // macOS & windows
+    if ('close' in currentBrowserProcess) {
+      await currentBrowserProcess.close()
+      // linux
+    } else {
+      currentBrowserProcess.kill()
+    }
+
     currentBrowserProcess = null
   }
 })
@@ -510,9 +519,9 @@ ipcMain.on('ui:toggle-theme', () => {
   nativeTheme.themeSource = nativeTheme.shouldUseDarkColors ? 'light' : 'dark'
 })
 
-ipcMain.handle('ui:detect-browser', () => {
+ipcMain.handle('ui:detect-browser', async () => {
   try {
-    const browserPath = getBrowserPath()
+    const browserPath = await getBrowserPath()
     return browserPath !== ''
   } catch {
     log.error('Failed to find browser executable')

src/main.ts

@@ -125,7 +125,7 @@ export const getCertificatesPath = () => {
   if (MAIN_WINDOW_VITE_DEV_SERVER_URL) {
     return path.join(app.getAppPath(), 'resources', 'certificates')
   } else {
-    return path.join(process.resourcesPath, 'certificates')
+    return path.join(app.getPath('userData'), 'certificates')
   }
 }
 

src/proxy.ts

@@ -6,6 +6,7 @@ import { AppSettingsSchema } from './schemas/settings'
 import { existsSync, readFileSync } from 'fs'
 import { safeJsonParse } from './utils/json'
 import log from 'electron-log/main'
+import { getPlatform } from './utils/electron'
 
 export const defaultSettings: AppSettings = {
   version: '3.0',
@@ -123,11 +124,16 @@ function isSettingsJsonObject() {
 }
 
 export async function selectBrowserExecutable() {
-  const extensions = process.platform === 'darwin' ? ['app'] : ['exe']
+  const extensions = {
+    mac: ['app'],
+    win: ['exe'],
+    linux: ['*'],
+  }
+
   return dialog.showOpenDialog({
     title: 'Select browser executable',
     properties: ['openFile'],
-    filters: [{ name: 'Executables', extensions }],
+    filters: [{ name: 'Executables', extensions: extensions[getPlatform()] }],
   })
 }