Add tests

Author: jelleklaver

@types/index.d.ts

@@ -1,6 +1,6 @@
 function warn(...args: any): void;
 export function verifyInit(): boolean;
-export function init(partnerId: string): void;
-export function track(conversionId: string): void;
+export function init(partnerId: string, subDomain?: string, disabled?: boolean): void;
+export function track(conversionId?: string, partnerId?: string, subDomain?: string): void;
 
 export default LinkedInTag;

__tests__/index/classimport.test.js

@@ -0,0 +1,40 @@
+import {LinkedInTag} from '../../src/index.js';
+const tag = new LinkedInTag()
+
+describe('Happy path', () => {
+    const partnerId = '0987654321';
+    const conversionId = '123456789';
+    const subDomain = 'dc';
+
+    beforeAll(() => {
+        tag.init(partnerId, subDomain, false);
+    });
+
+    document.body.innerHTML = '<script src="index.js" />';
+
+    it('init() should be properly initialized', () => {
+        expect(tag.disabled).toEqual(false);
+        expect(tag.initialized).toEqual(true);
+        expect(tag.partnerId).toEqual(partnerId);
+    });
+
+    it('init() should insert the LinkedIn insight.min.js script', () => {
+        // Extract all script src strings from the DOM
+        let scripts = [];
+        const scriptElms = document.getElementsByTagName('script');
+        Array.prototype.slice.call(scriptElms).forEach((elm) => { scripts.push(elm.src); });
+
+        // Assert if it correctly inserted the LinkedIn script
+        expect(scripts).toEqual(
+            expect.arrayContaining(['https://snap.licdn.com/li.lms-analytics/insight.min.js'])
+        );
+    });
+
+    it('track() should create an image with proper src', () => {
+        const elm = tag.track(conversionId);
+
+        expect(elm.src).toEqual(expect.stringContaining(partnerId));
+        expect(elm.src).toEqual(expect.stringContaining(subDomain));
+        expect(elm.src).toEqual(expect.stringContaining(conversionId));
+    });
+});

__tests__/index/defaults.test.js

@@ -0,0 +1,26 @@
+import LinkedInTag from '../../src/index.js';
+
+beforeAll(() => {
+    jest.mock('browser-or-node', () => ({ isBrowser: true }));
+});
+
+describe('Check for proper defaults', () => {
+    const partnerId = '1234';
+    beforeAll(() => {
+        LinkedInTag.init(partnerId);
+    });
+
+    document.body.innerHTML = '<script src="" />'
+
+    it('init() should not be initialized', () => {
+        expect(LinkedInTag.initialized).toEqual(true);
+        expect(LinkedInTag.disabled).toEqual(false);
+    });
+
+    it('track() should create an image with proper src', () => {
+        const elm = LinkedInTag.track();
+
+        expect(elm.src).toEqual(expect.stringContaining(partnerId));
+        expect(elm.src).toEqual(expect.stringContaining('dc'));
+    });
+});

__tests__/index/disabled.test.js

@@ -0,0 +1,31 @@
+import LinkedInTag from '../../src/index.js';
+
+describe('Disabled', () => {
+    beforeAll(() => {
+        LinkedInTag.init('1234', null, true);
+    });
+
+    document.body.innerHTML = '<script src="" />';
+
+    it('init() should be properly initialized', () => {
+        expect(LinkedInTag.initialized).toEqual(false);
+        expect(LinkedInTag.disabled).toEqual(true);
+    });
+
+    it('init() should not insert the LinkedIn insight.min.js script', () => {
+        // Extract all script src strings from the DOM
+        let scripts = [];
+        const scriptElms = document.getElementsByTagName('script');
+        Array.prototype.slice.call(scriptElms).forEach((elm) => { scripts.push(elm.src); });
+
+        // Assert if it correctly skipped the insertion
+        expect(scripts).not.toEqual(
+            expect.arrayContaining(['https://snap.licdn.com/li.lms-analytics/insight.min.js'])
+        );
+    });
+
+    it('track() should not do anything', () => {
+        const elm = LinkedInTag.track();
+        expect(elm).toBeUndefined();
+    });
+});

__tests__/index/happypath.test.js

@@ -0,0 +1,39 @@
+import LinkedInTag from '../../src/index.js';
+
+describe('Happy path', () => {
+    const partnerId = '0987654321';
+    const conversionId = '123456789';
+    const subDomain = 'dc';
+
+    beforeAll(() => {
+        LinkedInTag.init(partnerId, subDomain, false);
+    });
+
+    document.body.innerHTML = '<script src="index.js" />';
+
+    it('init() should be properly initialized', () => {
+        expect(LinkedInTag.disabled).toEqual(false);
+        expect(LinkedInTag.initialized).toEqual(true);
+        expect(LinkedInTag.partnerId).toEqual(partnerId);
+    });
+
+    it('init() should insert the LinkedIn insight.min.js script', () => {
+        // Extract all script src strings from the DOM
+        let scripts = [];
+        const scriptElms = document.getElementsByTagName('script');
+        Array.prototype.slice.call(scriptElms).forEach((elm) => { scripts.push(elm.src); });
+
+        // Assert if it correctly inserted the LinkedIn script
+        expect(scripts).toEqual(
+            expect.arrayContaining(['https://snap.licdn.com/li.lms-analytics/insight.min.js'])
+        );
+    });
+
+    it('track() should create an image with proper src', () => {
+        const elm = LinkedInTag.track(conversionId);
+
+        expect(elm.src).toEqual(expect.stringContaining(partnerId));
+        expect(elm.src).toEqual(expect.stringContaining(subDomain));
+        expect(elm.src).toEqual(expect.stringContaining(conversionId));
+    });
+});

