[RUMF-937] create the rum-slim package (#935)

* [RUMF-937] create the rum-slim package

* [RUMF-937] add rum-slim to the sandbox

* ✅ run some e2e tests using rum-slim

* remove ProvidedSource export

* ✅ do not run rum-slim with a npm setup

.eslintrc.js

@@ -252,7 +252,7 @@ module.exports = {
       },
     },
     {
-      files: ['packages/{rum,logs,rum-recorder}/src/index.ts', 'packages/rum-recorder/src/internal.ts'],
+      files: ['packages/{rum,logs,rum-recorder,rum-slim}/src/index.ts', 'packages/rum-recorder/src/internal.ts'],
       rules: {
         'local-rules/disallow-enum-exports': 'error',
       },

README.md

@@ -10,9 +10,10 @@ This repository contains several packages:
 | -------------------- | ------------------------ | ------------------------ | -------------------------- | ----------------------------------- |
 | browser-logs         | [![npm version][01]][02] | [![bundle size][03]][04] | [datadog-logs][05]         | [![API][1]][07] [![product][2]][08] |
 | browser-rum          | [![npm version][11]][12] | [![bundle size][13]][14] | [datadog-rum][15]          | [![API][1]][17] [![product][2]][18] |
-| browser-rum-recorder | [![npm version][21]][22] | [![bundle size][23]][24] | [datadog-rum-recorder][25] | [![API][1]][27] [![product][2]][28] |
-| browser-rum-core     | [![npm version][41]][42] | [![bundle size][43]][44] |                            |
-| browser-core         | [![npm version][31]][32] | [![bundle size][33]][34] |                            |
+| browser-rum-slim     | [![npm version][21]][22] | [![bundle size][23]][24] | [datadog-rum-slim][25]     | [![API][1]][27] [![product][2]][28] |
+| browser-rum-recorder | [![npm version][31]][32] | [![bundle size][33]][34] | [datadog-rum-recorder][35] | [![API][1]][37] [![product][2]][38] |
+| browser-rum-core     | [![npm version][51]][52] | [![bundle size][53]][54] |                            |
+| browser-core         | [![npm version][41]][42] | [![bundle size][43]][44] |                            |
 
 [1]: https://github.githubassets.com/favicons/favicon.png
 [2]: https://imgix.datadoghq.com/img/favicons/favicon-32x32.png
@@ -30,18 +31,25 @@ This repository contains several packages:
 [15]: https://www.datadoghq-browser-agent.com/datadog-rum.js
 [17]: ./packages/rum/README.md
 [18]: https://docs.datadoghq.com/real_user_monitoring/
-[21]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-recorder.svg
-[22]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-recorder
-[23]: https://badgen.net/bundlephobia/minzip/@datadog/browser-rum-recorder
-[24]: https://bundlephobia.com/result?p=@datadog/browser-rum-recorder
-[25]: https://www.datadoghq-browser-agent.com/datadog-rum-recorder.js
-[27]: ./packages/rum-recorder/README.md
+[21]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-slim.svg
+[22]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-slim
+[23]: https://badgen.net/bundlephobia/minzip/@datadog/browser-rum-slim
+[24]: https://bundlephobia.com/result?p=@datadog/browser-rum-slim
+[25]: https://www.datadoghq-browser-agent.com/datadog-rum-slim.js
+[27]: ./packages/rum-slim/README.md
 [28]: https://docs.datadoghq.com/real_user_monitoring/
-[31]: https://badge.fury.io/js/%40datadog%2Fbrowser-core.svg
-[32]: https://badge.fury.io/js/%40datadog%2Fbrowser-core
-[33]: https://badgen.net/bundlephobia/minzip/@datadog/browser-core
-[34]: https://bundlephobia.com/result?p=@datadog/browser-core
-[41]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-core.svg
-[42]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-core
-[43]: https://badgen.net/bundlephobia/minzip/@datadog/browser-rum-core
-[44]: https://bundlephobia.com/result?p=@datadog/browser-rum-core
+[31]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-recorder.svg
+[32]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-recorder
+[33]: https://badgen.net/bundlephobia/minzip/@datadog/browser-rum-recorder
+[34]: https://bundlephobia.com/result?p=@datadog/browser-rum-recorder
+[35]: https://www.datadoghq-browser-agent.com/datadog-rum-recorder.js
+[37]: ./packages/rum-recorder/README.md
+[38]: https://docs.datadoghq.com/real_user_monitoring/
+[41]: https://badge.fury.io/js/%40datadog%2Fbrowser-core.svg
+[42]: https://badge.fury.io/js/%40datadog%2Fbrowser-core
+[43]: https://badgen.net/bundlephobia/minzip/@datadog/browser-core
+[44]: https://bundlephobia.com/result?p=@datadog/browser-core
+[51]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-core.svg
+[52]: https://badge.fury.io/js/%40datadog%2Fbrowser-rum-core
+[53]: https://badgen.net/bundlephobia/minzip/@datadog/browser-rum-core
+[54]: https://bundlephobia.com/result?p=@datadog/browser-rum-core

eslint-local-rules/disallowSideEffects.js

@@ -32,6 +32,8 @@ const pathsWithSideEffect = new Set([
   `${packagesRoot}/rum-recorder/src/index.ts`,
   `${packagesRoot}/rum/src/boot/rum.entry.ts`,
   `${packagesRoot}/rum/src/index.ts`,
+  `${packagesRoot}/rum-slim/src/boot/rumSlim.entry.ts`,
+  `${packagesRoot}/rum-slim/src/index.ts`,
 ])
 
 // Those packages are known to have no side effects when evaluated

packages/rum-slim/.npmignore

@@ -0,0 +1,5 @@
+*
+!/bundle/datadog-rum.js
+!/cjs/**/*
+!/esm/**/*
+!/src/**/*

packages/rum-slim/.yarnrc

@@ -0,0 +1,2 @@
+save-exact true
+

packages/rum-slim/BROWSER_SUPPORT.md

@@ -0,0 +1 @@
+../rum/BROWSER_SUPPORT.md

packages/rum-slim/README.md

@@ -0,0 +1,10 @@
+# RUM Browser Monitoring - slim package
+
+## Overview
+
+This package is equivalent to the [RUM package](../rum), but without support for Session Replay
+recording.
+
+## Setup
+
+See the [RUM package](../rum/README.md) documentation.

packages/rum-slim/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@datadog/browser-rum-slim",
+  "version": "2.17.0",
+  "license": "Apache-2.0",
+  "main": "cjs/index.js",
+  "module": "esm/index.js",
+  "types": "cjs/index.d.ts",
+  "scripts": {
+    "build": "run-p build:cjs build:esm build:bundle",
+    "build:bundle": "rm -rf bundle && webpack --mode=production",
+    "build:cjs": "rm -rf cjs && tsc -p tsconfig.cjs.json",
+    "build:esm": "rm -rf esm && tsc -p tsconfig.esm.json"
+  },
+  "dependencies": {
+    "@datadog/browser-core": "2.17.0",
+    "@datadog/browser-rum-core": "2.17.0",
+    "tslib": "^1.10.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/DataDog/browser-sdk.git",
+    "directory": "packages/rum-slim"
+  }
+}

