Skip to content

Commit

Permalink
chore: improve engine-js compare diff
Browse files Browse the repository at this point in the history
  • Loading branch information
@antfu
antfu committed Sep 12, 2024
1 parent 1fc7470 commit 149a729
Show file tree
Hide file tree
Showing 2 changed files with 124 additions and 90 deletions.
74 changes: 37 additions & 37 deletions docs/references/engine-js-compat.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -201,30 +201,30 @@ Languages that does not throw with the JavaScript RegExp engine, but will produc

| Language | Highlight Match | Patterns Parsable | Patterns Failed | Diff |
| ------------- | :--------------------------------------------------------------------------------- | ----------------: | --------------: | ---: |
| angular-html | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=angular-html) | 2 | - | 56 |
| bash | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=bash) | 146 | - | 79 |
| beancount | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=beancount) | 39 | - | 65 |
| c | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=c) | 158 | - | 162 |
| crystal | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=crystal) | 140 | - | 8 |
| elixir | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=elixir) | 102 | - | 138 |
| erlang | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=erlang) | 147 | - | 275 |
| glsl | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=glsl) | 7 | - | 295 |
| haml | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=haml) | 64 | - | 24 |
| kusto | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=kusto) | 60 | - | 4 |
| latex | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=latex) | 183 | - | 21 |
| mermaid | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=mermaid) | 129 | - | 4 |
| nginx | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=nginx) | 102 | - | 78 |
| objective-cpp | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=objective-cpp) | 297 | - | 96 |
| php | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=php) | 328 | - | 364 |
| po | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=po) | 23 | - | 198 |
| pug | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=pug) | 92 | - | 152 |
| rst | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=rst) | 61 | - | 42 |
| ruby | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=ruby) | 154 | - | 7 |
| shellscript | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=shellscript) | 146 | - | 79 |
| smalltalk | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=smalltalk) | 31 | - | 24 |
| splunk | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=splunk) | 17 | - | 20 |
| stata | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=stata) | 189 | - | 32 |
| zsh | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=zsh) | 146 | - | 107 |
| angular-html | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=angular-html) | 2 | - | 6 |
| bash | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=bash) | 146 | - | 13 |
| beancount | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=beancount) | 39 | - | 4 |
| c | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=c) | 158 | - | 35 |
| crystal | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=crystal) | 140 | - | 2 |
| elixir | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=elixir) | 102 | - | 43 |
| erlang | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=erlang) | 147 | - | 50 |
| glsl | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=glsl) | 7 | - | 74 |
| haml | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=haml) | 64 | - | 6 |
| kusto | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=kusto) | 60 | - | 1 |
| latex | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=latex) | 183 | - | 5 |
| mermaid | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=mermaid) | 129 | - | 2 |
| nginx | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=nginx) | 102 | - | 3 |
| objective-cpp | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=objective-cpp) | 297 | - | 22 |
| php | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=php) | 328 | - | 37 |
| po | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=po) | 23 | - | 11 |
| pug | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=pug) | 92 | - | 6 |
| rst | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=rst) | 61 | - | 4 |
| ruby | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=ruby) | 154 | - | 1 |
| shellscript | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=shellscript) | 146 | - | 13 |
| smalltalk | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=smalltalk) | 31 | - | 8 |
| splunk | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=splunk) | 17 | - | 4 |
| stata | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=stata) | 189 | - | 4 |
| zsh | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=zsh) | 146 | - | 26 |

## Unsupported Languages

Expand All @@ -233,18 +233,18 @@ Languages that throws with the JavaScript RegExp engine (contains syntaxes that
| Language | Highlight Match | Patterns Parsable | Patterns Failed | Diff |
| ---------- | :------------------------------------------------------------------------- | ----------------: | --------------: | ---: |
| ada | ✅ OK | 199 | 1 | |
| blade | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=blade) | 328 | 2 | 28 |
| mdc | ❌ Error | 27 | - | |
| blade | [🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=blade) | 328 | 2 | |
| mdc | ❌ Error | 27 | - | 22 |
| powershell | ❌ Error | 87 | 1 | |
| wolfram | ❌ Error | 500 | 1 | |
| razor | ❌ Error | 82 | 3 | |
| wolfram | ❌ Error | 500 | 1 | 2 |
| razor | ❌ Error | 82 | 3 | 7 |
| mdx | ❌ Error | 177 | 4 | |
| swift | ❌ Error | 302 | 4 | |
| julia | ❌ Error | 90 | 5 | |
| kotlin | ❌ Error | 52 | 6 | |
| purescript | ❌ Error | 66 | 6 | |
| markdown | ❌ Error | 96 | 7 | |
| apex | ❌ Error | 173 | 14 | |
| haskell | ❌ Error | 136 | 21 | |
| cpp | ❌ Error | 198 | 22 | |
| csharp | ❌ Error | 263 | 32 | |
| swift | ❌ Error | 302 | 4 | 4 |
| julia | ❌ Error | 90 | 5 | 5 |
| kotlin | ❌ Error | 52 | 6 | 81 |
| purescript | ❌ Error | 66 | 6 | 169 |
| markdown | ❌ Error | 96 | 7 | 41 |
| apex | ❌ Error | 173 | 14 | 44 |
| haskell | ❌ Error | 136 | 21 | 3 |
| cpp | ❌ Error | 198 | 22 | 5 |
| csharp | ❌ Error | 263 | 32 | 34 |
140 changes: 87 additions & 53 deletions scripts/report-engine-js-compat.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,19 @@
// - `pnpm run report-engine-js`

import type { Diff } from 'diff-match-patch-es'
import type { BundledLanguage, BundledTheme, HighlighterGeneric } from 'shiki'
import fs from 'node:fs/promises'
import process from 'node:process'
import { diffCleanupMerge, diffMain } from 'diff-match-patch-es'
import { diffCleanupSemantic, diffMain } from 'diff-match-patch-es'
import c from 'picocolors'
import { format } from 'prettier'
import { bundledLanguages, createHighlighter, createJavaScriptRegexEngine } from 'shiki'
import { version } from '../package.json'

const engine = createJavaScriptRegexEngine()
const engineForgiving = createJavaScriptRegexEngine({
forgiving: true,
})

export interface ReportItem {
lang: string
Expand Down Expand Up @@ -61,7 +65,7 @@ async function run() {
}
}

const highlightA = shikiWasm.codeToHtml(sample, { lang, theme: 'vitesse-dark' })
const highlightA = serializeTokens(shikiWasm, sample, lang)
let highlightB: string | undefined
let highlightDiff: Diff[] = []

Expand All @@ -72,60 +76,81 @@ async function run() {
engine,
})

highlightB = shiki.codeToHtml(sample, { lang, theme: 'vitesse-dark' })

highlightMatch = highlightA === highlightB
highlightDiff = diffMain(highlightA, highlightB)
diffCleanupMerge(highlightDiff)

if (!highlightMatch) {
console.log(c.yellow(`[${lang}] Mismatch`))

await fs.mkdir(new URL('./compares', import.meta.url), { recursive: true })

await fs.writeFile(
new URL(`./compares/${lang}.html`, import.meta.url),
[
'<style>',
'body { display: flex; }',
'pre { flex: 1; margin: 0; padding: 0; }',
'</style>',
'<pre>',
highlightA,
'</pre>',
'<pre>',
highlightB,
'</pre>',
].join('\n'),
'utf-8',
)
}
else {
console.log(c.green(`[${lang}] OK`))
}
highlightB = serializeTokens(shiki, sample, lang)
}
catch (e: any) {
highlightMatch = 'error'
console.log(c.red(`[${lang}] Error ${e} ${e.cause || ''}`))
}
finally {
report.push({
lang,
highlightMatch,
patternsParsable: parsablePatterns.length,
patternsFailed: unparsablePatterns,
...highlightMatch === true
? {}
: {
highlightA,
highlightB,
},
diff: highlightDiff,
shiki?.dispose()
}

try {
shiki = await createHighlighter({
langs: [lang],
themes: ['vitesse-dark'],
engine: engineForgiving,
})

shikiWasm?.dispose()
highlightB = serializeTokens(shiki, sample, lang)
}
catch (e: any) {
console.log(c.red(`[${lang}] Error ${e} ${e.cause || ''}`))
}
finally {
shiki?.dispose()
}

if (highlightMatch !== 'error')
highlightMatch = highlightA === highlightB
highlightDiff = highlightB && highlightA !== highlightB
? diffMain(highlightA, highlightB)
: []
diffCleanupSemantic(highlightDiff)

if (!highlightMatch) {
console.log(c.yellow(`[${lang}] Mismatch`))

await fs.mkdir(new URL('./compares', import.meta.url), { recursive: true })

await fs.writeFile(
new URL(`./compares/${lang}.html`, import.meta.url),
[
'<style>',
'body { display: flex; }',
'pre { flex: 1; margin: 0; padding: 0; }',
'</style>',
'<pre>',
highlightA,
'</pre>',
'<pre>',
highlightB,
'</pre>',
].join('\n'),
'utf-8',
)
}
else {
console.log(c.green(`[${lang}] OK`))
}

report.push({
lang,
highlightMatch,
patternsParsable: parsablePatterns.length,
patternsFailed: unparsablePatterns,
...highlightMatch === true
? {}
: {
highlightA,
highlightB,
},
diff: highlightDiff,
})

shikiWasm?.dispose()
shiki?.dispose()
}

const order = [true, false, 'error']
Expand All @@ -151,13 +176,16 @@ async function run() {
['Language', 'Highlight Match', 'Patterns Parsable', 'Patterns Failed', 'Diff'],
['---', ':---', '---:', '---:', '---:'],
...report
.map(item => [
item.lang,
item.highlightMatch === true ? '✅ OK' : item.highlightMatch === 'error' ? '❌ Error' : `[🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=${item.lang})`,
item.patternsParsable === 0 ? '-' : item.patternsParsable.toString(),
item.patternsFailed.length === 0 ? '-' : item.patternsFailed.length.toString(),
item.diff.length > 1 ? (item.diff.length - 1).toString() : '',
] as [string, string, string, string, string]),
.map((item) => {
const diffCount = item.diff.filter(diff => diff[0] === 1).length
return [
item.lang,
item.highlightMatch === true ? '✅ OK' : item.highlightMatch === 'error' ? '❌ Error' : `[🚧 Mismatch](https://textmate-grammars-themes.netlify.app/?grammar=${item.lang})`,
item.patternsParsable === 0 ? '-' : item.patternsParsable.toString(),
item.patternsFailed.length === 0 ? '-' : item.patternsFailed.length.toString(),
diffCount ? diffCount.toString() : '',
] as [string, string, string, string, string]
}),
]

return table.map(row => `| ${row.join(' | ')} |`).join('\n')
Expand Down Expand Up @@ -221,6 +249,12 @@ async function run() {
)
}

function serializeTokens(shiki: HighlighterGeneric<BundledLanguage, BundledTheme>, sample: string, lang: string) {
const tokens = shiki.codeToTokensBase(sample, { lang: lang as any, theme: 'vitesse-dark' })
const str = tokens.flat(1).map(t => t.color?.padEnd(18, ' ') + t.content).join('\n')
return str
}

function getPatternsOfGrammar(grammar: any) {
const patterns = new Set<string>()

Expand Down

0 comments on commit 149a729

Please sign in to comment.