diff --git a/core/server/lib/mobiledoc/cards/code.js b/core/server/lib/mobiledoc/cards/code.js index a0c35debbb..1be54cc03f 100644 --- a/core/server/lib/mobiledoc/cards/code.js +++ b/core/server/lib/mobiledoc/cards/code.js @@ -21,6 +21,18 @@ module.exports = createCard({ code.appendChild(dom.createTextNode(payload.code)); pre.appendChild(code); - return pre; + if (payload.caption) { + let figure = dom.createElement('figure'); + figure.setAttribute('class', 'kg-card kg-code-card'); + figure.appendChild(pre); + + let figcaption = dom.createElement('figcaption'); + figcaption.appendChild(dom.createRawHTMLSection(payload.caption)); + figure.appendChild(figcaption); + + return figure; + } else { + return pre; + } } }); diff --git a/core/test/unit/lib/mobiledoc/cards/code_spec.js b/core/test/unit/lib/mobiledoc/cards/code_spec.js index 0f42b0ffd1..57723aef1e 100644 --- a/core/test/unit/lib/mobiledoc/cards/code_spec.js +++ b/core/test/unit/lib/mobiledoc/cards/code_spec.js @@ -43,4 +43,19 @@ describe('Code card', function () { serializer.serialize(card.render(opts)).should.match(''); }); + + it('Renders a figure if a caption is provided', function () { + let opts = { + env: { + dom: new SimpleDom.Document() + }, + payload: { + code: '

Test

', + language: 'html', + caption: 'Some HTML' + } + }; + + serializer.serialize(card.render(opts)).should.match('
<p>Test</p>
Some HTML
'); + }); });