package.json

@@ -26,7 +26,8 @@
   "scripts": {
     "bundle": "npm run lint && export NODE_ENV=production && webpack --config webpack.config.dist.js",
     "lint": "eslint src/",
-    "clean": "rm -rf node_modules"
+    "clean": "rm -rf node_modules",
+    "test": "jest"
   },
   "types": "./@types/index.d.ts",
   "dependencies": {
@@ -39,6 +40,7 @@
     "babel-loader": "^8.2.1",
     "eslint": "^7.14.0",
     "eslint-plugin-import": "^2.20.0",
+    "jest": "^26.6.3",
     "webpack": "^5.6.0",
     "webpack-cli": "^4.2.0"
   }

src/index.js

@@ -7,10 +7,10 @@ import { isBrowser } from 'browser-or-node';
  * @author Jelle Klaver
  */
 
-class LinkedInTag {
+export class LinkedInTag {
   constructor() {
     this.initialized = false;
-    this.disabled = false;
+    this.disabled = !isBrowser;
     this.partnerId = '';
     this.subDomain = 'dc';
   }
@@ -45,18 +45,19 @@ class LinkedInTag {
    * It is stated like '_linkedin_partner_id = "123456";' on the second row
    * of the code they provide. The "123456" is your partnerId.
    *
-   * @param {string} partnerId - The partner id received from LinkedIn.
-   * @param {string} subDomain - The the subDomain to use. Default 'dc'
+   * @param {string} partnerId - Partner id received from LinkedIn.
+   * @param {string} [subDomain='dc'] - Sub domain to use. Default 'dc'
+   * @param {boolean} [disabled=!isBrowser] - Disable all tracking, e.g. for SSR or when the user disallows tracking
    *
    * @return void
    */
-  init(partnerId, subDomain, disabled = !isBrowser) {
-    this.disabled = disabled;
-    this.partnerId = String(partnerId);
+  init(partnerId, subDomain, disabled) {
+    this.partnerId = partnerId;
+    this.subDomain = subDomain || this.subDomain;
+    if(disabled != null) this.disabled = disabled;
 
-    if (disabled) return;
-    if (!this.partnerId) this.warn('Partner id is empty.');
-    if (subDomain) this.subDomain = subDomain;
+    if (this.disabled) return;
+    if (!this.partnerId) this.warn('Partner id is required.');
 
     window._linkedin_data_partner_ids = window._linkedin_data_partner_ids || [];
     window._linkedin_data_partner_ids.push(partnerId);
@@ -78,31 +79,33 @@ class LinkedInTag {
    * an event-specific pixel. The src url they provide holds a query variable
    * 'conversionId=123456'. This 123456 is your conversion id.
    *
-   * @param {string?} conversionId - The conversion ID received from LinkedIn
-   * @param {string?} partnerId - Override the partnerId for this specific tracking operation
-   * @param {string?} subDomain - Override the subDomain for this specific tracking operation
+   * @param {string} [conversionId] - The conversion ID received from LinkedIn
+   * @param {string} [partnerId] - Override the partnerId for this specific tracking operation
+   * @param {string} [subDomain] - Override the subDomain for this specific tracking operation
    *
-   * @return void
+   * @return [element]
    */
   track(conversionId, partnerId, subDomain) {
-    if (!this.verifyInit() || this.disabled) return this.warn('Called `track` before calling `init`.');
+    if (this.disabled) return;
+    if (!this.verifyInit()) return this.warn('You must call `init` before calling `track`.');
 
     partnerId = partnerId || this.partnerId || window._linkedin_data_partner_ids[0];
-    if (!partnerId) return this.warn('Partner id is empty.');
-
     subDomain = subDomain || this.subDomain;
 
     let url = `https://${subDomain}.ads.linkedin.com/collect/?pid=${partnerId}&fmt=gif`;
     if(conversionId) {
       url = `${url}&conversionId=${conversionId}`;
     }
 
-    // It creates an element without actually posting it to the page. The call is already made to the linkedin servers and will be registered
+    // It creates an element without actually adding it to the page DOM.
+    // The call is already made to the LinkedIn servers and will be registered.
     const element = document.createElement('img');
     element.alt = '';
     element.height = 1;
     element.width = 1;
     element.src = url;
+
+    return element;
   }
 }