Check Skip link URL and return early for external URLs

We don’t need to proceed with event listeners and focus handling if the target isn’t on the same page

For example, Exit this page secondary link

https://design-system.service.gov.uk/components/exit-this-page/#adding-the-secondary-link

packages/govuk-frontend/src/govuk/components/skip-link/skip-link.mjs

@@ -39,6 +39,12 @@ export class SkipLink extends GOVUKFrontendComponent {
 
     const hash = this.$module.hash
     const href = this.$module.getAttribute('href') ?? ''
+    const url = new window.URL(this.$module.href)
+
+    // Check for external link URL and return early
+    if (url.origin !== window.location.origin) {
+      return
+    }
 
     const linkedElementId = getFragmentFromUrl(hash)
 
@@ -73,6 +79,10 @@ export class SkipLink extends GOVUKFrontendComponent {
    * @private
    */
   focusLinkedElement() {
+    if (!this.$linkedElement) {
+      return
+    }
+
     if (!this.$linkedElement.getAttribute('tabindex')) {
       // Set the element tabindex to -1 so it can be focused with JavaScript.
       this.$linkedElement.setAttribute('tabindex', '-1')
@@ -101,6 +111,10 @@ export class SkipLink extends GOVUKFrontendComponent {
    * @private
    */
   removeFocusProperties() {
+    if (!this.$linkedElement) {
+      return
+    }
+
     this.$linkedElement.removeAttribute('tabindex')
     this.$linkedElement.classList.remove('govuk-skip-link-focused-element')
   }

packages/govuk-frontend/src/govuk/components/skip-link/skip-link.puppeteer.test.js

@@ -67,6 +67,15 @@ describe('Skip Link', () => {
   })
 
   describe('errors at instantiation', () => {
+    it('can return early without errors for external href', async () => {
+      await render(page, 'skip-link', {
+        context: {
+          text: 'Exit this page',
+          href: 'https://www.bbc.co.uk/weather'
+        }
+      })
+    })
+
     it('can throw a SupportError if appropriate', async () => {
       await expect(
         render(page, 'skip-link', examples.default, {