use umd bundle

segmentio · Sep 6, 2023 · 0fc964b · 0fc964b
1 parent e1cb8f2
commit 0fc964b
Show file tree

Hide file tree

Showing 15 changed files with 156 additions and 166 deletions.
diff --git a/packages/consent/consent-tools-integration-tests/README.md b/packages/consent/consent-tools-integration-tests/README.md
@@ -9,7 +9,7 @@ Why is this using wd.io instead of playwright?
   - `/dist` - Holds the webpacked page-bundles that will be injected into each html page
 
 - `/src` - Test suite files
-  - `/page-bundles` - JS that will be injected into the test page (this will be built by webpack -> public/dist)
+  - `/page-bundles` - For testing libraries that don't have a UMD bundle (i.e analytics-consent-tools)
   - `/page-objects` - Page objects for the test suite
   - `/page-tests ` - Tests that will be run on the page
 

diff --git a/packages/consent/consent-tools-integration-tests/package.json b/packages/consent/consent-tools-integration-tests/package.json
@@ -7,12 +7,15 @@
     "build": "webpack",
     "watch": "yarn build --watch",
     "test:local": "wdio wdio.conf.local.ts",
-    "start-server-and-test": "yarn concurrently -k 'yarn build serve' 'sleep 5 && yarn test:local'",
+    "start-server-and-test": "yarn build && yarn test:local",
     "lint": "yarn concurrently 'yarn:eslint .' 'yarn:tsc --noEmit'",
     "eslint": "yarn run -T eslint",
     "tsc": "tsc",
     "concurrently": "yarn run -T concurrently --raw"
   },
+  "installConfig": {
+    "hoistingLimits": "workspaces"
+  },
   "devDependencies": {
     "@segment/analytics-consent-tools": "workspace:^",
     "@segment/analytics-consent-wrapper-onetrust": "workspace:^",
@@ -21,6 +24,7 @@
     "@wdio/local-runner": "^8.10.6",
     "@wdio/mocha-framework": "^8.10.6",
     "@wdio/spec-reporter": "^8.10.6",
+    "@wdio/static-server-service": "^8.10.6",
     "@wdio/types": "8",
     "expect": "^29.4.1",
     "globby": "^11.0.2",

diff --git a/...tools-integration-tests/public/basic.html → ...n-tests/public/consent-tools-vanilla.html b/...tools-integration-tests/public/basic.html → ...n-tests/public/consent-tools-vanilla.html
@@ -2,7 +2,7 @@
 <html lang="en">
 
 <head>
-  <script src="dist/basic.bundle.js"></script>
+  <script src="dist/consent-tools-vanilla.bundle.js"></script>
 </head>
 
 <body>

diff --git a/packages/consent/consent-tools-integration-tests/public/onetrust.html b/packages/consent/consent-tools-integration-tests/public/onetrust.html
@@ -13,8 +13,72 @@
       }
     })
   </script>
-  <script src="dist/onetrust.bundle.js"></script>
+  <script
+    src="http://localhost:4567/@segment/analytics-consent-wrapper-onetrust/dist/umd/analytics-onetrust.umd.js"></script>
 
+  <script>
+    !(function () {
+      var analytics = (window.analytics = window.analytics || [])
+      if (!analytics.initialize)
+        if (analytics.invoked)
+          window.console &&
+            console.error &&
+            console.error('Segment snippet included twice.')
+        else {
+          analytics.invoked = !0
+          analytics.methods = [
+            'trackSubmit',
+            'trackClick',
+            'trackLink',
+            'trackForm',
+            'pageview',
+            'identify',
+            'reset',
+            'group',
+            'track',
+            'ready',
+            'alias',
+            'debug',
+            'page',
+            'once',
+            'off',
+            'on',
+            'addSourceMiddleware',
+            'addIntegrationMiddleware',
+            'setAnonymousId',
+            'addDestinationMiddleware',
+          ]
+          analytics.factory = function (e) {
+            return function () {
+              var t = Array.prototype.slice.call(arguments)
+              t.unshift(e)
+              analytics.push(t)
+              return analytics
+            }
+          }
+          for (var e = 0; e < analytics.methods.length; e++) {
+            var key = analytics.methods[e]
+            analytics[key] = analytics.factory(key)
+          }
+          analytics.load = function (key, e) {
+            var t = document.createElement('script')
+            t.type = 'text/javascript'
+            t.async = !0
+            t.src =
+              'https://cdn.segment.com/analytics.js/v1/' + key + '/analytics.min.js'
+            var n = document.getElementsByTagName('script')[0]
+            n.parentNode.insertBefore(t, n)
+            analytics._loadOptions = e
+          }
+          analytics._writeKey = '9lSrez3BlfLAJ7NOChrqWtILiATiycoc'
+          analytics.SNIPPET_VERSION = '4.15.3'
+          // Update!
+          withOneTrust(analytics).load('9lSrez3BlfLAJ7NOChrqWtILiATiycoc')
+
+          analytics.page()
+        }
+    })()
+  </script>
 </head>
 
 <body>

