import { WINDOW, captureException } from '@sentry/browser';
import { addExceptionMechanism } from '@sentry/utils';
import { getActiveTransaction } from './tracing.js';

/**
 * Creates routing instrumentation for Vue Router v2, v3 and v4
 *
 * You can optionally pass in an options object with the available option:
 * * `routeLabel`: Set this to `route` to opt-out of using `route.name` for transaction names.
 *
 * @param router The Vue Router instance that is used
 */
function vueRouterInstrumentation(
  router,
  options = {},
) {
  return (
    startTransaction,
    startTransactionOnPageLoad = true,
    startTransactionOnLocationChange = true,
  ) => {
    const tags = {
      'routing.instrumentation': 'vue-router',
    };

    // We have to start the pageload transaction as early as possible (before the router's `beforeEach` hook
    // is called) to not miss child spans of the pageload.
    // We check that window & window.location exists in order to not run this code in SSR environments.
    if (startTransactionOnPageLoad && WINDOW && WINDOW.location) {
      startTransaction({
        name: WINDOW.location.pathname,
        op: 'pageload',
        origin: 'auto.pageload.vue',
        tags,
        metadata: {
          source: 'url',
        },
      });
    }

    router.onError(error =>
      captureException(error, scope => {
        scope.addEventProcessor(event => {
          addExceptionMechanism(event, { handled: false });
          return event;
        });

        return scope;
      }),
    );

    router.beforeEach((to, from, next) => {
      // According to docs we could use `from === VueRouter.START_LOCATION` but I couldnt get it working for Vue 2
      // https://router.vuejs.org/api/#router-start-location
      // https://next.router.vuejs.org/api/#start-location

      // from.name:
      // - Vue 2: null
      // - Vue 3: undefined
      // hence only '==' instead of '===', because `undefined == null` evaluates to `true`
      const isPageLoadNavigation = from.name == null && from.matched.length === 0;

      const data = {
        params: to.params,
        query: to.query,
      };

      // Determine a name for the routing transaction and where that name came from
      let transactionName = to.path;
      let transactionSource = 'url';
      if (to.name && options.routeLabel !== 'path') {
        transactionName = to.name.toString();
        transactionSource = 'custom';
      } else if (to.matched[0] && to.matched[0].path) {
        transactionName = to.matched[0].path;
        transactionSource = 'route';
      }

      if (startTransactionOnPageLoad && isPageLoadNavigation) {
        const pageloadTransaction = getActiveTransaction();
        if (pageloadTransaction) {
          if (pageloadTransaction.metadata.source !== 'custom') {
            pageloadTransaction.setName(transactionName, transactionSource);
          }
          pageloadTransaction.setData('params', data.params);
          pageloadTransaction.setData('query', data.query);
        }
      }

      if (startTransactionOnLocationChange && !isPageLoadNavigation) {
        startTransaction({
          name: transactionName,
          op: 'navigation',
          origin: 'auto.navigation.vue',
          tags,
          data,
          metadata: {
            source: transactionSource,
          },
        });
      }

      // Vue Router 4 no longer exposes the `next` function, so we need to
      // check if it's available before calling it.
      // `next` needs to be called in Vue Router 3 so that the hook is resolved.
      if (next) {
        next();
      }
    });
  };
}

export { vueRouterInstrumentation };
//# sourceMappingURL=router.js.map