packages/rum-slim/src/boot/rumSlim.entry.ts

@@ -0,0 +1,9 @@
+import { defineGlobal, getGlobalObject } from '@datadog/browser-core'
+import { makeRumPublicApi, RumPublicApi, startRum } from '@datadog/browser-rum-core'
+
+export const datadogRum = makeRumPublicApi(startRum)
+
+interface BrowserWindow extends Window {
+  DD_RUM?: RumPublicApi
+}
+defineGlobal(getGlobalObject<BrowserWindow>(), 'DD_RUM', datadogRum)

packages/rum-slim/src/index.ts

@@ -0,0 +1,24 @@
+// Keep the following in sync with packages/rum/src/index.ts
+export { datadogRum } from './boot/rumSlim.entry'
+export {
+  CommonProperties,
+  RumPublicApi as RumGlobal,
+  RumInitConfiguration,
+  RumUserConfiguration,
+  // Events
+  RumEvent,
+  RumActionEvent,
+  RumErrorEvent,
+  RumLongTaskEvent,
+  RumResourceEvent,
+  RumViewEvent,
+  // Events context
+  RumEventDomainContext,
+  RumViewEventDomainContext,
+  RumErrorEventDomainContext,
+  RumActionEventDomainContext,
+  RumFetchResourceEventDomainContext,
+  RumXhrResourceEventDomainContext,
+  RumOtherResourceEventDomainContext,
+  RumLongTaskEventDomainContext,
+} from '@datadog/browser-rum-core'

