Developing

Contributing

We welcome contributions for bug fixes and even new features to this extension. However, we'd like to discuss it first in an issue with you, to see if your idea aligns with our approach and what we have in mind. Sometimes fixes also need to be made upstream at Manim.

Furthermore, note that we are just a small team, so don't expect fast response times. We're doing this in our free time and don't get paid for this.

1. Fork the repository and clone this fork
2. Create a new branch: git checkout -b feature/your-feature-name
3. Make your changes (see the installation guide down below)
4. Commit your changes: git commit -m "Add your commit message"
5. Push to the branch on your fork: git push origin feature/your-feature-name
6. Open a Pull Request

If you've followed the installation guide down below, linting should also work for you. Aditionally, ESLint will run over your submitted code in a PR. We will only review code if there are no linting errors.

🎈 Installation

If you want to work on the code of the Manim Notebook extension, follow these steps:

• Fork the repo via the GitHub UI, then clone it via git. Make sure to keep your fork up to date with our main branch.
• Recommended: Set up a GPG key to sign your commits (Generate one and tell Git about it).
• Install npm dependencies: npm install.
• Install recommended VSCode extensions.

Then to preview the extension, see the VSCode Getting started docs.

• Open any file of Manim Notebook, e.g. extension.ts.
• Press F5 to build and run. A new VSCode window should open. (or: Ctrl/Cmd + Shift + d -> Run Extension)
• After you make more changes, you have to reload the extension window (VSCode does not yet offer a hot reload mechanism here): Ctrl/Cmd + Shift + p -> Reload Window

Linting

In VSCode, linting of .ts files should work out of the box if you followed the above installation guide.
In particular, you should have run npm install and installed our recommended VSCode extensions (which includes the eslint extension).
In the CI/CD pipeline (GitHub Actions), we run npx eslint --config ./.config/eslint.mjs with some further options, see .github/workflows/linter.yml.

❇️ Testing

• Tests run through as GitHub Actions on every PR.
• Locally, you will probably want to debug a failing test. Replace it() by it.only() for your desired test (e.g. the failing one), then use our preconfigured launch config: Ctrl/Cmd + Shift + d -> Test Extension. This will open a new VSCode instance where the tests is run through. Tests have access to the usual VSCode API. See the output of the test in the host window under the Debug Console.
• We haven't yet found a way to integrate our setup with the VSCode extension test runner since it has some shortcomings compared to a custom runner setup inspired by the VSCode testing guide.

Tip to speed up your testing workflow: the moment you ran the tests via the debug configuration at least once, go to .vscode/launch.json and comment out the preLaunchTask. This pre-launch task will install Manim and indeed skips this installation if it detects that it is already set up. However, even this detection still takes some time, so you might want to disable the installation entirely.

🎁 Publish to the Marketplace

See the respective VSCode extension publishing guide. In summary,

• Bump the version in package.json
• vsce package
• vsce publish (you might have to install the VSCode Extension Manager CLI via npm install -g vsce)

Or also see Auto-increment the extension version, e.g. using vsce publish minor or vsce publish 1.1.0 etc.

You can also manually package the extension, although you will probably not need this workflow:

• Bump the version in package.json
• vsce package (select y; a .vsix file will be created)

You can then install the extension from this package file:

• Ctrl/Cmd + Shift + p -> Extensions: Install from VSIX > select the .vsix file
• Reload window