Mixpanel макет постоянно возвращается как неопределенный - PullRequest
Новая
       57

Mixpanel макет постоянно возвращается как неопределенный

0 голосов
/ 15 апреля 2020

У меня очень простое c stati c приложение, в котором есть бизнес-логика c для перенаправления пользователя в зависимости от того, какой элемент он щелкает в пользовательском интерфейсе. Я добавил Mixpanel и отслеживаю событие до того, как пользователь будет перенаправлен. Я пытаюсь создать тесты, используя среду тестирования Jest, но у меня возникают трудности с насмешкой при вызове метода track на mixpanel.

Суть проблемы в том, что я не могу смоделировать mixpanel во время выполнения тестов. Я прочитал документацию Jest и искал в сообществе ответы, но каждый раз, когда я запускаю тесты, происходит сбой с TypeError: Невозможно прочитать свойство 'track' из неопределенного . Вы должны простить меня, если это что-то очевидно, JavaScript не является моим родным языком программирования, поэтому, когда приходит время создавать тесты, я в этом зациклен. :)

index. html

<!doctype html>
<html class="no-js" lang="">
<head>
  <!-- start Mixpanel -->
  <script type="text/javascript">...Mixpanel script</script>

  <script src="js/scripts.js"></script>

  <script type="text/javascript">
    const { sources } = window.parseSourcesFromURL(window.location.href)
    const sourceObj = window.convertToObj(sources)
    mixpanel.track("Page View", sourceObj)
  </script>
  <!-- end Mixpanel -->
</head>
<body>
  <div>
    <div class="age-links">
      <button onClick=redirectFunc(true)>YES</button>
      <button onClick=redirectFunc(false)>NO</button>
    </div>
  </div>
</body>
</html>

js / scripts. js

(function() {
  const convertToObj = () => ...
  const getTrackingData = () => ...
  const parseSourcesFromURL = () => ...

  const redirectFunc = (p) => {
    const { sources, link1, link2 } = parseSourcesFromURL(window.location.href)
    const redirect = `${p ? link1 : link2}?${sources.join('&')}`

    const mixpanelTrackingData = getTrackingData(sources, p, redirect)

    mixpanel.track('Button Clicked', mixpanelTrackingData, () => {
      window.location.href = redirect;
    })
  }

  if (typeof module !== 'undefined' && typeof module.exports !== 'undefined')
    module.exports = {
      ....
    };
  else
    window.utmSourcesToObject = utmSourcesToObject;
    window.parseReferrerForLinksAndUTM = parseReferrerForLinksAndUTM;
    window.redirectBasedOnAge = redirectBasedOnAge;
})();

js / scripts.test. js

const { redirectFunc, parseSourcesFromURL } = require('./js/scripts')

const testURL = 'https://test.com/'

describe('parseReferrerForLinksAndUTM', () => {
  beforeEach(() => {
      global.window = Object.create(window)

      Object.defineProperty(window, 'location', {
        value: { href: testURL },
        writable: true
      })

      ### THIS DOESNT WORK ###
      Object.defineProperty(window, 'mixpanel', {
        track: jest.fn()
      })
  })

  const { sources, link1, link2 } = parseSourcesFromURL(testURL)

  test('redirect link is correct', () => {
    ### THIS DOESNT WORK ###
    global.mixpanel = Object.create({})
    global.mixpanel.track = jest.fn()

    expect(link1).toBe('https://link1.com')
  })
})
...