govuk_publishing_components 23.3.0 → 23.4.0

data/node_modules/govuk-frontend/govuk/components/details/_index.scss

@@ -1,5 +1,4 @@
 @include govuk-exports("govuk/component/details") {
-
   .govuk-details {
     @include govuk-font($size: 19);
     @include govuk-text-colour;

data/node_modules/govuk-frontend/govuk/components/details/fixtures.json

@@ -0,0 +1,83 @@
+{
+    "component": "details",
+    "fixtures": [
+        {
+            "name": "default",
+            "options": {
+                "summaryText": "Help with nationality",
+                "text": "We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post."
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      Help with nationality\n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.\n  </div>\n</details>"
+        },
+        {
+            "name": "expanded",
+            "options": {
+                "id": "help-with-nationality",
+                "summaryText": "Help with nationality",
+                "text": "We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.",
+                "open": true
+            },
+            "html": "<details id=\"help-with-nationality\" class=\"govuk-details\" data-module=\"govuk-details\" open>\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      Help with nationality\n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.\n  </div>\n</details>"
+        },
+        {
+            "name": "with html",
+            "options": {
+                "summaryText": "Where to find your National Insurance Number",
+                "html": "Your National Insurance number can be found on\n<ul>\n  <li>your National Insurance card</li>\n  <li>your payslip</li>\n  <li>P60</li>\n  <li>benefits information</li>\n  <li>tax return</li>\n</ul>\n"
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      Where to find your National Insurance Number\n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    Your National Insurance number can be found on\n<ul>\n  <li>your National Insurance card</li>\n  <li>your payslip</li>\n  <li>P60</li>\n  <li>benefits information</li>\n  <li>tax return</li>\n</ul>\n\n  </div>\n</details>"
+        },
+        {
+            "name": "id",
+            "options": {
+                "id": "my-details-element"
+            },
+            "html": "<details id=\"my-details-element\" class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      \n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    \n  </div>\n</details>"
+        },
+        {
+            "name": "html as text",
+            "options": {
+                "text": "More about the greater than symbol (>)"
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      \n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    More about the greater than symbol (&gt;)\n  </div>\n</details>"
+        },
+        {
+            "name": "html",
+            "options": {
+                "html": "More about <b>bold text</b>"
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      \n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    More about <b>bold text</b>\n  </div>\n</details>"
+        },
+        {
+            "name": "summary html as text",
+            "options": {
+                "summaryText": "The greater than symbol (>) is the best"
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      The greater than symbol (&gt;) is the best\n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    \n  </div>\n</details>"
+        },
+        {
+            "name": "summary html",
+            "options": {
+                "summaryHtml": "Use <b>bold text</b> sparingly"
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      Use <b>bold text</b> sparingly\n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    \n  </div>\n</details>"
+        },
+        {
+            "name": "classes",
+            "options": {
+                "classes": "some-additional-class"
+            },
+            "html": "<details class=\"govuk-details some-additional-class\" data-module=\"govuk-details\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      \n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    \n  </div>\n</details>"
+        },
+        {
+            "name": "attributes",
+            "options": {
+                "attributes": {
+                    "data-some-data-attribute": "i-love-data",
+                    "another-attribute": true
+                }
+            },
+            "html": "<details class=\"govuk-details\" data-module=\"govuk-details\" data-some-data-attribute=\"i-love-data\" another-attribute=\"true\">\n  <summary class=\"govuk-details__summary\">\n    <span class=\"govuk-details__summary-text\">\n      \n    </span>\n  </summary>\n  <div class=\"govuk-details__text\">\n    \n  </div>\n</details>"
+        }
+    ]
+}

data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json

@@ -0,0 +1,66 @@
+{
+    "component": "error-message",
+    "fixtures": [
+        {
+            "name": "default",
+            "options": {
+                "text": "Error message about full name goes here"
+            },
+            "html": "<span class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> Error message about full name goes here\n</span>"
+        },
+        {
+            "name": "id",
+            "options": {
+                "id": "my-error-message-id"
+            },
+            "html": "<span id=\"my-error-message-id\" class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> \n</span>"
+        },
+        {
+            "name": "classes",
+            "options": {
+                "classes": "custom-class"
+            },
+            "html": "<span class=\"govuk-error-message custom-class\">\n  <span class=\"govuk-visually-hidden\">Error:</span> \n</span>"
+        },
+        {
+            "name": "html as text",
+            "options": {
+                "text": "Unexpected > in body"
+            },
+            "html": "<span class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> Unexpected &gt; in body\n</span>"
+        },
+        {
+            "name": "html",
+            "options": {
+                "html": "Unexpected <b>bold text</b> in body copy"
+            },
+            "html": "<span class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> Unexpected <b>bold text</b> in body copy\n</span>"
+        },
+        {
+            "name": "attributes",
+            "options": {
+                "attributes": {
+                    "data-test": "attribute",
+                    "id": "my-error-message"
+                }
+            },
+            "html": "<span class=\"govuk-error-message\" data-test=\"attribute\" id=\"my-error-message\">\n  <span class=\"govuk-visually-hidden\">Error:</span> \n</span>"
+        },
+        {
+            "name": "with visually hidden text",
+            "options": {
+                "text": "Rhowch eich enw llawn",
+                "visuallyHiddenText": "Gwall"
+            },
+            "html": "<span class=\"govuk-error-message\">\n  <span class=\"govuk-visually-hidden\">Gwall:</span> Rhowch eich enw llawn\n</span>"
+        },
+        {
+            "name": "visually hidden text removed",
+            "options": {
+                "text": "There is an error on line 42",
+                "visuallyHiddenText": false
+            },
+            "html": "<span class=\"govuk-error-message\">\n  There is an error on line 42\n</span>"
+        }
+    ]
+}

data/node_modules/govuk-frontend/govuk/components/error-summary/_index.scss

@@ -1,7 +1,6 @@
 @import "../../core/lists";
 
 @include govuk-exports("govuk/component/error-summary") {
-
   .govuk-error-summary {
     @include govuk-text-colour;
     @include govuk-responsive-padding(4);
@@ -51,5 +50,4 @@
       @include govuk-focused-text;
     }
   }
-
 }

data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json

@@ -0,0 +1,181 @@
+{
+    "component": "error-summary",
+    "fixtures": [
+        {
+            "name": "default",
+            "options": {
+                "titleText": "There is a problem",
+                "errorList": [
+                    {
+                        "text": "The date your passport was issued must be in the past",
+                        "href": "#example-error-1"
+                    },
+                    {
+                        "text": "Enter a postcode, like AA1 1AA",
+                        "href": "#example-error-2"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        <a href=\"#example-error-1\">The date your passport was issued must be in the past</a>\n      \n      </li>\n    \n      <li>\n      \n        <a href=\"#example-error-2\">Enter a postcode, like AA1 1AA</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "without links",
+            "options": {
+                "titleText": "There is a problem",
+                "errorList": [
+                    {
+                        "text": "Invalid username or password"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        Invalid username or password\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "mixed with and without links",
+            "options": {
+                "titleText": "There is a problem",
+                "errorList": [
+                    {
+                        "text": "Invalid username or password"
+                    },
+                    {
+                        "text": "Agree to the terms of service to log in",
+                        "href": "#example-error-1"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        Invalid username or password\n      \n      </li>\n    \n      <li>\n      \n        <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "with everything",
+            "options": {
+                "titleText": "There is a problem",
+                "descriptionText": "Please fix the errors below.",
+                "errorList": [
+                    {
+                        "text": "Invalid username or password"
+                    },
+                    {
+                        "text": "Agree to the terms of service to log in",
+                        "href": "#example-error-1"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <p>\n      Please fix the errors below.\n    </p>\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        Invalid username or password\n      \n      </li>\n    \n      <li>\n      \n        <a href=\"#example-error-1\">Agree to the terms of service to log in</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "html as titleText",
+            "options": {
+                "titleText": "Alert, <em>alert</em>"
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    Alert, &lt;em&gt;alert&lt;/em&gt;\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "title html",
+            "options": {
+                "titleHtml": "Alert, <em>alert</em>"
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    Alert, <em>alert</em>\n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "description",
+            "options": {
+                "descriptionText": "Lorem ipsum"
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <p>\n      Lorem ipsum\n    </p>\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "html as descriptionText",
+            "options": {
+                "descriptionText": "See errors below (▼)"
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <p>\n      See errors below (▼)\n    </p>\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "description html",
+            "options": {
+                "descriptionHtml": "See <span>errors</span> below"
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <p>\n      See <span>errors</span> below\n    </p>\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "classes",
+            "options": {
+                "classes": "extra-class one-more-class"
+            },
+            "html": "<div class=\"govuk-error-summary extra-class one-more-class\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "attributes",
+            "options": {
+                "attributes": {
+                    "first-attribute": "true",
+                    "second-attribute": "false"
+                }
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" first-attribute=\"true\" second-attribute=\"false\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "error list with attributes",
+            "options": {
+                "errorList": [
+                    {
+                        "text": "Error-1",
+                        "href": "#item",
+                        "attributes": {
+                            "data-attribute": "my-attribute",
+                            "data-attribute-2": "my-attribute-2"
+                        }
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        <a href=\"#item\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">Error-1</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "error list with html as text",
+            "options": {
+                "errorList": [
+                    {
+                        "text": "Descriptive link to the <b>question</b> with an error"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "error list with html",
+            "options": {
+                "errorList": [
+                    {
+                        "html": "The date your passport was issued <b>must</b> be in the past"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        The date your passport was issued <b>must</b> be in the past\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "error list with html link",
+            "options": {
+                "errorList": [
+                    {
+                        "html": "Descriptive link to the <b>question</b> with an error",
+                        "href": "#error-1"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        <a href=\"#error-1\">Descriptive link to the <b>question</b> with an error</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        },
+        {
+            "name": "error list with html as text link",
+            "options": {
+                "errorList": [
+                    {
+                        "text": "Descriptive link to the <b>question</b> with an error",
+                        "href": "#error-1"
+                    }
+                ]
+            },
+            "html": "<div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    \n  </h2>\n  <div class=\"govuk-error-summary__body\">\n    \n    <ul class=\"govuk-list govuk-error-summary__list\">\n    \n      <li>\n      \n        <a href=\"#error-1\">Descriptive link to the &lt;b&gt;question&lt;/b&gt; with an error</a>\n      \n      </li>\n    \n    </ul>\n  </div>\n</div>"
+        }
+    ]
+}

data/node_modules/govuk-frontend/govuk/components/fieldset/_index.scss

@@ -11,7 +11,7 @@
   // https://bugzilla.mozilla.org/show_bug.cgi?id=504622
   @supports not (caret-color: auto) {
     .govuk-fieldset,
-    x:-moz-any-link {
+    x:-moz-any-link { // stylelint-disable-line selector-type-no-unknown
       display: table-cell;
     }
   }

data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json

@@ -0,0 +1,93 @@
+{
+    "component": "fieldset",
+    "fixtures": [
+        {
+            "name": "default",
+            "options": {
+                "legend": {
+                    "text": "What is your address?"
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend\">\n  \n    What is your address?\n  \n  </legend>\n  \n\n</fieldset>"
+        },
+        {
+            "name": "as page heading",
+            "options": {
+                "legend": {
+                    "text": "What is your address?",
+                    "classes": "govuk-fieldset__legend--xl",
+                    "isPageHeading": true
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--xl\">\n  \n    <h1 class=\"govuk-fieldset__heading\">\n      What is your address?\n    </h1>\n  \n  </legend>\n  \n\n</fieldset>"
+        },
+        {
+            "name": "html fieldset content",
+            "options": {
+                "legend": {
+                    "text": "What is your address?"
+                },
+                "html": "<div class=\"my-content\">\n  <p>This is some content to put inside the fieldset</p>\n</div>\n"
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend\">\n  \n    What is your address?\n  \n  </legend>\n  \n\n  <div class=\"my-content\">\n  <p>This is some content to put inside the fieldset</p>\n</div>\n\n\n</fieldset>"
+        },
+        {
+            "name": "with describedBy",
+            "options": {
+                "describedBy": "some-id"
+            },
+            "html": "<fieldset class=\"govuk-fieldset\" aria-describedby=\"some-id\">\n  \n\n</fieldset>"
+        },
+        {
+            "name": "html as text",
+            "options": {
+                "legend": {
+                    "text": "What is <b>your</b> address?"
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend\">\n  \n    What is &lt;b&gt;your&lt;/b&gt; address?\n  \n  </legend>\n  \n\n</fieldset>"
+        },
+        {
+            "name": "html",
+            "options": {
+                "legend": {
+                    "html": "What is <b>your</b> address?"
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend\">\n  \n    What is <b>your</b> address?\n  \n  </legend>\n  \n\n</fieldset>"
+        },
+        {
+            "name": "legend classes",
+            "options": {
+                "legend": {
+                    "text": "What is your address?",
+                    "classes": "my-custom-class"
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\">\n  \n  <legend class=\"govuk-fieldset__legend my-custom-class\">\n  \n    What is your address?\n  \n  </legend>\n  \n\n</fieldset>"
+        },
+        {
+            "name": "classes",
+            "options": {
+                "classes": "app-fieldset--custom-modifier"
+            },
+            "html": "<fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\">\n  \n\n</fieldset>"
+        },
+        {
+            "name": "role",
+            "options": {
+                "role": "group"
+            },
+            "html": "<fieldset class=\"govuk-fieldset\" role=\"group\">\n  \n\n</fieldset>"
+        },
+        {
+            "name": "attributes",
+            "options": {
+                "attributes": {
+                    "data-attribute": "value"
+                }
+            },
+            "html": "<fieldset class=\"govuk-fieldset\" data-attribute=\"value\">\n  \n\n</fieldset>"
+        }
+    ]
+}