fix(gatsby-plugin-react-helment): stop appending empty title tags (#3…

…6303) * stop appending empty title tags * fix tests * Update packages/gatsby-plugin-react-helmet/src/gatsby-ssr.js Co-authored-by: Michal Piechowiak <[email protected]> Co-authored-by: Michal Piechowiak <[email protected]>
gatsbyjs · Aug 3, 2022 · e7f0ce3 · e7f0ce3
1 parent 6ed1858
commit e7f0ce3
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 5 deletions.
diff --git a/packages/gatsby-plugin-react-helmet/src/__mocks__/react-helmet.js b/packages/gatsby-plugin-react-helmet/src/__mocks__/react-helmet.js
@@ -1,7 +1,7 @@
 const helmet = {
   htmlAttributes: { toComponent: () => `html-attributes-component` },
   bodyAttributes: { toComponent: () => `body-attributes-component` },
-  title: { toComponent: () => `title-component` },
+  title: { toComponent: () => [{ props: { children: `children` } }] },
   link: { toComponent: () => `link-component` },
   meta: { toComponent: () => `meta-component` },
   noscript: { toComponent: () => `noscript-component` },

diff --git a/packages/gatsby-plugin-react-helmet/src/__tests__/gatsby-ssr.js b/packages/gatsby-plugin-react-helmet/src/__tests__/gatsby-ssr.js
@@ -1,3 +1,5 @@
+import { Helmet } from "react-helmet"
+
 jest.mock(`react-helmet`)
 
 import { onRenderBody } from "../gatsby-ssr"
@@ -16,9 +18,12 @@ describe(`gatsby-plugin-react-helmet`, () => {
 
       onRenderBody(actions)
 
+      const titleComponent = Helmet.renderStatic().title.toComponent()
+
       expect(actions.setHeadComponents).toHaveBeenCalledTimes(1)
+
       expect(actions.setHeadComponents).toHaveBeenCalledWith([
-        `title-component`,
+        titleComponent,
         `link-component`,
         `meta-component`,
         `noscript-component`,

diff --git a/packages/gatsby-plugin-react-helmet/src/gatsby-ssr.js b/packages/gatsby-plugin-react-helmet/src/gatsby-ssr.js
@@ -13,13 +13,21 @@ export const onRenderBody = ({
   if (setBodyAttributes) {
     setBodyAttributes(helmet.bodyAttributes.toComponent())
   }
-  setHeadComponents([
-    helmet.title.toComponent(),
+
+  const components = [
     helmet.link.toComponent(),
     helmet.meta.toComponent(),
     helmet.noscript.toComponent(),
     helmet.script.toComponent(),
     helmet.style.toComponent(),
     helmet.base.toComponent(),
-  ])
+  ]
+
+  const titleComponent = helmet.title.toComponent()
+
+  setHeadComponents(
+    titleComponent?.[0]?.props?.children
+      ? [titleComponent, ...components]
+      : components
+  )
 }