CodeChunk: Wrap contents in `<figure>` element

[alex-ketch]

Related to: stencila/stencila#1136

We currently wrap a <stencila-code-chunk> wrapped in a <figure>

<figure itemtype="http://schema.stenci.la/Figure">
   <label data-itemprop="label">...</label>
   <stencila-code-chunk itemtype="http://schema.stenci.la/CodeChunk" itemscope programming-language="r">
      <pre slot="text">...</pre>
      <pre slot="outputs">...</pre>
   </stencila-code-chunk>
   <figcaption data-itemprop="caption">...</figcaption>
</figure>

This hangover from when a code chunk did not have label and caption properties. Now that it does have those properties, it is more semantically correct (from the Microdata perspective) to have those properties nested within the CodeChunks itemscope but to retain the <figure> for HTML semantic correctness:

<stencila-code-chunk itemtype="http://schema.stenci.la/CodeChunk" itemscope programming-language="r">
  <figure>
    <label data-itemprop="label">...</label>
    <pre data-itemprop="text" slot="text">...</pre>
    <pre data-itemprop="outputs" slot="outputs">...</pre>
    <figcaption data-itemprop="caption">...</figcaption>
  </figure>
 </stencila-code-chunk>

Given that this (and the CodeExpression) encoding needs to be of a specific shape for compatibility with custom components in designa, snapshot tests should be added to pick up any future regressions.

[alex-ketch]

Closed in 75e5014