Remove instanceof in favour of narrower types

Unfortunately the compiler can’t make assumptions about the element type when string building:

```
'a.govuk-tabs__tab[href="' + hash + '"]'
```

src/govuk/components/character-count/character-count.mjs

@@ -132,7 +132,7 @@ CharacterCount.prototype.init = function () {
   var $textarea = this.$textarea
   var $textareaDescription = document.getElementById($textarea.id + '-info')
 
-  if (!($textareaDescription instanceof HTMLElement)) {
+  if (!$textareaDescription) {
     return this
   }
 

src/govuk/components/checkboxes/checkboxes.mjs

@@ -109,13 +109,9 @@ Checkboxes.prototype.syncAllConditionalReveals = function () {
  * Synchronise the visibility of the conditional reveal, and its accessible
  * state, with the input's checked state.
  *
- * @param {Element} $input - Checkbox input
+ * @param {HTMLInputElement} $input - Checkbox input
  */
 Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
-  if (!($input instanceof HTMLInputElement)) {
-    return
-  }
-
   var targetId = $input.getAttribute('aria-controls')
   if (!targetId) {
     return
@@ -136,13 +132,9 @@ Checkboxes.prototype.syncConditionalRevealWithInputState = function ($input) {
  * Find any other checkbox inputs with the same name value, and uncheck them.
  * This is useful for when a “None of these" checkbox is checked.
  *
- * @param {Element} $input - Checkbox input
+ * @param {HTMLInputElement} $input - Checkbox input
  */
 Checkboxes.prototype.unCheckAllInputsExcept = function ($input) {
-  if (!($input instanceof HTMLInputElement)) {
-    return
-  }
-
   var allInputsWithSameName = document.querySelectorAll('input[type="checkbox"][name="' + $input.name + '"]')
 
   nodeListForEach(
@@ -175,13 +167,9 @@ Checkboxes.prototype.unCheckAllInputsExcept = function ($input) {
  * and uncheck them. This helps prevent someone checking both a regular checkbox and a
  * "None of these" checkbox in the same fieldset.
  *
- * @param {Element} $input - Checkbox input
+ * @param {HTMLInputElement} $input - Checkbox input
  */
 Checkboxes.prototype.unCheckExclusiveInputs = function ($input) {
-  if (!($input instanceof HTMLInputElement)) {
-    return
-  }
-
   var allInputsWithSameNameAndExclusiveBehaviour = document.querySelectorAll(
     'input[data-behaviour="exclusive"][type="checkbox"][name="' + $input.name + '"]'
   )

src/govuk/components/error-summary/error-summary.mjs

@@ -118,7 +118,7 @@ ErrorSummary.prototype.focusTarget = function ($target) {
   }
 
   var $input = document.getElementById(inputId)
-  if (!$input) {
+  if (!($input instanceof HTMLInputElement)) {
     return false
   }
 
@@ -170,7 +170,7 @@ ErrorSummary.prototype.getFragmentFromUrl = function (url) {
  * - The first `<label>` that is associated with the input using for="inputId"
  * - The closest parent `<label>`
  *
- * @param {Element} $input - The input
+ * @param {HTMLInputElement} $input - The input
  * @returns {Element | null} Associated legend or label, or null if no associated
  *   legend or label can be found
  */
@@ -185,7 +185,7 @@ ErrorSummary.prototype.getAssociatedLegendOrLabel = function ($input) {
 
       // If the input type is radio or checkbox, always use the legend if there
       // is one.
-      if ($input instanceof HTMLInputElement && ($input.type === 'checkbox' || $input.type === 'radio')) {
+      if ($input.type === 'checkbox' || $input.type === 'radio') {
         return $candidateLegend
       }
 

src/govuk/components/radios/radios.mjs

@@ -108,13 +108,9 @@ Radios.prototype.syncAllConditionalReveals = function () {
  * Synchronise the visibility of the conditional reveal, and its accessible
  * state, with the input's checked state.
  *
- * @param {Element} $input - Radio input
+ * @param {HTMLInputElement} $input - Radio input
  */
 Radios.prototype.syncConditionalRevealWithInputState = function ($input) {
-  if (!($input instanceof HTMLInputElement)) {
-    return
-  }
-
   var targetId = $input.getAttribute('aria-controls')
   if (!targetId) {
     return
@@ -160,14 +156,10 @@ Radios.prototype.handleClick = function (event) {
     /**
      * Loop through radios
      *
-     * @param {Element} $input - Radio input
+     * @param {HTMLInputElement} $input - Radio input
      * @this {Radios}
      */
     function ($input) {
-      if (!($input instanceof HTMLInputElement)) {
-        return
-      }
-
       var hasSameFormOwner = $input.form === $clickedInputForm
       var hasSameName = $input.name === $clickedInputName
 

src/govuk/components/tabs/tabs.mjs

@@ -18,7 +18,7 @@ function Tabs ($module) {
     return this
   }
 
-  var $tabs = $module.querySelectorAll('.govuk-tabs__tab')
+  var $tabs = $module.querySelectorAll('a.govuk-tabs__tab')
   if (!$tabs.length) {
     return this
   }
@@ -102,14 +102,10 @@ Tabs.prototype.setup = function () {
     /**
      * Loop through tab links
      *
-     * @param {Element} $tab - Tab link
+     * @param {HTMLAnchorElement} $tab - Tab link
      * @this {Tabs}
      */
     function ($tab) {
-      if (!($tab instanceof HTMLAnchorElement)) {
-        return
-      }
-
       // Set HTML attributes
       this.setAttributes($tab)
 
@@ -125,7 +121,7 @@ Tabs.prototype.setup = function () {
   // Show either the active tab according to the URL's hash or the first tab
   var $activeTab = this.getTab(window.location.hash) || this.$tabs[0]
 
-  if ($activeTab instanceof HTMLAnchorElement) {
+  if ($activeTab) {
     this.showTab($activeTab)
 
     // Handle hashchange events
@@ -140,7 +136,7 @@ Tabs.prototype.teardown = function () {
   var $module = this.$module
   var $tabs = this.$tabs
   var $tabList = $module.querySelector('.govuk-tabs__list')
-  var $tabListItems = $module.querySelectorAll('.govuk-tabs__list-item')
+  var $tabListItems = $module.querySelectorAll('a.govuk-tabs__list-item')
 
   if (!$tabs || !$tabList || !$tabListItems) {
     return
@@ -158,14 +154,10 @@ Tabs.prototype.teardown = function () {
     /**
      * Loop through tab links
      *
-     * @param {Element} $tab - Tab link
+     * @param {HTMLAnchorElement} $tab - Tab link
      * @this {Tabs}
      */
     function ($tab) {
-      if (!($tab instanceof HTMLAnchorElement)) {
-        return
-      }
-
       // Remove events
       $tab.removeEventListener('click', this.boundTabClick, true)
       $tab.removeEventListener('keydown', this.boundTabKeydown, true)
@@ -372,14 +364,14 @@ Tabs.prototype.activateNextTab = function () {
     return
   }
 
-  var $nextTab
-
   var $nextTabListItem = $currentTab.parentElement.nextElementSibling
-  if ($nextTabListItem) {
-    $nextTab = $nextTabListItem.querySelector('.govuk-tabs__tab')
+  if (!$nextTabListItem) {
+    return
   }
 
-  if ($nextTab instanceof HTMLAnchorElement) {
+  var $nextTab = $nextTabListItem.querySelector('a.govuk-tabs__tab')
+
+  if ($nextTab) {
     this.hideTab($currentTab)
     this.showTab($nextTab)
     $nextTab.focus()
@@ -396,14 +388,14 @@ Tabs.prototype.activatePreviousTab = function () {
     return
   }
 
-  var $previousTab
-
   var $previousTabListItem = $currentTab.parentElement.previousElementSibling
-  if ($previousTabListItem) {
-    $previousTab = $previousTabListItem.querySelector('.govuk-tabs__tab')
+  if (!$previousTabListItem) {
+    return
   }
 
-  if ($previousTab instanceof HTMLAnchorElement) {
+  var $previousTab = $previousTabListItem.querySelector('a.govuk-tabs__tab')
+
+  if ($previousTab) {
     this.hideTab($currentTab)
     this.showTab($previousTab)
     $previousTab.focus()
@@ -490,8 +482,8 @@ Tabs.prototype.highlightTab = function ($tab) {
  * @returns {HTMLAnchorElement | undefined} Tab link
  */
 Tabs.prototype.getCurrentTab = function () {
-  var $tab = this.$module.querySelector('.govuk-tabs__list-item--selected .govuk-tabs__tab')
-  if (!($tab instanceof HTMLAnchorElement)) {
+  var $tab = this.$module.querySelector('.govuk-tabs__list-item--selected a.govuk-tabs__tab')
+  if (!$tab) {
     return
   }