MSIE Blocker Script (Gatsby)

gatsby-ssr.js

exports.onPreRenderHTML = ({ getHeadComponents, replaceHeadComponents }) => {
  const headComponents = getHeadComponents();

  // Show a blocking message on MSIE
  // (documentMode is an IE-only property, versions 8-11)
  // (dangerouslySetInnerHTML keeps the script string unescaped)
  headComponents.push(
    <script
      key="block-msie"
      type="text/javascript"
      dangerouslySetInnerHTML={{
        __html: `if (typeof window !== 'undefined' && window.document.documentMode) window.onload = function() { document.body.innerHTML = 'Internet Explorer is no longer supported.<br /><br />Please visit this site on Edge or Chrome.'; document.body.style.cssText = 'text-align: center; padding-top: 40vh; font-family: Sans-Serif;'; }`,
      }}
    />,
  );

  replaceHeadComponents(headComponents);
};