Add screen tracking plugin and add support for browser plugins (#1394)

api-docs/docs/react-native-tracker/markdown/react-native-tracker.newtracker.md

@@ -9,14 +9,14 @@ Creates a new tracker instance with the given configuration
 <b>Signature:</b>
 
 ```typescript
-export declare function newTracker(configuration: TrackerConfiguration & EmitterConfiguration & SessionConfiguration & SubjectConfiguration & EventStoreConfiguration): Promise<ReactNativeTracker>;
+export declare function newTracker(configuration: TrackerConfiguration & EmitterConfiguration & SessionConfiguration & SubjectConfiguration & EventStoreConfiguration & ScreenTrackingConfiguration): Promise<ReactNativeTracker>;
 ```
 
 ## Parameters
 
 |  Parameter | Type | Description |
 |  --- | --- | --- |
-|  configuration | [TrackerConfiguration](./react-native-tracker.trackerconfiguration.md) &amp; EmitterConfiguration &amp; [SessionConfiguration](./react-native-tracker.sessionconfiguration.md) &amp; [SubjectConfiguration](./react-native-tracker.subjectconfiguration.md) &amp; [EventStoreConfiguration](./react-native-tracker.eventstoreconfiguration.md) | Configuration for the tracker |
+|  configuration | [TrackerConfiguration](./react-native-tracker.trackerconfiguration.md) &amp; EmitterConfiguration &amp; [SessionConfiguration](./react-native-tracker.sessionconfiguration.md) &amp; [SubjectConfiguration](./react-native-tracker.subjectconfiguration.md) &amp; [EventStoreConfiguration](./react-native-tracker.eventstoreconfiguration.md) &amp; ScreenTrackingConfiguration | Configuration for the tracker |
 
 <b>Returns:</b>
 

api-docs/docs/react-native-tracker/markdown/react-native-tracker.reactnativetracker.md

@@ -10,15 +10,19 @@ The ReactNativeTracker type
 
 ```typescript
 export declare type ReactNativeTracker = {
+    namespace: string;
     readonly trackSelfDescribingEvent: <T extends Record<string, unknown> = Record<string, unknown>>(argmap: SelfDescribingJson<T>, contexts?: EventContext[]) => void;
+    readonly trackScreenViewEvent: (argmap: ScreenViewProps, contexts?: EventContext[]) => void;
+    readonly trackScrollChangedEvent: (argmap: ScrollChangedProps, contexts?: EventContext[]) => void;
+    readonly trackListItemViewEvent: (argmap: ListItemViewProps, contexts?: EventContext[]) => void;
     readonly trackStructuredEvent: (argmap: StructuredEvent, contexts?: EventContext[]) => void;
     readonly trackPageViewEvent: (argmap: PageViewEvent, contexts?: EventContext[]) => void;
     readonly trackTimingEvent: (argmap: TimingProps, contexts?: EventContext[]) => void;
     readonly trackMessageNotificationEvent: (argmap: MessageNotificationProps, contexts?: EventContext[]) => void;
     addGlobalContexts(contexts: Array<ConditionalContextProvider | ContextPrimitive> | Record<string, ConditionalContextProvider | ContextPrimitive>): void;
     clearGlobalContexts(): void;
     removeGlobalContexts(contexts: Array<ConditionalContextProvider | ContextPrimitive | string>): void;
-    addPlugin(configuration: CorePluginConfiguration): void;
+    addPlugin(configuration: BrowserPluginConfiguration): void;
     flush: () => Promise<void>;
     readonly setAppId: (appId: string) => void;
     readonly setPlatform: (value: string) => void;
@@ -39,5 +43,5 @@ export declare type ReactNativeTracker = {
     readonly getSessionState: () => Promise<SessionState | undefined>;
 };
 ```
-<b>References:</b> [EventContext](./react-native-tracker.eventcontext.md)<!-- -->, [TimingProps](./react-native-tracker.timingprops.md)<!-- -->, [MessageNotificationProps](./react-native-tracker.messagenotificationprops.md)<!-- -->, [ScreenSize](./react-native-tracker.screensize.md)<!-- -->, [SubjectConfiguration](./react-native-tracker.subjectconfiguration.md)<!-- -->, [SessionState](./react-native-tracker.sessionstate.md)
+<b>References:</b> [EventContext](./react-native-tracker.eventcontext.md)<!-- -->, [ScreenViewProps](./react-native-tracker.screenviewprops.md)<!-- -->, [ScrollChangedProps](./react-native-tracker.scrollchangedprops.md)<!-- -->, [ListItemViewProps](./react-native-tracker.listitemviewprops.md)<!-- -->, [TimingProps](./react-native-tracker.timingprops.md)<!-- -->, [MessageNotificationProps](./react-native-tracker.messagenotificationprops.md)<!-- -->, [ScreenSize](./react-native-tracker.screensize.md)<!-- -->, [SubjectConfiguration](./react-native-tracker.subjectconfiguration.md)<!-- -->, [SessionState](./react-native-tracker.sessionstate.md)
 

api-docs/docs/react-native-tracker/markdown/react-native-tracker.trackerconfiguration.md

@@ -19,4 +19,5 @@ export interface TrackerConfiguration
 |  [appId?](./react-native-tracker.trackerconfiguration.appid.md) | string | <i>(Optional)</i> The application ID |
 |  [encodeBase64?](./react-native-tracker.trackerconfiguration.encodebase64.md) | boolean | <i>(Optional)</i> Whether unstructured events and custom contexts should be base64 encoded. |
 |  [namespace](./react-native-tracker.trackerconfiguration.namespace.md) | string | The namespace of the tracker |
+|  [plugins?](./react-native-tracker.trackerconfiguration.plugins.md) | BrowserPlugin\[\] | <i>(Optional)</i> Inject plugins which will be evaluated for each event |
 

api-docs/docs/react-native-tracker/markdown/react-native-tracker.trackerconfiguration.plugins.md

@@ -0,0 +1,13 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@snowplow/react-native-tracker](./react-native-tracker.md) &gt; [TrackerConfiguration](./react-native-tracker.trackerconfiguration.md) &gt; [plugins](./react-native-tracker.trackerconfiguration.plugins.md)
+
+## TrackerConfiguration.plugins property
+
+Inject plugins which will be evaluated for each event
+
+<b>Signature:</b>
+
+```typescript
+plugins?: BrowserPlugin[];
+```

