Add visual regression tests for focused header search input

Author: paulrobertlloyd

backstop.config.js

@@ -594,6 +594,17 @@ module.exports = {
         viewports.get('large-desktop')
       ]
     },
+    {
+      clickSelector: '.nhsuk-header__search-input',
+      label: 'Header with search (focused search input)',
+      url: `${BASE_URL}/components/header/header-search.html`,
+      viewports: [
+        viewports.get('mobile'),
+        viewports.get('tablet'),
+        viewports.get('desktop'),
+        viewports.get('large-desktop')
+      ]
+    },
     {
       label: 'Header with account (logged in)',
       url: `${BASE_URL}/components/header/header-account-logged-in.html`,
@@ -687,6 +698,18 @@ module.exports = {
         viewports.get('large-desktop')
       ]
     },
+    {
+      clickSelector: '.nhsuk-header__search-input',
+      label: 'Header organisational with white header (focused search input)',
+      url: `${BASE_URL}/components/header/header-org-white.html`,
+      onReadyScript: 'playwright/onReadyResize.js',
+      viewports: [
+        viewports.get('mobile'),
+        viewports.get('tablet'),
+        viewports.get('desktop'),
+        viewports.get('large-desktop')
+      ]
+    },
     {
       label: 'Header organisational with white header, navigation',
       url: `${BASE_URL}/components/header/header-org-white-nav.html`,