diff --git a/.size-limit.js b/.size-limit.js index f21b75dd6524..d872d8dad2f9 100644 --- a/.size-limit.js +++ b/.size-limit.js @@ -66,14 +66,14 @@ module.exports = [ // This entry is only here temporarily and will be replaced once we have proper CDN bundles { name: '@sentry/replay index.js', - path: 'packages/replay/build/npm/dist/index.js', + path: 'packages/replay/build/npm/esm/index.js', gzip: true, limit: '100 KB', ignore: ['@sentry/browser', '@sentry/utils', '@sentry/core', '@sentry/types'], }, { name: '@sentry/replay - Webpack (gzipped + minified)', - path: 'packages/replay/build/npm/dist/index.js', + path: 'packages/replay/build/npm/esm/index.js', import: '{ Replay }', gzip: true, limit: '100 KB', @@ -81,7 +81,7 @@ module.exports = [ }, { name: '@sentry/replay - Webpack (minified)', - path: 'packages/replay/build/npm/dist/index.js', + path: 'packages/replay/build/npm/esm/index.js', import: '{ Replay }', gzip: false, limit: '300 KB', diff --git a/packages/replay/.eslintrc.js b/packages/replay/.eslintrc.js index 862027873dc8..96c1cc5057b5 100644 --- a/packages/replay/.eslintrc.js +++ b/packages/replay/.eslintrc.js @@ -5,21 +5,7 @@ module.exports = { extends: ['../../.eslintrc.js'], - ignorePatterns: [ - 'coverage/**', - 'build/**', - 'dist/**', - 'cjs/**', - 'esm/**', - 'examples/**', - 'test/manual/**', - 'types/**', - // TODO: Remove these after migration - 'scripts/**', - 'config/**', - 'config/**', - '__mocks__/**', - ], + ignorePatterns: ['rollup.config.worker.js'], overrides: [ { files: ['worker/**/*.ts'], diff --git a/packages/replay/.gitignore b/packages/replay/.gitignore index daed51ab3651..363d3467c6fa 100644 --- a/packages/replay/.gitignore +++ b/packages/replay/.gitignore @@ -1,5 +1,4 @@ node_modules /*.tgz .eslintcache -dist build diff --git a/packages/replay/config/rollup.config.core.ts b/packages/replay/config/rollup.config.core.ts deleted file mode 100644 index b3de8258e626..000000000000 --- a/packages/replay/config/rollup.config.core.ts +++ /dev/null @@ -1,42 +0,0 @@ -import replace from '@rollup/plugin-replace'; -import typescript from '@rollup/plugin-typescript'; -import { defineConfig } from 'rollup'; - -import pkg from '../package.json'; - -const IS_PRODUCTION = process.env.NODE_ENV === 'production'; - -const config = defineConfig({ - input: './src/index.ts', - output: [ - { - file: pkg.main, - format: 'cjs', - sourcemap: true, - }, - { - file: pkg.module, - format: 'esm', - }, - ], - external: [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})], - plugins: [ - typescript({ - tsconfig: './tsconfig.json', - }), - replace({ - // __SENTRY_DEBUG__ should be save to replace in any case, so no checks for assignments necessary - preventAssignment: false, - values: { - __SENTRY_REPLAY_VERSION__: JSON.stringify(pkg.version), - // @ts-ignore not gonna deal with types here - __SENTRY_DEBUG__: !IS_PRODUCTION, - // @ts-ignore __DEBUG_BUILD__ variable isn't yet replaced correctly at build time so - // we need to set this as true. - __DEBUG_BUILD__: true, - }, - }), - ], -}); - -export default config; diff --git a/packages/replay/package.json b/packages/replay/package.json index 2f8b3dee5189..a17f23a7fd13 100644 --- a/packages/replay/package.json +++ b/packages/replay/package.json @@ -2,22 +2,21 @@ "name": "@sentry/replay", "version": "7.22.0", "description": "User replays for Sentry", - "main": "build/npm/dist/index.js", - "module": "build/npm/dist/index.es.js", - "types": "build/npm/dist/src/index.d.ts", + "main": "build/npm/cjs/index.js", + "module": "build/npm/esm/index.js", + "types": "build/npm/types/src/index.d.ts", "sideEffects": false, "scripts": { "bootstrap": "yarn && cd demo && yarn #TODO: change after migration", - "build": "yarn build:extras", - "build:extras": "NODE_ENV=production yarn build:all", - "build:dev": "NODE_ENV=development yarn build:all", - "build:all": "run-s clean build:worker build:core", - "build:core": "yarn build:actualRollup --config config/rollup.config.core.ts", - "build:worker": "yarn build:actualRollup --config config/rollup.config.worker.ts", - "build:actualRollup": "rollup", - "build:watch": "NODE_ENV=production yarn build:all:watch", - "build:dev:watch": "NODE_ENV=development yarn build:all:watch", - "build:all:watch": "yarn clean && run-p \"build:worker --watch\" \"build:core --watch\"", + "build:rollup": "run-s build:worker build:core", + "build": "run-s build:worker && run-p build:core build:types", + "build:dev": "run-s build #TODO adjust after adding CDN bundles", + "build:worker": "rollup -c rollup.config.worker.js", + "build:core": "rollup -c rollup.npm.config.js", + "build:types": "tsc -p tsconfig.types.json", + "build:watch": "run-p \"build:worker --watch\" \"build:core --watch\" build:types:watch", + "build:dev:watch": "yarn build:watch #TODO adjust after adding CDN bundles", + "build:types:watch": "tsc -p tsconfig.types.json --watch", "build:npm": "ts-node ../../scripts/prepack.ts --bundles && npm pack ./build/npm", "circularDepCheck": "#TODO comment in after migration: madge --circular src/index.ts", "clean": "rimraf build sentry-replay-*.tgz", diff --git a/packages/replay/config/rollup.config.worker.ts b/packages/replay/rollup.config.worker.js similarity index 100% rename from packages/replay/config/rollup.config.worker.ts rename to packages/replay/rollup.config.worker.js diff --git a/packages/replay/rollup.npm.config.js b/packages/replay/rollup.npm.config.js new file mode 100644 index 000000000000..531ef96aeefa --- /dev/null +++ b/packages/replay/rollup.npm.config.js @@ -0,0 +1,28 @@ +import replace from '@rollup/plugin-replace'; + +import { makeBaseNPMConfig, makeNPMConfigVariants } from '../../rollup/index'; + +import pkg from './package.json'; + +export default makeNPMConfigVariants( + makeBaseNPMConfig({ + hasBundles: true, + packageSpecificConfig: { + external: [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})], + plugins: [ + // TODO: Remove this - replay version will be in sync w/ SDK version + replace({ + preventAssignment: true, + values: { + __SENTRY_REPLAY_VERSION__: JSON.stringify(pkg.version), + }, + }), + ], + output: { + // set exports to 'named' or 'auto' so that rollup doesn't warn about + // the default export in `worker/worker.js` + exports: 'named', + }, + }, + }), +); diff --git a/packages/replay/src/createPerformanceEntry.ts b/packages/replay/src/createPerformanceEntry.ts index 5cc8198fe600..4fbcdbf67699 100644 --- a/packages/replay/src/createPerformanceEntry.ts +++ b/packages/replay/src/createPerformanceEntry.ts @@ -2,7 +2,7 @@ import { WINDOW } from '@sentry/browser'; import { browserPerformanceTimeOrigin } from '@sentry/utils'; import { record } from 'rrweb'; -import { AllPerformanceEntry } from './types'; +import { AllPerformanceEntry, PerformanceNavigationTiming, PerformancePaintTiming } from './types'; import { isIngestHost } from './util/isIngestHost'; export interface ReplayPerformanceEntry { diff --git a/packages/replay/src/types.ts b/packages/replay/src/types.ts index b282894eaa33..ec9cda8db1c6 100644 --- a/packages/replay/src/types.ts +++ b/packages/replay/src/types.ts @@ -35,14 +35,16 @@ export interface WorkerRequest { declare global { const __SENTRY_REPLAY_VERSION__: string; - - // PerformancePaintTiming is only available since TS 4.4, so for now we just define this here - // see: https://github.com/microsoft/TypeScript/blob/main/lib/lib.dom.d.ts#L10564 - type PerformancePaintTiming = PerformanceEntry; - // @ts-ignore declare again, this _should_ be there but somehow is not available in worker context - type PerformanceNavigationTiming = PerformanceEntry; } +// PerformancePaintTiming and PerformanceNavigationTiming are only available with TS 4.4 and newer +// Therefore, we're exporting them here to make them available in older TS versions +export type PerformancePaintTiming = PerformanceEntry; +export type PerformanceNavigationTiming = PerformanceEntry & { + type: string; + transferSize: number; + domComplete: number; +}; /** * The response from the worker */ diff --git a/packages/replay/src/util/dedupePerformanceEntries.ts b/packages/replay/src/util/dedupePerformanceEntries.ts index 22ac369e90a2..17933710c91f 100644 --- a/packages/replay/src/util/dedupePerformanceEntries.ts +++ b/packages/replay/src/util/dedupePerformanceEntries.ts @@ -1,3 +1,5 @@ +import type { PerformanceNavigationTiming, PerformancePaintTiming } from '../types'; + const NAVIGATION_ENTRY_KEYS: Array = [ 'name', 'type', diff --git a/packages/replay/test/fixtures/performanceEntry/lcp.ts b/packages/replay/test/fixtures/performanceEntry/lcp.ts index 2f14236d4268..761e75d56e8f 100644 --- a/packages/replay/test/fixtures/performanceEntry/lcp.ts +++ b/packages/replay/test/fixtures/performanceEntry/lcp.ts @@ -1,3 +1,5 @@ +import { PerformancePaintTiming } from '../../../src/types'; + export function PerformanceEntryLcp(obj?: Partial): PerformancePaintTiming { const entry = { name: '', diff --git a/packages/replay/test/fixtures/performanceEntry/navigation.ts b/packages/replay/test/fixtures/performanceEntry/navigation.ts index 6cd4bec85dff..7de16e9aaf98 100644 --- a/packages/replay/test/fixtures/performanceEntry/navigation.ts +++ b/packages/replay/test/fixtures/performanceEntry/navigation.ts @@ -1,3 +1,5 @@ +import type { PerformanceNavigationTiming } from '../../../src/types'; + export function PerformanceEntryNavigation(obj?: Partial): PerformanceNavigationTiming { const entry = { name: 'https://sentry.io/organizations/sentry/discover/', diff --git a/packages/replay/tsconfig.json b/packages/replay/tsconfig.json index b40ac1d70bfd..7e05c4fa3aef 100644 --- a/packages/replay/tsconfig.json +++ b/packages/replay/tsconfig.json @@ -16,9 +16,7 @@ "allowJs": true, "declaration": true, "declarationMap": true, - "declarationDir": "./types", - "strictNullChecks": true, - "outDir": "./build/npm/dist" + "strictNullChecks": true }, "include": ["src/**/*.ts"], "exclude": ["node_modules"] diff --git a/packages/replay/tsconfig.types.json b/packages/replay/tsconfig.types.json new file mode 100644 index 000000000000..374fd9bc9364 --- /dev/null +++ b/packages/replay/tsconfig.types.json @@ -0,0 +1,10 @@ +{ + "extends": "./tsconfig.json", + + "compilerOptions": { + "declaration": true, + "declarationMap": true, + "emitDeclarationOnly": true, + "outDir": "build/npm/types" + } +}