File size: 4,827 Bytes
6778ee0
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
import { initializePageDynamically } from './support/initialize-page-dynamically'
import {
  e,
  expectPlausibleInAction,
  hideAndShowCurrentTab,
  isEngagementEvent,
  switchByMode,
  tracker_script_version
} from './support/test-utils'
import { test } from '@playwright/test'
import { ScriptConfig } from './support/types'
import { LOCAL_SERVER_ADDR } from './support/server'

const DEFAULT_CONFIG: ScriptConfig = {
  domain: 'example.com',
  endpoint: `${LOCAL_SERVER_ADDR}/api/event`,
  captureOnLocalhost: true
}

for (const mode of ['web', 'esm']) {
  test.describe(`"autoCapturePageviews" v2 config option (${mode})`, () => {
    test('if autoCapturePageviews is not explicitly set, it is treated as true and a pageview is sent on navigating to page, engagement tracking is triggered', async ({
      page
    }, { testId }) => {
      const config = { ...DEFAULT_CONFIG }
      const { url } = await initializePageDynamically(page, {
        testId,
        scriptConfig: switchByMode(
          {
            web: config,
            esm: `<script type="module">import { init, track } from '/tracker/js/npm_package/plausible.js'; init(${JSON.stringify(
              config
            )})</script>`
          },
          mode
        ),
        bodyContent: 'hello world'
      })

      await expectPlausibleInAction(page, {
        action: async () => {
          await page.goto(url)
          await hideAndShowCurrentTab(page, { delay: 200 })
        },
        expectedRequests: [
          {
            n: 'pageview',
            d: config.domain,
            u: `${LOCAL_SERVER_ADDR}${url}`,
            v: tracker_script_version,
            p: e.toBeUndefined()
          },
          {
            n: 'engagement',
            d: config.domain,
            u: `${LOCAL_SERVER_ADDR}${url}`,
            v: tracker_script_version,
            p: e.toBeUndefined()
          }
        ]
      })
    })

    test('if autoCapturePageviews is explicitly set to false, a pageview is not sent on navigating to page, but sending pageviews manually works and it starts engagement tracking logic', async ({
      page
    }, { testId }) => {
      const config = { ...DEFAULT_CONFIG, autoCapturePageviews: false }
      const { url } = await initializePageDynamically(page, {
        testId,
        scriptConfig: switchByMode(
          {
            web: config,
            esm: `<script type="module">import { init, track } from '/tracker/js/npm_package/plausible.js'; init(${JSON.stringify(
              config
            )});</script>`
          },
          mode
        ),
        bodyContent: /* HTML */ `
          <a
            id="alfa"
            onclick="window.plausible('pageview', { u: '/:masked/alfa' })"
            href="#"
            >A</a
          >
          <a
            id="beta"
            onclick="window.plausible('pageview', { url: '/:masked/beta' })"
            href="#"
            >B</a
          >
        `
      })

      await expectPlausibleInAction(page, {
        action: () => page.goto(url),
        refutedRequests: [{ n: 'pageview' }, { n: 'engagement' }]
      })

      await expectPlausibleInAction(page, {
        action: async () => {
          await page.click('#alfa')
          await page.click('#beta')
          await hideAndShowCurrentTab(page, { delay: 200 })
        },
        expectedRequests: [
          { n: 'pageview', u: '/:masked/alfa', d: config.domain },
          { n: 'engagement', u: '/:masked/alfa', d: config.domain },
          { n: 'pageview', u: '/:masked/beta', d: config.domain },
          { n: 'engagement', u: '/:masked/beta', d: config.domain }
        ]
      })
    })
  })
}

for (const mode of ['legacy', 'web', 'esm']) {
  test.describe(`pageviews parity legacy/v2 (${mode})`, () => {
    test('sends pageview on navigating to page', async ({ page }, {
      testId
    }) => {
      const { url } = await initializePageDynamically(page, {
        testId,
        scriptConfig: switchByMode(
          {
            web: DEFAULT_CONFIG,
            esm: `<script type="module">import { init, track } from '/tracker/js/npm_package/plausible.js'; init(${JSON.stringify(
              DEFAULT_CONFIG
            )})</script>`,
            legacy: `<script data-domain="${DEFAULT_CONFIG.domain}" async src="/tracker/js/plausible.local.js"></script>`
          },
          mode
        ),
        bodyContent: ''
      })

      await expectPlausibleInAction(page, {
        action: () => page.goto(url),
        expectedRequests: [
          {
            n: 'pageview',
            d: DEFAULT_CONFIG.domain,
            u: `${LOCAL_SERVER_ADDR}${url}`,
            v: tracker_script_version,
            h: e.toBeUndefined()
          }
        ],
        shouldIgnoreRequest: [isEngagementEvent]
      })
    })
  })
}