Browse the docs

Kits inside Electron apps

Run a kit's styles, features and commands inside Slack, VS Code, Notion or any other Electron app by opening the app through Switchboard.

Slack, VS Code, Notion, Discord and many others are Electron apps: a web page in a window. A kit can run inside one the way it runs on a website: its styles restyle the app, its features add controls, and it reads the app's own network responses. The kit is an ordinary Site Kit whose kit.json says "electron": true.

Opening the app #

An Electron app only accepts a kit when it was started by Switchboard. When you turn the kit on, Switchboard asks to quit the app and open it again with a private DevTools connection. The connection is a pipe between Switchboard's engine and the app: no network port is opened, so nothing else on your Mac can join it.

  • If the app was running, it quits first and comes back without your open windows' unsaved state, so save your work.

  • Launch at login through Switchboard starts the app that way every time you log in, when it isn't already running.

  • If the engine stops, apps opened this way stop too: the pipe closing is how an Electron app learns it has been let go.

  • Turn off the kit for this app closes the connection and opens the app again the ordinary way, with nothing of the kit in it.

What the kit can do inside the app #

Everything a Site Kit does in a page, in the app's pages: styles/ are added to each page, features/ mount on routes and find places with anchors that are CSS selectors, kit.onResponse sees the app's responses, kit.store, settings and the commands work, and macros can call the kit. The kit's site block is optional here: without it the kit applies to every page the app shows.

Because the app has one JavaScript world, the kit always runs in it. The trust sheet says "Runs code inside Slack, which can read everything Slack shows": install kits you trust.

Steps, triggers and conditions #

browser: "app:com.tinyspeck.slackmacgap" aims a browser step, trigger or condition at that app's pages (app alone means any app opened this way). Each window of the app is a tab: browser.tabs list, browser.javaScript, browser.inject, the browser.page and browser.tab triggers and the browser.tab and browser.url conditions work.

Count Slack's unread channels
Do
  1. Run JavaScript in the front browser “return document.querySelectorAll('.p-ch…”
Open in Switchboard to try it

These don't work with an app connection and fail with "not available for an app connection": the page actions (browser.click, fill, extract, read, wait, scroll, highlight), picking, browser.screenshot, downloads, history, bookmarks, cookies and the tab operations that need a real browser (pin, mute, group, move, duplicate, dedupe). A kit's own features in the page do the same work.

When the app refuses #

Some apps ignore the flag: they strip their arguments, or end right after starting. If the app doesn't answer within five seconds Switchboard ends it, says "Slack can't be opened up" with the reason, and the kit keeps only what it can do from outside the app (pins, the drawer, readings).

Good to know #

  • A window the app opens after you started it gets the kit a moment after it loads.

  • The first time you open an app this way, macOS may ask again for permissions the app already had (the camera, the microphone): they belong to the app, not to Switchboard.

  • Kits are opened per app: two kits for Slack share the one connection.