Как смоделировать тег сценария в шутку - PullRequest
0 голосов
/ 25 сентября 2019

Я использую react-helmet, чтобы добавить тег скрипта менеджера тегов Google на определенную страницу.Это работает нормально, но jest создает исключение для объявления.

Обычно я бы использовал jest.mock, но я не могу заставить его работать, и я не могу заставить себя игнорировать эту строку кода.

   <Helmet>
          <title>{messages.title.defaultMessage}</title>
          <meta name="title" content={messages.metaTitle.defaultMessage} />
          <meta name="description" content={messages.metaDescriptions.defaultMessage} />
          <meta name="keyword" content={messages.metaKeyword.defaultMessage} />
          {/* Google Tag Manager */}
          <script id="ga-script" type="text/javascript">
            {((w, d, s, l, i) => {
              w[l] = w[l] || [];
              w[l].push({
                'gtm.start': new Date().getTime(),
                event: 'gtm.js',
              });
              const f = d.getElementsByTagName(s)[0];
              const j = d.createElement(s);
              const dl = l !== 'dataLayer' ? `&l=${l}` : '';
              j.async = true;
              j.src = `https://www.googletagmanager.com/gtm.js?id=${i}${dl}`;
              f.parentNode.insertBefore(j, f);
              f.className = 'ga-script';
              j.className = 'ga-script';
            })(window, document, 'script', 'dataLayer', 'GTM-000000')}
          </script>
          {/* End Google Tag Manager*/}
        </Helmet>
<VerificationPhonePage /> equalEmailProps › encountered a declaration exception

    TypeError: Cannot read property 'parentNode' of undefined

      296 |               j.async = true;
      297 |               j.src = `https://www.googletagmanager.com/gtm.js?id=${i}${dl}`;
    > 298 |               f.parentNode.insertBefore(j, f);
          |                 ^
      299 |               f.className = 'ga-script';
      300 |               j.className = 'ga-script';
      301 |             })(window, document, 'script', 'dataLayer', 'GTM-000000')}

1 Ответ

0 голосов
/ 25 сентября 2019

Я никогда не использовал Google Tag Manager, но этот скрипт мне кажется просто излишним в React.

Вы можете сделать это:

до возврата

const i = 'GTM-000000'
// "i" is not self descriptive, rename it
// but if the value never change, insert it directly in url

const src = `https://www.googletagmanager.com/gtm.js?id=${i}`

// the only important code in your function
window.dataLayer = window.dataLayer || []
window.dataLayer.push({
  'gtm.start': new Date().getTime(),
  event: 'gtm.js',
})

по возвращении

<Helmet>
  <script src={src} async className="ga-script" />
</Helmet>

...