diff --git a/src/processors/marked-extension.js b/src/processors/marked-extension.js
index ebe1bea..dc292a9 100644
--- a/src/processors/marked-extension.js
+++ b/src/processors/marked-extension.js
@@ -1,13 +1,22 @@
+// This code defines a custom renderer that extends marked.js and overrides the table rendering method to include a
.
+// You can learn more about custom renderer here at https://marked.js.org/using_pro#renderer
export default function markedExtension() {
+ // Declare the heading text so it can be used globally
let headingText;
return {
renderer: {
+ // Custom renderer for headings
heading(text) {
+ // Set the heading text
headingText = text;
+ // Return an empty string to skip rendering the heading itself
return '';
- },
+ },
+ // Custom renderer for tables
table(header, body){
- const caption = headingText ? `${headingText}` : '';
+ // Check if there is heading text so we can add a caption
+ const caption = headingText ? `${headingText}` : '';
+ // Construct the table element with the optional caption
return `
${caption}
${header}
diff --git a/src/rendering/filters/htmlContentFilter.js b/src/rendering/filters/htmlContentFilter.js
index f2d9027..5491001 100644
--- a/src/rendering/filters/htmlContentFilter.js
+++ b/src/rendering/filters/htmlContentFilter.js
@@ -35,6 +35,7 @@ export default function createHtmlContentFilter(data) {
// Decorate table elements with ONS design system classes.
[escape("',
+ [escape("")]: '',
[escape("")]: '',
[escape("")]: '',
[escape("")]: '
',