diff --git a/packages/consent/consent-tools-integration-tests/public/snippet.html b/packages/consent/consent-tools-integration-tests/public/snippet.html
diff --git a/...ion-tests/src/page-bundles/basic/index.ts → ...ge-bundles/consent-tools-vanilla/index.ts b/...ion-tests/src/page-bundles/basic/index.ts → ...ge-bundles/consent-tools-vanilla/index.ts
diff --git a/packages/consent/consent-tools-integration-tests/src/page-bundles/onetrust/index.ts b/packages/consent/consent-tools-integration-tests/src/page-bundles/onetrust/index.ts
diff --git a/packages/consent/consent-tools-integration-tests/src/page-bundles/snippet/index.ts b/packages/consent/consent-tools-integration-tests/src/page-bundles/snippet/index.ts
diff --git a/packages/consent/consent-tools-integration-tests/src/page-objects/basic.ts b/packages/consent/consent-tools-integration-tests/src/page-objects/basic.ts
diff --git a/packages/consent/consent-tools-integration-tests/src/page-objects/consent-tools-vanilla.ts b/packages/consent/consent-tools-integration-tests/src/page-objects/consent-tools-vanilla.ts
@@ -0,0 +1,9 @@
+import { BasePage } from './base-page'
+
+class ConsentToolsVanilla extends BasePage {
+  constructor() {
+    super('consent-tools-vanilla.html')
+  }
+}
+
+export default new ConsentToolsVanilla()
diff --git a/...-tests/src/tests/consent-stamping.test.ts → ...s/src/tests/consent-tools-vanilla.test.ts b/...-tests/src/tests/consent-stamping.test.ts → ...s/src/tests/consent-tools-vanilla.test.ts
@@ -1,7 +1,9 @@
-import page from '../page-objects/basic'
+import page from '../page-objects/consent-tools-vanilla'
 import { expect } from 'expect'
 import { Context } from '@segment/analytics-next'
 
+// Verify that the consent tools wrapper is working as expected (no OneTrust)
+
 it('should stamp each event', async () => {
   await page.load()
 
@@ -13,6 +15,7 @@ it('should stamp each event', async () => {
     `analytics.identify("bar", { bar: 123 })`,
   ]
 
+  await browser.pause(1000)
   const responses = await Promise.all<Context>(
     commands.map((cmd) => browser.execute(cmd))
   )

diff --git a/packages/consent/consent-tools-integration-tests/src/tests/onetrust.test.ts b/packages/consent/consent-tools-integration-tests/src/tests/onetrust.test.ts
@@ -1,7 +1,8 @@
+// Verify that @segment/analytics-consent-wrapper-onetrust is working as expected
+
 /* eslint-disable @typescript-eslint/no-floating-promises */
 import page from '../page-objects/onetrust'
 import { expect } from 'expect'
-import { Context } from '@segment/analytics-next'
 
 declare global {
   interface Window {
@@ -13,28 +14,6 @@ afterEach(async () => {
   await page.clearStorage()
 })
 
-it('should stamp each event', async () => {
-  await page.load()
-  const commands = [
-    `analytics.track("hello world")`,
-    `analytics.alias("foo", "bar")`,
-    `analytics.page()`,
-    `analytics.group("foo", { bar: 123 })`,
-    `analytics.identify("bar", { bar: 123 })`,
-  ]
-
-  const eventsP = Promise.all<Context>(
-    commands.map((cmd) => browser.execute(cmd))
-  )
-
-  await page.clickAcceptButtonAndClosePopup()
-  ;(await eventsP).forEach((ctx) => {
-    expect(
-      Object.keys((ctx.event.context as any).consent.categoryPreferences).length
-    ).toBeGreaterThan(0)
-  })
-})
-
 it('should send a consent changed event when user clicks accept on popup', async () => {
   await page.load()
 

diff --git a/packages/consent/consent-tools-integration-tests/wdio.conf.local.ts b/packages/consent/consent-tools-integration-tests/wdio.conf.local.ts
@@ -1,5 +1,7 @@
 import type { Options } from '@wdio/types'
 
+const PORT = 4567
+
 export const config: Options.Testrunner = {
   afterTest(test, _, { error, passed }) {
     console.log(
@@ -10,7 +12,25 @@ export const config: Options.Testrunner = {
       ].join('\n')
     )
   },
-  services: ['intercept'],
+  services: [
+    'intercept',
+    [
+      'static-server',
+      {
+        port: PORT,
+        folders: [
+          {
+            mount: '/',
+            path: './public',
+          },
+          {
+            mount: '/@segment',
+            path: './node_modules/@segment',
+          },
+        ],
+      },
+    ],
+  ],
   // services: [ /* Using webpack-dev-server instead */
   //   [
   //     'static-server',
@@ -25,7 +45,7 @@ export const config: Options.Testrunner = {
   //     },
   //   ],
   // ],
-  baseUrl: 'http://localhost:9000',
+  baseUrl: `http://localhost:${PORT}`,
   // WebdriverIO allows it to run your tests in arbitrary locations (e.g. locally or
   // on a remote machine).
   runner: 'local',

diff --git a/packages/consent/consent-tools-integration-tests/webpack.config.ts b/packages/consent/consent-tools-integration-tests/webpack.config.ts
@@ -2,9 +2,6 @@ import path from 'path'
 import globby from 'globby'
 import type { Configuration as WebpackConfiguration } from 'webpack'
 
-// in case you run into any typescript error when configuring `devServer`
-import 'webpack-dev-server'
-
 // This config is for bundling fixtures in order to serve the pages that webdriver.io will use in its tests.
 const files = globby.sync('src/page-bundles/*/index.ts', { cwd: __dirname })
 
@@ -18,12 +15,6 @@ const entries = files.reduce((acc, file) => {
 }, {})
 
 const config: WebpackConfiguration = {
-  devServer: {
-    static: {
-      directory: path.join(__dirname, 'public'),
-    },
-    port: 9000,
-  },
   mode: 'development',
   devtool: 'source-map',
   entry: entries,