fix: handle ts-type values with curly braces (#22)

Author: dsanders11

bin/lint-markdown-ts-check.ts

@@ -9,7 +9,12 @@ import * as minimist from 'minimist';
 import { rimraf } from 'rimraf';
 import { URI } from 'vscode-uri';
 
-import { chunkFilenames, spawnAsync, wrapOrphanObjectInParens } from '../lib/helpers';
+import {
+  chunkFilenames,
+  findCurlyBracedDirectives,
+  spawnAsync,
+  wrapOrphanObjectInParens,
+} from '../lib/helpers';
 import { getCodeBlocks, DocsWorkspace } from '../lib/markdown';
 
 interface Options {
@@ -82,9 +87,11 @@ async function main(workspaceRoot: string, globs: string[], { ignoreGlobs = [] }
           ?.match(/\B@ts-ignore=\[([\d,]*)\]\B/)?.[1]
           .split(',')
           .map((line) => parseInt(line));
-        const tsTypeLines = Array.from(
-          codeBlock.meta?.matchAll(/\B@ts-type={([^:\r\n\t\f\v ]+):\s?([^}]+)}\B/g) ?? [],
-        );
+        const tsTypeLines = codeBlock.meta
+          ? findCurlyBracedDirectives('@ts-type', codeBlock.meta)
+              .map((directive) => directive.match(/^([^:\r\n\t\f\v ]+):\s?(.+)$/))
+              .filter((directive): directive is RegExpMatchArray => directive !== null)
+          : [];
 
         if (tsNoCheck && (tsExpectErrorLines || tsIgnoreLines || tsTypeLines.length)) {
           console.log(

lib/helpers.ts

@@ -1,6 +1,8 @@
 import * as childProcess from 'node:child_process';
 import * as os from 'node:os';
 
+import { range as balancedRange } from 'balanced-match';
+
 // Helper function to work around import issues with ESM module
 // eslint-disable-next-line no-new-func
 export const dynamicImport = new Function('specifier', 'return import(specifier)');
@@ -72,3 +74,23 @@ export function chunkFilenames(filenames: string[], offset: number = 0): string[
     [[]],
   );
 }
+
+export function findCurlyBracedDirectives(directive: string, str: string) {
+  const prefix = `${directive}=`;
+  const matches: string[] = [];
+  let idx = 0;
+
+  while (idx >= 0 && idx < str.length) {
+    idx = str.indexOf(prefix, idx);
+    if (idx >= 0) {
+      idx = idx + prefix.length;
+      const val = str.slice(idx);
+      const range = balancedRange('{', '}', val);
+      if (range) {
+        matches.push(val.slice(range[0] + 1, range[1]).trim());
+      }
+    }
+  }
+
+  return matches;
+}

package.json

@@ -39,6 +39,7 @@
   "devDependencies": {
     "@continuous-auth/semantic-release-npm": "^3.0.0",
     "@electron-internal/eslint-config": "^1.0.1",
+    "@types/balanced-match": "^1.0.3",
     "@types/glob": "^8.0.1",
     "@types/jest": "^29.4.0",
     "@types/markdown-it": "^12.2.3",
@@ -55,6 +56,7 @@
   },
   "dependencies": {
     "@dsanders11/vscode-markdown-languageservice": "^0.3.0",
+    "balanced-match": "^2.0.0",
     "glob": "^8.1.0",
     "markdown-it": "^13.0.1",
     "markdownlint-cli": "^0.33.0",

tests/fixtures/ts-check.md

@@ -140,7 +140,7 @@ window.myAwesomeAPI()
 
 This block defines additional types
 
-```js @ts-type={a: number} @ts-type={debug: (url: string) => boolean} @ts-type={b: number}
+```js @ts-type={a: number} @ts-type={anObject: { aProp: string }} @ts-type={debug: (url: string) => boolean} @ts-type={ anotherObject: { foo: { bar: string } } } @ts-type={b: number}
 if (a > b) {
   debug('true')
 } else {

tests/helpers.spec.ts

@@ -0,0 +1,32 @@
+import { findCurlyBracedDirectives } from '../lib/helpers';
+
+describe('findCurlyBracedDirectives', () => {
+  it('should return an empty array if no matches', () => {
+    const matches = findCurlyBracedDirectives('foo', 'this is gibberish');
+    expect(Array.isArray(matches)).toEqual(true);
+    expect(matches.length).toEqual(0);
+  });
+
+  it('should return a match when there is one match', () => {
+    const matches = findCurlyBracedDirectives('@ts-type', '@ts-type={foo: string}');
+    expect(Array.isArray(matches)).toEqual(true);
+    expect(matches.length).toEqual(1);
+    expect(matches[0]).toEqual('foo: string');
+  });
+
+  it('should return a match when there are multiple matches', () => {
+    const matches = findCurlyBracedDirectives(
+      '@ts-type',
+      '@ts-type={a: number} @ts-type={ anObject: { aProp: string } } @ts-type={debug: (url: string) => boolean} @ts-type={anObject: { foo: { bar: string } }} @ts-type={b: number}',
+    );
+    expect(Array.isArray(matches)).toEqual(true);
+    expect(matches.length).toEqual(5);
+    expect(matches).toEqual([
+      'a: number',
+      'anObject: { aProp: string }',
+      'debug: (url: string) => boolean',
+      'anObject: { foo: { bar: string } }',
+      'b: number',
+    ]);
+  });
+});

yarn.lock

@@ -933,6 +933,11 @@
   dependencies:
     "@babel/types" "^7.3.0"
 
+"@types/balanced-match@^1.0.3":
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/@types/balanced-match/-/balanced-match-1.0.3.tgz#14fd1e4175bc45b878ca310739b330d6748f5fd8"
+  integrity sha512-nBZFt2r4snsIMicyNwgdga4wcoJtGRF39xX4Le3GjA2oSJcQlGAD8XrmlRddYcINFK8dypxJEUS6bVgKBQ7FyA==
+
 "@types/debug@^4.0.0":
   version "4.1.7"
   resolved "https://registry.yarnpkg.com/@types/debug/-/debug-4.1.7.tgz#7cc0ea761509124709b8b2d1090d8f6c17aadb82"
@@ -1424,6 +1429,11 @@ balanced-match@^1.0.0:
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
   integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
 
+balanced-match@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-2.0.0.tgz#dc70f920d78db8b858535795867bf48f820633d9"
+  integrity sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==
+
 bin-links@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/bin-links/-/bin-links-3.0.3.tgz#3842711ef3db2cd9f16a5f404a996a12db355a6e"