Syntax highlighting not working for <script> and <style> tags on GitHub (web and mobile) #20
Description
The syntax highlighting is not working on GitHub, both web and mobile, for the <script> and <style> sections of .svelte files. The template section seems to be unaffected and is still working (including svelte-specific tags, like {#each}) as long as you aren't using <template> tags (I didn't know this until opening this Issue and making the examples below).
Opening this Issue here because this repo is what linguist is pointing to for svelte syntax highlighting in GitHub. A handful of Issues have been opened in the related repos (GitHub's community and linguist) and I even sent a bug ticket to GitHub mobile through the app, but they all seem to suggest it might be a bug in the actual grammar. This lines up with my observations, as I only noticed this behavior after this github-linguist/linguist#5963 was merged.
This is the most recent reply from linguist: github-linguist/linguist#5830 (comment)
I don't know anything about syntax highlighting grammars, so I can't suggest any ideas. And I'm not even sure if you were aware that linguist is now using this repo for GitHub -- in which case I'd be fine with closing the issue as wontfix and maybe trying to revert the PR in linguist.
EXAMPLES:
(First two are just using markdown codeblocks with ```svelte, the rest are images -- first two are web on Chrome, third is mobile on iOS)
Without <template> tag:
<script>
const notWorking = 'I am not highlighted';
</script>
{#each something as s}
<p on:click={doSomething}>
Our tags are highlighted correctly
</p>
{/each}
<style>
.not-highlighted {
color: 'black'; // because it isn't highlighted
}
</style>With <template> tag:
<script>
const notWorking = 'I am not highlighted';
</script>
<template>
{#each something as s}
<p on:click={doSomething}>
Now we aren't working.
</p>
{/each}
</template>
<style>
.not-highlighted {
color: 'black'; // because it isn't highlighted
}
</style>
Related issues: