feat: new option figcaption (#264)

Author: stevenjoezhang

README.md

@@ -48,6 +48,7 @@ marked:
   dompurify: false
   headerIds: true
   lazyload: false
+  figcaption: false
   prependRoot: true
   postAsset: false
   external_link:
@@ -79,6 +80,7 @@ marked:
   * Example: `## [foo](#bar)`, id will be set as "bar".
   * Requires **headerIds** to be enabled.
 - **lazyload** - Lazy loading images via `loading="lazy"` attribute.
+- **figcaption** - Append `figcaption` element after each image.
 - **prependRoot** - Prepend root value to (internal) image path.
   * Example `_config.yml`:
   ``` yml

lib/renderer.js

@@ -118,7 +118,7 @@ class Renderer extends MarkedRenderer {
   image(href, title, text) {
     const { hexo, options } = this;
     const { relative_link } = hexo.config;
-    const { lazyload, prependRoot, postPath } = options;
+    const { lazyload, figcaption, prependRoot, postPath } = options;
 
     if (!/^(#|\/\/|http(s)?:)/.test(href) && !relative_link && prependRoot) {
       if (!href.startsWith('/') && !href.startsWith('\\') && postPath) {
@@ -137,6 +137,9 @@ class Renderer extends MarkedRenderer {
     if (lazyload) out += ' loading="lazy"';
 
     out += '>';
+    if (figcaption) {
+      if (text) out += `<figcaption aria-hidden="true">${text}</figcaption>`;
+    }
     return out;
   }
 }

test/index.js

@@ -791,6 +791,26 @@ describe('Marked renderer', () => {
     ].join('\n'));
   });
 
+  it('figcaption', () => {
+    const body = [
+      '![](/bar/baz.jpg "bar")',
+      '![foo](/bar/baz.jpg "bar")',
+      '![foo](/aaa/bbb.jpg)'
+    ].join('\n');
+
+    hexo.config.marked.figcaption = true;
+
+    const r = require('../lib/renderer').bind(hexo);
+
+    const result = r({ text: body });
+
+    result.should.eql([
+      '<p><img src="/bar/baz.jpg" title="bar">',
+      '<img src="/bar/baz.jpg" alt="foo" title="bar"><figcaption aria-hidden="true">foo</figcaption>',
+      '<img src="/aaa/bbb.jpg" alt="foo"><figcaption aria-hidden="true">foo</figcaption></p>\n'
+    ].join('\n'));
+  });
+
   describe('postAsset', () => {
     const Post = hexo.model('Post');
     const PostAsset = hexo.model('PostAsset');