fix: ignore leading & trailing whitespaces surrounding annotations (#68)

src/plugins/run/__tests__/__fixtures__/images/whitespaces.md

@@ -0,0 +1,11 @@
+Image in a paragraph:
+<!-- inline: true -->      
+![should have inline][ecologi_image].
+
+<!-- type: tab -->  
+
+Tab paragraph two.
+
+  <!-- type: tab-end -->      
+
+[ecologi_image]: https://img.shields.io/badge/Buy%20us%20a%20tree-%F0%9F%8C%B3-lightgreen

src/plugins/run/__tests__/inline-images.spec.ts

@@ -59,6 +59,36 @@ describe('inline-images plugin', () => {
   </tabs>
 </>;
 "
+`);
+  });
+
+  it('should ignore whitespaces', () => {
+    const input = fs.readFileSync(path.join(__dirname, '__fixtures__/images/whitespaces.md'), 'utf8');
+
+    // let's make sure the document does indeed have the whitespaces.
+    // someone may remove them when running prettier, etc., you know.
+    expect(input).toContain('<!-- inline: true -->      ');
+    expect(input).toContain('<!-- type: tab -->  ');
+    expect(input).toContain('  <!-- type: tab-end -->      ');
+
+    expect(prettyParse(input)).toMatchInlineSnapshot(`
+"<>
+  <p>Image in a paragraph:</p>
+  <p inline=\\"true\\">
+    <img
+      src=\\"https://img.shields.io/badge/Buy%20us%20a%20tree-%F0%9F%8C%B3-lightgreen\\"
+      alt=\\"should have inline\\"
+      inline=\\"true\\"
+    />
+    .
+  </p>
+  <tabs>
+    <tab type=\\"tab\\">
+      <p>Tab paragraph two.</p>
+    </tab>
+  </tabs>
+</>;
+"
 `);
   });
 });

src/plugins/run/annotations.ts

@@ -157,15 +157,9 @@ function captureAnnotations<T extends Dictionary<any>>(node: MDAST.Content | und
       console.error(`Markdown.captureAnnotations parse YAML error: ${String(error)}`, error);
       // ignore invalid YAML
     }
-  } else if (
-    node.type === 'html' &&
-    (node.value as string).startsWith('<!--') &&
-    (node.value as string).endsWith('-->')
-  ) {
+  } else if (node.type === 'html' && isHTMLComment(node.value)) {
     // remove comments and whitespace
-    const raw = (node.value as string)
-      .substr('<!--'.length, (node.value as string).length - '-->'.length - '<!--'.length)
-      .trim();
+    const raw = node.value.slice(node.value.indexOf('<!--') + 4, node.value.lastIndexOf('-->')).trim();
 
     // load contents of annotation into yaml
     try {
@@ -215,3 +209,11 @@ export function normalizeAnnotationsForHast(annotations?: object) {
 
   return cleaned;
 }
+
+function isHTMLComment(value: unknown): value is string {
+  if (typeof value !== 'string') return false;
+
+  const trimmedValue = value.trim();
+
+  return trimmedValue.startsWith('<!--') && trimmedValue.endsWith('-->');
+}