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.

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

Inject_embed: run-dartpad info string breaks syntax highlighting #1380

Closed
chalin opened this issue Nov 14, 2019 · 1 comment · Fixed by dart-lang/site-shared#205
Closed
Labels
inject-script P2 A bug or feature request we're likely to work on
Milestone

Comments

@chalin
Copy link

chalin commented Nov 14, 2019

From the Embedding Guide, Converting code blocks to DartPad section:

Step 2: Add a code snippet

In Markdown:

```run-dartpad:theme-light:mode-flutter:run-true
main() => print("Hello, World!");
```

Using an info string of run-dartpad rather than dart breaks syntax highlighting, both in the IDE and the generated site (users will get to see the original code block in cases where DartPad hasn't been injected yet, or hasn't been successfully injected). Users see this:

Instead of this:

Probably shouldn't happen that often, but still. /cc @kwalrath @legalcodes


It would be great if we could:

  • Leave the info string as dart, and
  • Have the option of triggering the injector by attaching classes to a parent element.

For example:

<div class="run-dartpad:theme-light:mode-flutter:run-true">
```dart
main() => print("Hello, World!");
```
</div>

Or using a Jekyll-specific syntax:

{:.run-dartpad:theme-light:mode-flutter:run-true}
```dart
main() => print("Hello, World!");
```

Jekyll renders this as:

<pre class="run-dartpad">
<code class="language-dart">main() => ...
</code></pre>
@RedBrogdon RedBrogdon added P2 A bug or feature request we're likely to work on inject-script labels Nov 22, 2019
@RedBrogdon RedBrogdon added this to the Backlog milestone Nov 22, 2019
@devmil
Copy link

devmil commented May 13, 2022

I know this issue is rather old but I also encountered this problem.
Here is how I was able to solve it for my system (highlight.js v 11.5.1)

```lang-dart:run-dartpad:theme-light:width-100%:height-500px:mode-inline
enum SomeEnum {
//...
}
 ```

Highlight.js picks up the lang-dart part and the DartPad injector is happy as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
inject-script P2 A bug or feature request we're likely to work on
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants