Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Added section in Monarch docs for Inspect Tokens development helper #1807

Merged
merged 2 commits into from Feb 4, 2020
Merged

Added section in Monarch docs for Inspect Tokens development helper #1807

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
32926a3
Added section in Monarch docs for Inspect Tokens development helper
Feb 4, 2020
cf927a9
Updated h2 id
Feb 4, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
11 changes: 11 additions & 0 deletions website/monarch.html
View file
Open in desktop
Expand Up @@ -383,6 +383,17 @@ <h2 id="htmlembed">&Uuml;ber Advanced: complex embeddings with dynamic end tags<
],</pre>
<p>Only when we find a matching end tag (outside a string), <code>$1==$S2</code>, we pop the state and exit the embedded mode. Note that we need <a href="#@rematch"><code class="dt">@rematch</code></a> since the editor is ignoring our token classes until we actually exit the embedded mode (and we handle the close tag again in the <code>@root</code> state).</p>

<p>&nbsp;</p>
<h2 id="inspectingtokens">Inspecting Tokens</h2>

<p>Monaco provides an <code>Inspect Tokens</code> tool in browsers to help identify the tokens parsed from source code.</p>
<p>To activate:</p>
<ol>
<li>Press <kbd>F1</kbd> while focused on a Monaco instance</li>
<li>Trigger the <code>Developer: Inspect Tokens</code> option</li>
</ol>

<p>This will show a display over the currently selected token for its language, token type, basic font style and colors, and selector you can target in your editor themes.</p>
</div> <!-- documentation -->
</div> <!-- main -->

Expand Down