Workaround to import react-helmet-async

There appears to be a bug in which named imports do not work. This bug
only appears for us when running under Jest, but not when bundling with
webpack.

This workaround allows us to import react-helmet-async in different
contexts.

If this issue is fixed upstream, then this commit can be reverted.

See: staylor/react-helmet-async#208

components/page/src/GovUKPage.tsx

@@ -1,5 +1,5 @@
 import { FC, createElement as h } from 'react';
-import { Helmet } from 'react-helmet-async';
+import reactHelmetDefault, * as reactHelmetNamed from 'react-helmet-async';
 import { Page, PageProps } from './Page';
 
 import favicon from 'govuk-frontend/govuk/assets/images/favicon.ico';
@@ -12,6 +12,9 @@ import ogImage from 'govuk-frontend/govuk/assets/images/govuk-opengraph-image.pn
 
 import '../assets/GovUKPage.scss';
 
+const reactHelmet = reactHelmetDefault || reactHelmetNamed;
+const { Helmet } = reactHelmet;
+
 export type GovUKPageProps = Omit<PageProps, 'govUK'>;
 
 export const GovUKPage: FC<GovUKPageProps> = ({ children, classModifiers, ...props }) => (

components/page/src/NotGovUKPage.tsx

@@ -1,5 +1,5 @@
 import { FC, createElement as h } from 'react';
-import { Helmet } from 'react-helmet-async';
+import reactHelmetDefault, * as reactHelmetNamed from 'react-helmet-async';
 import { Page, PageProps } from './Page';
 
 import favicon from '../assets/coat-favicon.ico';
@@ -11,6 +11,9 @@ import ogImage from '../assets/coat-opengraph-image.png';
 
 import '../assets/NotGovUKPage.scss';
 
+const reactHelmet = reactHelmetDefault || reactHelmetNamed;
+const { Helmet } = reactHelmet;
+
 export type NotGovUKPageProps = Omit<PageProps, 'govUK'>;
 
 export const NotGovUKPage: FC<NotGovUKPageProps> = ({ children, classModifiers, ...props }) => (

components/page/src/Page.tsx

@@ -1,5 +1,5 @@
 import { FC, Fragment, HTMLProps, ReactNode, createElement as h } from 'react';
-import { Helmet } from 'react-helmet-async';
+import reactHelmetDefault, * as reactHelmetNamed from 'react-helmet-async';
 import { BackLink } from '@not-govuk/back-link';
 import { Breadcrumb, Breadcrumbs } from '@not-govuk/breadcrumbs';
 import { StandardProps, classBuilder } from '@not-govuk/component-helpers';
@@ -12,6 +12,9 @@ import { WidthContainer } from '@not-govuk/width-container';
 
 import '../assets/Page.scss';
 
+const reactHelmet = reactHelmetDefault || reactHelmetNamed;
+const { Helmet } = reactHelmet;
+
 export type PageProps = (
   StandardProps &
   HTMLProps<HTMLDivElement> &

lib/component-test-helpers/src/index.ts

@@ -1,11 +1,14 @@
 import { FC, ReactElement, ReactNode, createElement as h } from 'react';
-import { HelmetProvider } from 'react-helmet-async';
+import reactHelmetDefault, * as reactHelmetNamed from 'react-helmet-async';
 import { MemoryRouter } from 'react-router';
 import { render as _render, RenderOptions } from '@testing-library/react';
 import userEventDefault from '@testing-library/user-event';
 
 import '@testing-library/jest-dom';
 
+const reactHelmet = reactHelmetDefault || reactHelmetNamed;
+const { HelmetProvider } = reactHelmet;
+
 const Providers: FC<{ children?: ReactNode, routerProps?: object }> = ({
   children,
   routerProps