Timeline | Contributing to Visual Studio Code

Contributing to Visual Studio Code

Timeline

1-27-2018
Requested to work on issue# 42245
[BUG, CSS, Emmet] suggestion color if said "#" like "id"
1-28-2018
Recieved response regarding Requested to work on issue# 42245
Certain vscode members are assigned specific issues

VS Code Timeline Capture 1

1-28-2018
Requested to work on issue#41650
Support TOML frontmatter syntax highlighting in markdown files

Steps to Reproduce:

Add TOML Front Matter to a Markdown file
Observe that it doesn’t have syntax highlighting (in comparison to YAML Front Matter)

1-29-2018

VS Code Timeline Capture 2

Essentially we need to inject YAML code block syntax highlighting into Markdown files.

1-29-2018
Research

TOML (Tom’s Obvious, Minimal Language) – easy to read configuration file format

textmate – language grammar is used only to parse the document and assign names to subsets

better-toml– toml extension for vs code editor

Front Matter-allows you to keep metadata attached to an instance of a content type

1-29-2018
Many attempts later...

After a great deal of confusion trying to connect the dots between Hugo, TOML, Font Maker, language injection I decided to reach out for help.

VS Code Timeline Capture 3

1/30/2018
Different Approach

As I was waiting for a response from Matt and the Slack channel, I tried to isolate the problem as best as I could.
Instead of having to rebuild the full dev environment + extension, why not create a light weight test extension with just the features I needed to add.
I began reading up on how to create and manage a vs code extension.

1/31/2018
Progress!

After many failed attempts I was able to isolate TOML code block from a Markdown file.
The only issue now is trying to connect the code block to existing syntax highlighters.

2/2/2018
Who is this Tom guy anyways?

Still puzzled as to how I can reference TOML language support from another extension.
So far I’ve tried included the toml-language-support extension as a dependency to deference the scope name “source.toml” but still no luck.

2/08/2018
"Yo" got to be kidding me

After reading over VS code’s “Extension Authoring” documentation they had referenced a tool named “Yo Code”.
A tool that generates basic Visual Studio extension templates for themes, language support, snippets, TypeScript and JavaScipt extensions.
During this setup process, I was able to directly reference the toml.tmLanguage file from the “TOML Language Support” extension.

2/09/2018
I see the highlight!

After successfully being able to reference the “source.toml” scope name. I was finally able to detect TOML syntax within a Markdown file.

TOML Front Matter Codeblock in Markdown file

2/09/2018
Decided to stop with the puns...
2/10/2018
Created a demo repository

Uploaded a repository which includes a demo extension illustrating the new TOML Front Matter feature in a Markdown file.
vscode-fenced-toml

2/17/2018
Pull request merged!

Bungcip the creator of better-toml merged my PR into the latest release.
better-toml changelog

Add a comment...

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Categories