Undocumented Sketch Plugin API Reference

James Tang
MagicSketch Blog
Published in
3 min readOct 27, 2015

--

The Sketch Developer page has documented some APIs for Sketch plugins enough to get you started, but when you’re looking for more advanced stuffs, you’ll want to look at a complete list of API. The bad news is the Sketch team didn’t put one out there, but the good news is that you can generate it all by yourself.

There are as much as 1008 header files/classes are in Sketch 3.3.3, yet only 22 of them being documented in the Online Reference section

“So you mean reverse engineering?”

Yes thats right! And it’s not as hard as you might think. The only thing we needed is to download a simple tool and have a copy of the Sketch app, then you can get access to the full list of API. The Tools section also explicitly gave us some hint:

class-dump. We do our best to document everything, but if you are of the adventurous type, you’ll probably want to play with this.

Updated (2015–10–27) @abynim recently pushed a GitHub repository for Sketch Headers, including the latest Sketch 3.4 and back to 3.2. If you’re not interested on using class-dump, you can download the headers from the repository and then skip to the next section.

1. Generate the documentation

I’ll go through the process step by step:

  1. download class-dump (and make a donation ;D)
  2. have Sketch.app installed
  3. run this command in terminal:
./class-dump -H /Applications/Sketch.app/Contents/MacOS/Sketch -o ~/Desktop/Sketch/

You should find a folder named “Sketch” on your Desktop and all the header files will be nicely placed there.

2. Understanding the files

There you go! To explain a bit, each .h file represents an Objective-C header file, and each file contains a single class reference of the same name in the Sketch app. Now you can look into the classes and understand so much more about its hierarchy and available methods that may not have appeared in the official documentation. Here’s an example:

In the Magic Mirror plugin we will need to know the path of the shape. We noticed MSArtboardGroup is inherited from MSLayerGroup, and there’s an undocumented bezierPath property in the class, which turns out to be what we wanted.

One thing tho is we won’t have access to the actual details of the class implementation, and there’s no simple way to do it. Otherwise that’d be too easy for others to look into and copy sensitive code.

3. Pick your text editor

The problem now is how you can quickly find the reference file you needed in that many number of files.

There’re a few tools that will allow you to quickly navigate and search through all the text files easily. The one I used is mostly Sublime Text, there is also another popular choice called Atom, and both will serve us pretty well.

It’s Truly Valuable

The fact that Sketch uses CocoaScript and Mocha as the building blocks of plugin, we can almost have full access to every Objective-C classes that the development team implements.

Using class-dump to retrieve header files actually works on any OSX applications written in Objective-C, so keeping this in your tool chain will definitely be a very valuable skill.

If you like this article, you can read my other articles in the Sketch Plugin Development series.

Originally published at james.ooo on October 26, 2015.

--

--

James Tang
MagicSketch Blog

Sketch Plugins and iOS UX Engineer. Opensource projects contributor, share on Twitter. @jamztang