diff --git a/src/__tests__/autocapture.test.ts b/src/__tests__/autocapture.test.ts index c9f0c5d62..5740bc942 100644 --- a/src/__tests__/autocapture.test.ts +++ b/src/__tests__/autocapture.test.ts @@ -1104,12 +1104,33 @@ describe('Autocapture system', () => { url_allowlist: ['https://posthog.com/test/*'], } - window!.location = new URL('https://posthog.com/test/captured') as unknown as Location + window!.location = new URL('https://posthog.com/test/matching') as unknown as Location expect(shouldCaptureDomEvent(button, e, autocapture_config)).toBe(true) - window!.location = new URL('https://posthog.com/docs/not-captured') as unknown as Location + window!.location = new URL('https://posthog.com/docs/not-matching') as unknown as Location + expect(shouldCaptureDomEvent(button, e, autocapture_config)).toBe(false) + }) + + it('not capture urls which match the url regex ignorelist', () => { + const main_el = document.createElement('some-element') + const button = document.createElement('a') + button.innerHTML = 'bla' + main_el.appendChild(button) + const e = makeMouseEvent({ + target: main_el, + composedPath: () => [button, main_el], + }) + const autocapture_config = { + url_ignorelist: ['https://posthog.com/test/*'], + } + + window!.location = new URL('https://posthog.com/test/matching') as unknown as Location + expect(shouldCaptureDomEvent(button, e, autocapture_config)).toBe(false) + + window!.location = new URL('https://posthog.com/docs/not-matching') as unknown as Location + expect(shouldCaptureDomEvent(button, e, autocapture_config)).toBe(true) }) it('an empty url regex allowlist does not match any url', () => { diff --git a/src/autocapture-utils.ts b/src/autocapture-utils.ts index 00c913359..94b85b69e 100644 --- a/src/autocapture-utils.ts +++ b/src/autocapture-utils.ts @@ -9,6 +9,11 @@ export function splitClassString(s: string): string[] { return s ? trim(s).split(/\s+/) : [] } +function checkForURLMatches(urlsList: (string | RegExp)[]): boolean { + const url = window?.location.href + return !!(url && urlsList && urlsList.some((regex) => url.match(regex))) +} + /* * Get the className of an element, accounting for edge cases where element.className is an object * @@ -201,9 +206,15 @@ export function shouldCaptureDomEvent( } if (autocaptureConfig?.url_allowlist) { - const url = window.location.href - const allowlist = autocaptureConfig.url_allowlist - if (allowlist && !allowlist.some((regex) => url.match(regex))) { + // if the current URL is not in the allow list, don't capture + if (!checkForURLMatches(autocaptureConfig.url_allowlist)) { + return false + } + } + + if (autocaptureConfig?.url_ignorelist) { + // if the current URL is in the ignore list, don't capture + if (checkForURLMatches(autocaptureConfig.url_ignorelist)) { return false } } diff --git a/src/autocapture.ts b/src/autocapture.ts index 31fb404c8..dbef30693 100644 --- a/src/autocapture.ts +++ b/src/autocapture.ts @@ -53,6 +53,7 @@ export class Autocapture { const config = isObject(this.instance.config.autocapture) ? this.instance.config.autocapture : {} // precompile the regex config.url_allowlist = config.url_allowlist?.map((url) => new RegExp(url)) + config.url_ignorelist = config.url_ignorelist?.map((url) => new RegExp(url)) return config } diff --git a/src/types.ts b/src/types.ts index cf7a7cbad..17f7f0bb5 100644 --- a/src/types.ts +++ b/src/types.ts @@ -25,9 +25,25 @@ export interface AutocaptureConfig { /** * List of URLs to allow autocapture on, can be strings to match * or regexes e.g. ['https://example.com', 'test.com/.*'] + * this is useful when you want to autocapture on specific pages only + * + * if you set both url_allowlist and url_ignorelist, + * we check the allowlist first and then the ignorelist. + * the ignorelist can override the allowlist */ url_allowlist?: (string | RegExp)[] + /** + * List of URLs to not allow autocapture on, can be strings to match + * or regexes e.g. ['https://example.com', 'test.com/.*'] + * this is useful when you want to autocapture on most pages but not some specific ones + * + * if you set both url_allowlist and url_ignorelist, + * we check the allowlist first and then the ignorelist. + * the ignorelist can override the allowlist + */ + url_ignorelist?: (string | RegExp)[] + /** * List of DOM events to allow autocapture on e.g. ['click', 'change', 'submit'] */