packages/rum-slim/tsconfig.cjs.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "declaration": true,
+    "module": "commonjs",
+    "outDir": "./cjs/"
+  },
+  "include": ["./src/**/*.ts"],
+  "exclude": ["./src/**/*.spec.ts"]
+}

packages/rum-slim/tsconfig.esm.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "declaration": true,
+    "module": "es6",
+    "outDir": "./esm/"
+  },
+  "include": ["./src/**/*.ts"],
+  "exclude": ["./src/**/*.spec.ts"]
+}

packages/rum-slim/webpack.config.js

@@ -0,0 +1,9 @@
+const path = require('path')
+
+const webpackBase = require('../../webpack.base')
+
+const entry = path.resolve(__dirname, 'src/boot/rumSlim.entry.ts')
+
+module.exports = (_env, argv) => [
+  webpackBase({ mode: argv.mode, entry, datacenter: 'us', filename: 'datadog-rum-slim.js' }),
+]

scripts/deploy.sh

@@ -28,6 +28,7 @@ case "${suffix}" in
 v[0-9]*) # if major version also update legacy files
     declare -A BUNDLES=(
       ["datadog-rum-${suffix}.js"]="packages/rum/bundle/datadog-rum.js"
+      ["datadog-rum-slim-${suffix}.js"]="packages/rum-slim/bundle/datadog-rum-slim.js"
       ["datadog-rum-recorder-${suffix}.js"]="packages/rum-recorder/bundle/datadog-rum-recorder.js"
       ["datadog-rum.js"]="packages/rum/bundle/datadog-rum.js" # deprecated: to remove with version 3
       ["datadog-rum-recorder.js"]="packages/rum-recorder/bundle/datadog-rum-recorder.js" # deprecated: to remove with version 3
@@ -43,6 +44,7 @@ v[0-9]*) # if major version also update legacy files
     declare -A BUNDLES=(
       ["datadog-logs-${suffix}.js"]="packages/logs/bundle/datadog-logs.js"
       ["datadog-rum-${suffix}.js"]="packages/rum/bundle/datadog-rum.js"
+      ["datadog-rum-slim-${suffix}.js"]="packages/rum-slim/bundle/datadog-rum-slim.js"
       ["datadog-rum-recorder-${suffix}.js"]="packages/rum-recorder/bundle/datadog-rum-recorder.js"
     )
     CACHE_CONTROL='max-age=900, s-maxage=60'

scripts/dev-server.js

@@ -4,13 +4,14 @@ const middleware = require('webpack-dev-middleware')
 const webpack = require('webpack')
 
 const logsConfig = require('../packages/logs/webpack.config')
+const rumSlimConfig = require('../packages/rum-slim/webpack.config')
 const rumConfig = require('../packages/rum/webpack.config')
 const rumRecorderConfig = require('../packages/rum-recorder/webpack.config')
 
 const app = express()
 
 app.use(express.static(path.join(__dirname, '../sandbox')))
