[CM-1540] Add support for headers in callhandler

package.json

@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "js-cookie": "^3.0.5",
-    "live-connect-common": "^4.0.0"
+    "live-connect-common": "^4.1.0"
   },
   "devDependencies": {
     "@kineticcafe/rollup-plugin-delete": "^3.0.0",

src/calls.ts

@@ -1,13 +1,14 @@
-import { CallHandler, isFunction } from 'live-connect-common'
+import { CallHandler, Headers, isFunction } from 'live-connect-common'
 
 export class DefaultCallHandler implements CallHandler {
-  ajaxGet(url: string, responseHandler: (responseText: string, response: object) => void, onError?: (error: unknown) => void, timeout = 1000): void {
+  ajaxGet(url: string, responseHandler: (responseText: string, response: object) => void, onError?: (error: unknown) => void, timeout = 1000, headers?: Headers): void {
     function errorCallback(message: string) {
       if (isFunction(onError)) onError(new Error(message))
     }
 
-    function xhrCall(): XMLHttpRequest {
+    function xhrCall(): void {
       const xhr = new XMLHttpRequest()
+      const startTime = Date.now()
       xhr.onreadystatechange = () => {
         if (xhr.readyState === 4) {
           if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304) {
@@ -17,30 +18,46 @@ export class DefaultCallHandler implements CallHandler {
           }
         }
       }
-      return xhr
+      xhr.ontimeout = () => {
+        const duration = Date.now() - startTime
+        errorCallback(`Timeout after ${duration} (${timeout}), url: ${url}`)
+      }
+      xhr.open('GET', url, true)
+      xhr.timeout = timeout
+      xhr.withCredentials = true
+      if (headers != null) {
+        for (const [name, value] of Object.entries(headers)) {
+          if (value != null) {
+            xhr.setRequestHeader(name, value)
+          }
+        }
+      }
+      xhr.send()
     }
 
-    function xdrCall(): XDomainRequest {
+    function xdrCall(): void {
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       const xdr = new window.XDomainRequest!()
+      const startTime = Date.now()
       xdr.onprogress = () => undefined
       xdr.onerror = () => errorCallback(`Error during XDR call: ${xdr.responseText}, url: ${url}`)
       xdr.onload = () => responseHandler(xdr.responseText, xdr)
-      return xdr
+      xdr.ontimeout = () => {
+        const duration = Date.now() - startTime
+        errorCallback(`Timeout after ${duration} (${timeout}), url: ${url}`)
+      }
+      xdr.open('GET', url, true)
+      xdr.timeout = timeout
+      xdr.withCredentials = true
+      xdr.send()
     }
 
     try {
-      const startTime = Date.now()
-      const request = (window && window.XDomainRequest) ? xdrCall() : xhrCall()
-
-      request.ontimeout = () => {
-        const duration = Date.now() - startTime
-        errorCallback(`Timeout after ${duration} (${timeout}), url: ${url}`)
+      if (window.XMLHttpRequest) {
+        xhrCall()
+      } else {
+        xdrCall()
       }
-      request.open('GET', url, true)
-      request.timeout = timeout
-      request.withCredentials = true
-      request.send()
     } catch (error) {
       errorCallback(`Error while constructing ajax request, ${error}, url: ${url}`)
     }

test/calls.spec.ts

@@ -94,4 +94,18 @@ describe('Calls', () => {
     expect(obj.src).to.eq('http://localhost')
     expect(obj.onload).to.be.undefined()
   })
+
+  it('should send headers', function (done) {
+    // @ts-expect-error
+    const successCallback = (body, request) => {
+      expect(body).to.eql('{"comment": "Howdy"}')
+      expect(request).to.eql(requests[0])
+      expect(request.requestHeaders['X-Test']).to.eql('test')
+      done()
+    }
+    calls.ajaxGet('http://steve.liadm.com/idex/any/any', successCallback, undefined, undefined, { 'X-Test': 'test' })
+    const request = requests[0]
+    // @ts-expect-error
+    request.respond(200, { 'Content-Type': 'application/json' }, '{"comment": "Howdy"}')
+  })
 })