api-docs/docs/react-native-tracker/react-native-tracker.api.md

@@ -4,6 +4,10 @@
 
 ```ts
 
+import { BrowserPlugin } from '@snowplow/browser-tracker-core';
+import { BrowserPluginConfiguration } from '@snowplow/browser-tracker-core';
+import { ScreenTrackingConfiguration } from '@snowplow/browser-plugin-screen-tracking';
+
 // @public
 export type ConditionalContextProvider = FilterProvider | RuleSetProvider;
 
@@ -251,7 +255,7 @@ export type MessageNotificationProps = {
 };
 
 // @public
-export function newTracker(configuration: TrackerConfiguration & EmitterConfiguration & SessionConfiguration & SubjectConfiguration & EventStoreConfiguration): Promise<ReactNativeTracker>;
+export function newTracker(configuration: TrackerConfiguration & EmitterConfiguration & SessionConfiguration & SubjectConfiguration & EventStoreConfiguration & ScreenTrackingConfiguration): Promise<ReactNativeTracker>;
 
 // @public
 export interface PageViewEvent {
@@ -277,15 +281,19 @@ export interface PayloadBuilder {
 
 // @public
 export type ReactNativeTracker = {
+    namespace: string;
     readonly trackSelfDescribingEvent: <T extends Record<string, unknown> = Record<string, unknown>>(argmap: SelfDescribingJson<T>, contexts?: EventContext[]) => void;
+    readonly trackScreenViewEvent: (argmap: ScreenViewProps, contexts?: EventContext[]) => void;
+    readonly trackScrollChangedEvent: (argmap: ScrollChangedProps, contexts?: EventContext[]) => void;
+    readonly trackListItemViewEvent: (argmap: ListItemViewProps, contexts?: EventContext[]) => void;
     readonly trackStructuredEvent: (argmap: StructuredEvent, contexts?: EventContext[]) => void;
     readonly trackPageViewEvent: (argmap: PageViewEvent, contexts?: EventContext[]) => void;
     readonly trackTimingEvent: (argmap: TimingProps, contexts?: EventContext[]) => void;
     readonly trackMessageNotificationEvent: (argmap: MessageNotificationProps, contexts?: EventContext[]) => void;
     addGlobalContexts(contexts: Array<ConditionalContextProvider | ContextPrimitive> | Record<string, ConditionalContextProvider | ContextPrimitive>): void;
     clearGlobalContexts(): void;
     removeGlobalContexts(contexts: Array<ConditionalContextProvider | ContextPrimitive | string>): void;
-    addPlugin(configuration: CorePluginConfiguration): void;
+    addPlugin(configuration: BrowserPluginConfiguration): void;
     flush: () => Promise<void>;
     readonly setAppId: (appId: string) => void;
     readonly setPlatform: (value: string) => void;
@@ -426,6 +434,7 @@ export interface TrackerConfiguration {
     appId?: string;
     encodeBase64?: boolean;
     namespace: string;
+    plugins?: BrowserPlugin[];
 }
 
 // @public

common/changes/@snowplow/browser-plugin-screen-tracking/issue-screen-tracking_2024-11-26-13-58.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@snowplow/browser-plugin-screen-tracking",
+      "comment": "Add screen tracking plugin and add support for browser plugins (#1394)",
+      "type": "none"
+    }
+  ],
+  "packageName": "@snowplow/browser-plugin-screen-tracking"
+}

common/changes/@snowplow/react-native-tracker/issue-screen-tracking_2024-11-26-13-58.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@snowplow/react-native-tracker",
+      "comment": "Add screen tracking plugin and add support for browser plugins (#1394)",
+      "type": "none"
+    }
+  ],
+  "packageName": "@snowplow/react-native-tracker"
+}

common/config/rush/browser-approved-packages.json

@@ -126,6 +126,10 @@
       "name": "@snowplow/browser-plugin-privacy-sandbox",
       "allowedCategories": [ "trackers" ]
     },
+    {
+      "name": "@snowplow/browser-plugin-screen-tracking",
+      "allowedCategories": [ "trackers" ]
+    },
     {
       "name": "@snowplow/browser-plugin-site-tracking",
       "allowedCategories": [ "trackers" ]

common/config/rush/repo-state.json

@@ -1,5 +1,5 @@
 // DO NOT MODIFY THIS FILE MANUALLY BUT DO COMMIT IT. It is generated and used by Rush.
 {
-  "pnpmShrinkwrapHash": "50fa04b4f2a1f9fdbf83a84ce901759859832bfd",
+  "pnpmShrinkwrapHash": "d1933251824ef3eb837586f089856ce0f6036111",
   "preferredVersionsHash": "bf21a9e8fbc5a3846fb05b4fa0859e0917b2202f"
 }

plugins/browser-plugin-screen-tracking/CHANGELOG.json

@@ -0,0 +1,5 @@
+{
+  "name": "@snowplow/browser-plugin-screen-tracking",
+  "entries": [
+  ]
+}

plugins/browser-plugin-screen-tracking/CHANGELOG.md

@@ -0,0 +1,3 @@
+# Change Log - @snowplow/browser-plugin-snowplow-screen-tracking
+
+This log was last generated on Fri, 01 Nov 2024 10:35:07 GMT and should not be manually modified.

plugins/browser-plugin-screen-tracking/LICENSE

@@ -0,0 +1,29 @@
+BSD 3-Clause License
+
+Copyright (c) 2022 Snowplow Analytics Ltd, 2010 Anthon Pang
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

plugins/browser-plugin-screen-tracking/README.md

@@ -0,0 +1,59 @@
+# Snowplow Screen Tracking Plugin
+
+[![npm version][npm-image]][npm-url]
+[![License][license-image]](LICENSE)
+
+Browser Plugin to be used with `@snowplow/browser-tracker`. The plugin is already included in `@snowplow/react-native-tracker`.
+
+This plugin is the recommended way to track screen view events.
+
+## Maintainer quick start
+
+Part of the Snowplow JavaScript Tracker monorepo.  
+Build with [Node.js](https://nodejs.org/en/) (18 - 20) and [Rush](https://rushjs.io/).
+
+### Setup repository
+
+```bash
+npm install -g @microsoft/rush 
+git clone https://github.com/snowplow/snowplow-javascript-tracker.git
+rush update
+```
+
+## Package Installation
+
+With npm:
+
+```bash
+npm install @snowplow/browser-plugin-snowplow-screen-tracking
+```
+
+## Usage
+
+Initialize your tracker with the ScreenTrackingPlugin:
+
+```js
+import { newTracker } from '@snowplow/browser-tracker';
+import { ScreenTrackingPlugin } from '@snowplow/browser-plugin-screen-tracking';
+
+newTracker('sp1', '{{collector_url}}', { 
+   appId: 'my-app-id', 
+   plugins: [ ScreenTrackingPlugin() ],
+});
+```
+
+For a full API reference, you can read the plugin [documentation page](https://docs.snowplow.io/docs/collecting-data/collecting-from-own-applications/javascript-trackers/browser-tracker/browser-tracker-v3-reference/plugins/screen-tracking/).
+
+## Copyright and license
+
+Licensed and distributed under the [BSD 3-Clause License](LICENSE) ([An OSI Approved License][osi]).
+
+Copyright (c) 2022 Snowplow Analytics Ltd.
+
+All rights reserved.
+
+[npm-url]: https://www.npmjs.com/package/@snowplow/browser-plugin-screen-tracking
+[npm-image]: https://img.shields.io/npm/v/@snowplow/browser-plugin-screen-tracking
+[docs]: https://docs.snowplowanalytics.com/docs/collecting-data/collecting-from-own-applications/javascript-tracker/
+[osi]: https://opensource.org/licenses/BSD-3-Clause
+[license-image]: https://img.shields.io/npm/l/@snowplow/browser-plugin-screen-tracking

plugins/browser-plugin-screen-tracking/jest.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  preset: 'ts-jest',
+  reporters: ['jest-standard-reporter'],
+  setupFilesAfterEnv: ['../../setupTestGlobals.ts'],
+  testEnvironment: 'jest-environment-jsdom-global',
+};