sentry-javascript/dev-packages/e2e-tests/test-applications/solidstart-dynamic-import/tests/performance.client.test.ts at bf682c8a96233f1e12b18e7d222665f12460fc92 · getsentry/sentry-javascript · GitHub

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
import { expect, test } from '@playwright/test';
import { waitForTransaction } from '@sentry-internal/test-utils';

test('sends a pageload transaction', async ({ page }) => {
  const transactionPromise = waitForTransaction('solidstart-dynamic-import', async transactionEvent => {
    return transactionEvent?.transaction === '/' && transactionEvent.contexts?.trace?.op === 'pageload';
  });

  await page.goto('/');
  const pageloadTransaction = await transactionPromise;

  expect(pageloadTransaction).toMatchObject({
    contexts: {
      trace: {
        op: 'pageload',
        origin: 'auto.pageload.browser',
      },
    },
    transaction: '/',
    transaction_info: {
      source: 'route',
    },
  });
});

test('sends a navigation transaction with parametrized route', async ({ page }) => {
  const transactionPromise = waitForTransaction('solidstart-dynamic-import', async transactionEvent => {
    return transactionEvent?.transaction === '/users/:id' && transactionEvent.contexts?.trace?.op === 'navigation';
  });

  await page.goto(`/`);
  await page.locator('#navLink').click();
  const navigationTransaction = await transactionPromise;

  expect(navigationTransaction).toMatchObject({
    contexts: {
      trace: {
        op: 'navigation',
        origin: 'auto.navigation.solidstart.solidrouter',
      },
    },
    transaction: '/users/:id',
    transaction_info: {
      source: 'route',
    },
  });
});

test('updates the transaction when using the back button', async ({ page }) => {
  // Solid Router sends a `-1` navigation when using the back button.
  // The sentry solidRouterBrowserTracingIntegration tries to update such
  // transactions with the proper name once the `useLocation` hook triggers.
  const navigationTxnPromise = waitForTransaction('solidstart-dynamic-import', async transactionEvent => {
    return transactionEvent?.transaction === '/users/:id' && transactionEvent.contexts?.trace?.op === 'navigation';
  });

  await page.goto(`/back-navigation`);
  await page.locator('#navLink').click();
  const navigationTxn = await navigationTxnPromise;

  expect(navigationTxn).toMatchObject({
    contexts: {
      trace: {
        op: 'navigation',
        origin: 'auto.navigation.solidstart.solidrouter',
      },
    },
    transaction: '/users/:id',
    transaction_info: {
      source: 'route',
    },
  });

  const backNavigationTxnPromise = waitForTransaction('solidstart-dynamic-import', async transactionEvent => {
    return (
      transactionEvent?.transaction === '/back-navigation' && transactionEvent.contexts?.trace?.op === 'navigation'
    );
  });

  await page.goBack();
  const backNavigationTxn = await backNavigationTxnPromise;

  expect(backNavigationTxn).toMatchObject({
    contexts: {
      trace: {
        op: 'navigation',
        origin: 'auto.navigation.solidstart.solidrouter',
      },
    },
    transaction: '/back-navigation',
    transaction_info: {
      source: 'route',
    },
  });
});