gatsby-ssr.js setHeadComponents Causes "Unhandled Runtime Error" in Dev Mode #30236

papageno · 2021-03-13T17:47:48Z

papageno
Mar 13, 2021

Hi. I am encountering this error when I use gatsby-ssr.js setHeadComponents to load TypeKit's <script> tag in Gatsby's dev mode.

gatsby-ssr.js

const React = require("react");

exports.onRenderBody = ({ setHeadComponents }) => {
  setHeadComponents([
    <script
      key="https://use.typekit.net/kmt6vix.js"
      dangerouslySetInnerHTML={{
        __html: `
            (function(d) {
                var config = {
                kitId: 'kmt6vix',
                scriptTimeout: 3000,
                async: true
                },
                h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='https://use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s)
            })(document);
        `,
      }}
    />,
  ]);
};

This error only happens on iOS Safari in Gatsby's dev mode.

TypeKit's <script> tag looks fine in <head>

I made a repo to reproduce this error.

https://github.com/papageno/gatsby-ssr-causes-unhandled-runtime-error-in-dev-mode

Please note the Typekit ID above is only for test use and will be deleted in the future.

The Gatsby Docs recommend the usage of gatsby-plugin-web-font-loader to load TypeKit fonts but the plugin seems to be deprecated.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

gatsby-ssr.js setHeadComponents Causes "Unhandled Runtime Error" in Dev Mode #30236

Uh oh!

{{title}}

Uh oh!

Replies: 0 comments

Select a reply

Uh oh!

gatsby-ssr.js setHeadComponents Causes "Unhandled Runtime Error" in Dev Mode #30236

Uh oh!

papageno Mar 13, 2021

Replies: 0 comments

papageno
Mar 13, 2021