-for (const config of [rumConfig, logsConfig, rumRecorderConfig]) {
+for (const config of [rumConfig, logsConfig, rumSlimConfig, rumRecorderConfig]) {
   app.use(middleware(webpack(config(null, { mode: 'development' }))))
 }
 

test/e2e/lib/framework/createTest.ts

@@ -7,7 +7,7 @@ import { validateFormat } from '../helpers/validation'
 import { EventRegistry } from './eventsRegistry'
 import { getTestServers, Servers, waitForServersIdle } from './httpServers'
 import { log } from './logger'
-import { DEFAULT_SETUPS, SetupFactory, SetupOptions } from './pageSetups'
+import { DEFAULT_SETUPS, npmSetup, SetupFactory, SetupOptions } from './pageSetups'
 import { Endpoints } from './sdkBuilds'
 import { createIntakeServerApp } from './serverApps/intake'
 import { createMockServerApp } from './serverApps/mock'
@@ -37,6 +37,7 @@ type TestRunner = (testContext: TestContext) => Promise<void>
 
 class TestBuilder {
   private rumConfiguration: RumInitConfiguration | undefined = undefined
+  private alsoRunWithRumSlim = false
   private rumRecorderConfiguration: RumRecorderInitConfiguration | undefined = undefined
   private logsConfiguration: LogsInitConfiguration | undefined = undefined
   private head = ''
@@ -50,6 +51,11 @@ class TestBuilder {
     return this
   }
 
+  withRumSlim() {
+    this.alsoRunWithRumSlim = true
+    return this
+  }
+
   withRumRecorder(rumRecorderInitConfiguration?: Partial<RumRecorderInitConfiguration>) {
     this.rumRecorderConfiguration = { ...DEFAULT_RUM_CONFIGURATION, ...rumRecorderInitConfiguration }
     return this
@@ -93,16 +99,21 @@ class TestBuilder {
       rum: this.rumConfiguration,
       rumInit: this.rumInit,
       rumRecorder: this.rumRecorderConfiguration,
+      useRumSlim: false,
     }
 
-    if (setups.length > 1) {
+    if (this.alsoRunWithRumSlim) {
       describe(this.title, () => {
-        for (const { name, factory } of setups) {
-          declareTest(name!, factory(setupOptions), runner)
-        }
+        declareTestsForSetups('rum', setups, setupOptions, runner)
+        declareTestsForSetups(
+          'rum-slim',
+          setups.filter((setup) => setup.factory !== npmSetup),
+          { ...setupOptions, useRumSlim: true },
+          runner
+        )
       })
     } else {
-      declareTest(this.title, setups[0].factory(setupOptions), runner)
+      declareTestsForSetups(this.title, setups, setupOptions, runner)
     }
   }
 
@@ -116,6 +127,23 @@ interface ItResult {
 }
 declare function it(expectation: string, assertion?: jasmine.ImplementationCallback, timeout?: number): ItResult
 
+function declareTestsForSetups(
+  title: string,
+  setups: Array<{ factory: SetupFactory; name?: string }>,
+  setupOptions: SetupOptions,
+  runner: TestRunner
+) {
+  if (setups.length > 1) {
+    describe(title, () => {
+      for (const { name, factory } of setups) {
+        declareTest(name!, factory(setupOptions), runner)
+      }
+    })
+  } else {
+    declareTest(title, setups[0].factory(setupOptions), runner)
+  }
+}
+
 function declareTest(title: string, setup: string, runner: TestRunner) {
   const spec = it(title, async () => {
     log(`Start '${spec.getFullName()}' in ${getBrowserName()!}`)

test/e2e/lib/framework/pageSetups.ts

@@ -4,6 +4,7 @@ import { RumRecorderInitConfiguration } from '@datadog/browser-rum-recorder'
 
 export interface SetupOptions {
   rum?: RumInitConfiguration
+  useRumSlim: boolean
   rumRecorder?: RumRecorderInitConfiguration
   logs?: LogsInitConfiguration
   rumInit: (initConfiguration: RumInitConfiguration) => void
@@ -51,7 +52,14 @@ n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
   if (rumConfiguration) {
     body += html`
       <script type="text/javascript">
-        ${formatSnippet(options.rumRecorder ? './datadog-rum-recorder.js' : './datadog-rum.js', 'DD_RUM')}
+        ${formatSnippet(
+          options.rumRecorder
+            ? './datadog-rum-recorder.js'
+            : options.useRumSlim
+            ? './datadog-rum-slim.js'
+            : './datadog-rum.js',
+          'DD_RUM'
+        )}
         DD_RUM.onReady(function () {
           ;(${options.rumInit.toString()})(${formatRumConfiguration(rumConfiguration)})
         })
@@ -82,7 +90,11 @@ export function bundleSetup(options: SetupOptions) {
     header += html`
       <script
         type="text/javascript"
-        src="${options.rumRecorder ? './datadog-rum-recorder.js' : './datadog-rum.js'}"
+        src="${options.rumRecorder
+          ? './datadog-rum-recorder.js'
+          : options.useRumSlim
+          ? './datadog-rum-slim.js'
+          : './datadog-rum.js'}"
       ></script>
       <script type="text/javascript">
         ;(${options.rumInit.toString()})(${formatRumConfiguration(rumConfiguration)})

test/e2e/lib/framework/sdkBuilds.ts

@@ -6,6 +6,7 @@ const readFile = promisify(fs.readFile)
 
 const ROOT = path.join(__dirname, '../../../..')
 const RUM_BUNDLE = path.join(ROOT, 'packages/rum/bundle/datadog-rum.js')
+const RUM_SLIM_BUNDLE = path.join(ROOT, 'packages/rum-slim/bundle/datadog-rum-slim.js')
 const LOGS_BUNDLE = path.join(ROOT, 'packages/logs/bundle/datadog-logs.js')
 const RUM_RECORDER_BUNDLE = path.join(ROOT, 'packages/rum-recorder/bundle/datadog-rum-recorder.js')
 const NPM_BUNDLE = path.join(ROOT, 'test/app/dist/app.js')
@@ -21,6 +22,10 @@ export async function buildRum(endpoints: Endpoints) {
   return replaceEndpoints(await readFile(RUM_BUNDLE), endpoints)
 }
 
+export async function buildRumSlim(endpoints: Endpoints) {
+  return replaceEndpoints(await readFile(RUM_SLIM_BUNDLE), endpoints)
+}
+
 export async function buildRumRecorder(endpoints: Endpoints) {
   return replaceEndpoints(await readFile(RUM_RECORDER_BUNDLE), endpoints)
 }

test/e2e/lib/framework/serverApps/mock.ts

@@ -1,7 +1,7 @@
 import * as url from 'url'
 import cors from 'cors'
 import express from 'express'
-import { buildLogs, buildNpm, buildRum, buildRumRecorder, Endpoints } from '../sdkBuilds'
+import { buildLogs, buildNpm, buildRum, buildRumSlim, buildRumRecorder, Endpoints } from '../sdkBuilds'
 
 export function createMockServerApp(endpoints: Endpoints, setup: string) {
   const app = express()
@@ -59,6 +59,10 @@ export function createMockServerApp(endpoints: Endpoints, setup: string) {
     res.header('content-type', 'application/javascript').send(await buildRum(endpoints))
   })
 
+  app.get('/datadog-rum-slim.js', async (_req, res) => {
+    res.header('content-type', 'application/javascript').send(await buildRumSlim(endpoints))
+  })
+
   app.get('/datadog-rum-recorder.js', async (_req, res) => {
     res.header('content-type', 'application/javascript').send(await buildRumRecorder(endpoints))
   })