@newrelic/browser-agent 0.1.231 → 1.232.0

package/src/common/session/session-entity.js

@@ -0,0 +1,271 @@
+import { generateRandomHexString } from '../ids/unique-id'
+import { warn } from '../util/console'
+import { stringify } from '../util/stringify'
+import { ee } from '../event-emitter/contextual-ee'
+import { Timer } from '../timer/timer'
+import { isBrowserScope } from '../util/global-scope'
+import { DEFAULT_EXPIRES_MS, DEFAULT_INACTIVE_MS, PREFIX } from './constants'
+import { LocalMemory } from '../storage/local-memory'
+import { InteractionTimer } from '../timer/interaction-timer'
+import { wrapEvents } from '../wrap'
+import { Configurable } from '../config/state/configurable'
+import { handle } from '../event-emitter/handle'
+import { SUPPORTABILITY_METRIC_CHANNEL } from '../../features/metrics/constants'
+import { FEATURE_NAMES } from '../../loaders/features/features'
+
+const model = {
+  value: '',
+  inactiveAt: 0,
+  expiresAt: 0,
+  updatedAt: Date.now(),
+  sessionReplayActive: false,
+  sessionTraceActive: false,
+  custom: {}
+}
+
+export class SessionEntity {
+  /**
+   * Create a self-managing Session Entity. This entity is scoped to the agent identifier which triggered it, allowing for multiple simultaneous session objects to exist.
+   * There is one "namespace" an agent can store data in LS -- NRBA_{key}. If there are two agents on one page, and they both use the same key, they could overwrite each other since they would both use the same namespace in LS by default.
+   * The value can be overridden in the constructor, but will default to a unique 16 character hex string
+   * expiresMs and inactiveMs are used to "expire" the session, but can be overridden in the constructor. Pass 0 to disable expiration timers.
+   */
+  constructor (opts) {
+    this.setup(opts)
+  }
+
+  setup ({ agentIdentifier, key, value = generateRandomHexString(16), expiresMs = DEFAULT_EXPIRES_MS, inactiveMs = DEFAULT_INACTIVE_MS, storageAPI = new LocalMemory() }) {
+    if (!agentIdentifier || !key) throw new Error('Missing Required Fields')
+    if (!isBrowserScope) this.storage = new LocalMemory()
+    else this.storage = storageAPI
+
+    this.sync(model)
+
+    this.agentIdentifier = agentIdentifier
+
+    // key is intended to act as the k=v pair
+    this.key = key
+    // value is intended to act as the primary value of the k=v pair
+    this.value = value
+
+    this.expiresMs = expiresMs
+    this.inactiveMs = inactiveMs
+
+    this.ee = ee.get(agentIdentifier)
+
+    wrapEvents(this.ee)
+
+    // the first time the session entity class is instantiated, we check the storage API for an existing
+    // object. If it exists, the values inside the object are used to inform the timers that run locally.
+    // if the initial read is empty, it allows us to set a "fresh" "new" session immediately.
+    // the local timers are used after the session is running to "expire" the session, allowing for pausing timers etc.
+    // the timestamps stored in the storage API can be checked at initial run, and when the page is restored, otherwise we lean
+    // on the local timers to expire the session
+    const initialRead = this.read()
+
+    // the set-up of the timer used to expire the session "naturally" at a certain time
+    // this gets ignored if the value is falsy, allowing for session entities that do not expire
+    if (expiresMs) {
+      this.expiresAt = initialRead?.expiresAt || this.getFutureTimestamp(expiresMs)
+      this.expiresTimer = new Timer({
+        // When the inactive timer ends, collect a SM and reset the session
+        onEnd: () => {
+          this.collectSM('expired', this)
+          this.collectSM('duration', this)
+          this.reset()
+        }
+      }, this.expiresAt - Date.now())
+    } else {
+      this.expiresAt = Infinity
+    }
+
+    // the set-up of the timer used to expire the session due to "inactivity" at a certain time
+    // this gets ignored if the value is falsy, allowing for session entities that do not expire
+    // this gets "refreshed" when "activity" is observed
+    if (inactiveMs) {
+      this.inactiveAt = initialRead?.inactiveAt || this.getFutureTimestamp(inactiveMs)
+      this.inactiveTimer = new InteractionTimer({
+        // When the inactive timer ends, collect a SM and reset the session
+        onEnd: () => {
+          this.collectSM('inactive', this)
+          this.collectSM('duration', this)
+          this.reset()
+        },
+        // When the inactive timer refreshes, it will update the storage values with an update timestamp
+        onRefresh: this.refresh.bind(this),
+        // When the inactive timer pauses, update the storage values with an update timestamp
+        onPause: () => this.write(new Configurable(this.read(), model)),
+        ee: this.ee,
+        refreshEvents: ['click', 'keydown', 'scroll']
+      }, this.inactiveAt - Date.now())
+    } else {
+      this.inactiveAt = Infinity
+    }
+
+    // The fact that the session is "new" or pre-existing is used in some places in the agent.  Session Replay and Trace
+    // can use this info to inform whether to trust a new sampling decision vs continue a previous tracking effort.
+    this.isNew = !Object.keys(initialRead).length
+    // if its a "new" session, we write to storage API with the default values.  These values may change over the lifespan of the agent run.
+    // we can use configurable here to help us know and manage what values are being used. -- see "model" above
+    if (this.isNew) this.write(new Configurable(this, model), true)
+    else this.sync(initialRead)
+
+    this.initialized = true
+  }
+
+  // This is the actual key appended to the storage API
+  get lookupKey () {
+    return `${PREFIX}_${this.key}`
+  }
+
+  sync (data) {
+    Object.assign(this, data)
+  }
+
+  /**
+   * Fetch the stored values from the storage API tied to this entity
+   * @returns {Object}
+   */
+  read () {
+    try {
+      const val = this.storage.get(this.lookupKey)
+      if (!val) return {}
+      // TODO - decompression would need to happen here if we decide to do it
+      const obj = typeof val === 'string' ? JSON.parse(val) : val
+      if (this.isInvalid(obj)) return {}
+      // if the session expires, collect a SM count before resetting
+      if (this.isExpired(obj.expiresAt)) {
+        this.collectSM('expired', this)
+        this.collectSM('duration', obj, true)
+        return this.reset()
+      }
+      // if "inactive" timer is expired at "read" time -- esp. initial read -- reset
+      // collect a SM count before resetting
+      if (this.isExpired(obj.inactiveAt)) {
+        this.collectSM('inactive', this)
+        this.collectSM('duration', obj, true)
+        return this.reset()
+      }
+
+      return obj
+    } catch (e) {
+      warn('Failed to read from storage API', e)
+      // storage is inaccessible
+      return {}
+    }
+  }
+
+  /**
+   * Store data to the storage API tied to this entity
+   * To preseve existing attributes, the output of ...session.read()
+   * should be appended to the data argument
+   * @param {Object} data
+   * @returns {Object}
+   */
+  write (data) {
+    try {
+      if (!data || typeof data !== 'object') return
+      // everytime we update, we can update a timestamp for sanity
+      data.updatedAt = Date.now()
+      this.sync(data)
+      // TODO - compression would need happen here if we decide to do it
+      this.storage.set(this.lookupKey, stringify(data))
+      return data
+    } catch (e) {
+      // storage is inaccessible
+      warn('Failed to write to the storage API', e)
+      return null
+    }
+  }
+
+  reset () {
+    // this method should set off a chain of actions across the features by emitting 'new-session'
+    // * send off pending payloads
+    // * stop recording (stn and sr)...
+    // * delete the session and start over
+    try {
+      if (this.initialized) this.ee.emit('session-reset')
+
+      this.storage.remove(this.lookupKey)
+      this.inactiveTimer?.abort?.()
+      this.expiresTimer?.clear?.()
+      delete this.custom
+      delete this.value
+
+      this.setup({
+        agentIdentifier: this.agentIdentifier,
+        key: this.key,
+        storageAPI: this.storage,
+        expiresMs: this.expiresMs,
+        inactiveMs: this.inactiveMs
+      })
+      return this.read()
+    } catch (e) {
+      return {}
+    }
+  }
+
+  /**
+   * Refresh the inactivity timer data
+   */
+  refresh () {
+    // read here & invalidate
+    const existingData = this.read()
+    this.inactiveAt = this.getFutureTimestamp(this.inactiveMs)
+    this.write({ ...existingData, inactiveAt: this.inactiveAt })
+  }
+
+  /**
+   * @param {number} timestamp
+   * @returns {boolean}
+   */
+  isExpired (timestamp) {
+    return Date.now() > timestamp
+  }
+
+  /**
+   * @param {Object} data
+   * @returns {boolean}
+   */
+  isInvalid (data) {
+    const requiredKeys = ['value', 'expiresAt', 'inactiveAt']
+    return !requiredKeys.every(x => Object.keys(data).includes(x))
+  }
+
+  collectSM (type, data, useUpdatedAt) {
+    let value, tag
+    if (type === 'duration') {
+      const startingTimestamp = data.expiresAt - data.expiresMs
+      const endingTimestamp = useUpdatedAt ? data.updatedAt : Date.now()
+      value = endingTimestamp - startingTimestamp
+      tag = 'Session/Duration/Ms'
+    }
+    if (type === 'expired') tag = 'Session/Expired/Seen'
+    if (type === 'inactive') tag = 'Session/Inactive/Seen'
+
+    if (tag) handle(SUPPORTABILITY_METRIC_CHANNEL, [tag, value], undefined, FEATURE_NAMES.metrics, this.ee)
+  }
+
+  /**
+   * @param {number} futureMs - The number of ms to use to generate a future timestamp
+   * @returns {number}
+   */
+  getFutureTimestamp (futureMs) {
+    return Date.now() + futureMs
+  }
+
+  syncCustomAttribute (key, value) {
+    if (!isBrowserScope) return
+    if (value === null) {
+      const curr = this.read()
+      if (curr.custom) {
+        delete curr.custom[key]
+        this.write({ ...curr })
+      }
+    } else {
+      const curr = this.read()
+      this.custom = { ...(curr?.custom || {}), [key]: value }
+      this.write({ ...curr, custom: this.custom })
+    }
+  }
+}

package/src/common/session/session-entity.test.js

@@ -0,0 +1,317 @@
+
+import { LocalMemory } from '../storage/local-memory'
+import { LocalStorage } from '../storage/local-storage'
+
+import { PREFIX } from './constants'
+import { SessionEntity } from './session-entity'
+
+const agentIdentifier = 'test_agent_identifier'
+const key = 'test_key'
+const value = 'test_value'
+
+jest.mock('../timer/timer')
+jest.mock('../timer/interaction-timer')
+jest.useFakeTimers()
+
+const mockBrowserScope = jest.fn().mockImplementation(() => true)
+jest.mock('../util/global-scope', () => ({
+  __esModule: true,
+  get isBrowserScope () {
+    return mockBrowserScope()
+  },
+  get globalScope () {
+    return global.window
+  }
+}))
+
+beforeEach(() => {
+  jest.restoreAllMocks()
+  mockBrowserScope.mockReturnValue(true)
+})
+
+describe('constructor', () => {
+  test('must use required fields', () => {
+    try {
+      expect(new SessionEntity({})).toThrow(new Error('Missing Required Fields'))
+    } catch (err) {}
+  })
+
+  test('top-level properties are set and exposed', () => {
+    const session = new SessionEntity({ agentIdentifier, key })
+    expect(session).toMatchObject({
+      agentIdentifier: expect.any(String),
+      key: expect.any(String),
+      value: expect.any(String),
+      expiresMs: expect.any(Number),
+      expiresAt: expect.any(Number),
+      expiresTimer: expect.any(Object),
+      inactiveMs: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      inactiveTimer: expect.any(Object),
+      isNew: expect.any(Boolean),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean),
+      storage: expect.any(Object)
+    })
+  })
+
+  test('can use sane defaults', () => {
+    const session = new SessionEntity({ agentIdentifier, key })
+    expect(session).toEqual(expect.objectContaining({
+      value: expect.any(String),
+      expiresAt: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean)
+    }))
+  })
+
+  test('Workers are forced to use local memory', () => {
+    mockBrowserScope.mockReturnValueOnce(false)
+    const session = new SessionEntity({ agentIdentifier, key, storageAPI: new LocalStorage() })
+    expect(session.storage instanceof LocalMemory).toEqual(true)
+  })
+
+  test('expiresAt is the correct future timestamp - new session', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, expiresMs: 100 })
+    expect(session.expiresAt).toEqual(now + 100)
+  })
+
+  test('expiresAt is the correct future timestamp - existing session', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const existingData = new LocalMemory({ [`${PREFIX}_${key}`]: { value, expiresAt: now + 5000, inactiveAt: Infinity } })
+    const session = new SessionEntity({ agentIdentifier, key, expiresMs: 100, storageAPI: existingData })
+    expect(session.expiresAt).toEqual(now + 5000)
+  })
+
+  test('expiresAt never expires if 0', () => {
+    const session = new SessionEntity({ agentIdentifier, key, expiresMs: 0 })
+    expect(session.expiresAt).toEqual(Infinity)
+  })
+
+  test('inactiveAt is the correct future timestamp - new session', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, inactiveMs: 100 })
+    expect(session.inactiveAt).toEqual(now + 100)
+  })
+
+  test('inactiveAt is the correct future timestamp - existing session', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const existingData = new LocalMemory({ [`${PREFIX}_${key}`]: { value, inactiveAt: now + 5000, expiresAt: Infinity } })
+    const session = new SessionEntity({ agentIdentifier, key, inactiveMs: 100, storageAPI: existingData })
+    expect(session.inactiveAt).toEqual(now + 5000)
+  })
+
+  test('inactiveAt never expires if 0', () => {
+    const session = new SessionEntity({ agentIdentifier, key, inactiveMs: 0 })
+    expect(session.inactiveAt).toEqual(Infinity)
+  })
+
+  test('should handle isNew', () => {
+    const newSession = new SessionEntity({ agentIdentifier, key, expiresMs: 10 })
+    expect(newSession.isNew).toBeTruthy()
+
+    const storageAPI = new LocalMemory({ [`${PREFIX}_${key}`]: { value, expiresAt: Infinity, inactiveAt: Infinity } })
+    const existingSession = new SessionEntity({ agentIdentifier, key, expiresMs: 10, storageAPI })
+    expect(existingSession.isNew).toBeFalsy()
+  })
+
+  test('invalid stored values sets new defaults', () => {
+    // missing required fields
+    const storageAPI = new LocalMemory({ [`${PREFIX}_${key}`]: { invalid_fields: true } })
+    const session = new SessionEntity({ agentIdentifier, key, storageAPI })
+    expect(session).toEqual(expect.objectContaining({
+      value: expect.any(String),
+      expiresAt: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean)
+    }))
+  })
+
+  test('expired expiresAt value in storage sets new defaults', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const storageAPI = new LocalMemory({ [`${PREFIX}_${key}`]: { value, expiresAt: now - 100, inactiveAt: Infinity } })
+    const session = new SessionEntity({ agentIdentifier, key, storageAPI })
+    expect(session).toEqual(expect.objectContaining({
+      value: expect.any(String),
+      expiresAt: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean)
+    }))
+  })
+
+  test('expired inactiveAt value in storage sets new defaults', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const storageAPI = new LocalMemory({ [`${PREFIX}_${key}`]: { value, inactiveAt: now - 100, expiresAt: Infinity } })
+    const session = new SessionEntity({ agentIdentifier, key, storageAPI })
+    expect(session).toEqual(expect.objectContaining({
+      value: expect.any(String),
+      expiresAt: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean)
+    }))
+  })
+})
+
+describe('reset()', () => {
+  test('should create new default values when resetting', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, expiresMs: 10 })
+    const sessionVal = session.value
+    expect(session.value).toBeTruthy()
+    session.reset()
+    expect(session.value).toBeTruthy()
+    expect(session.value).not.toEqual(sessionVal)
+  })
+
+  test('custom data should be wiped on reset', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, expiresMs: 10 })
+    session.syncCustomAttribute('test', 123)
+    expect(session.custom.test).toEqual(123)
+    expect(session.read().custom.test).toEqual(123)
+
+    // simulate a timer expiring
+    session.reset()
+    expect(session.custom?.test).toEqual(undefined)
+    expect(session.read()?.custom?.test).toEqual(undefined)
+  })
+})
+
+describe('read()', () => {
+  test('"new" sessions get data from read()', () => {
+    const newSession = new SessionEntity({ agentIdentifier, key, expiresMs: 10 })
+    expect(newSession.isNew).toBeTruthy()
+
+    expect(newSession.read()).toEqual(expect.objectContaining({
+      value: expect.any(String),
+      expiresAt: expect.any(Number),
+      inactiveAt: expect.any(Number),
+      sessionReplayActive: expect.any(Boolean),
+      sessionTraceActive: expect.any(Boolean)
+    }))
+  })
+
+  test('"pre-existing" sessions get data from read()', () => {
+    const storageAPI = new LocalMemory({ [`${PREFIX}_${key}`]: { value, expiresAt: Infinity, inactiveAt: Infinity } })
+    const session = new SessionEntity({ agentIdentifier, key, storageAPI })
+    expect(session.isNew).toBeFalsy()
+    expect(session.read()).toEqual(expect.objectContaining({
+      value,
+      expiresAt: Infinity,
+      inactiveAt: Infinity
+    }))
+  })
+})
+
+describe('write()', () => {
+  test('write() sets data to top-level wrapper', () => {
+    const session = new SessionEntity({ agentIdentifier, key })
+    expect(session.value).not.toEqual(value)
+    expect(session.expiresAt).not.toEqual(Infinity)
+    expect(session.inactiveAt).not.toEqual(Infinity)
+    session.write({ value, expiresAt: Infinity, inactiveAt: Infinity })
+    expect(session.value).toEqual(value)
+    expect(session.expiresAt).toEqual(Infinity)
+    expect(session.inactiveAt).toEqual(Infinity)
+  })
+
+  test('write() sets data that read() can access', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key })
+    session.write({ value, expiresAt: now + 100, inactiveAt: now + 100 })
+    const read = session.read()
+    expect(read.value).toEqual(value)
+    expect(read.expiresAt).toEqual(now + 100)
+    expect(read.inactiveAt).toEqual(now + 100)
+  })
+
+  test('write() does not run with invalid data', () => {
+    const session = new SessionEntity({ agentIdentifier, key })
+    let out = session.write()
+    expect(out).toEqual(undefined)
+    out = session.write('string')
+    expect(out).toEqual(undefined)
+    out = session.write(123)
+    expect(out).toEqual(undefined)
+    out = session.write(true)
+    expect(out).toEqual(undefined)
+    out = session.write(false)
+    expect(out).toEqual(undefined)
+  })
+})
+
+describe('refresh()', () => {
+  test('refresh sets inactiveAt to future time', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, inactiveMs: 100 })
+    expect(session.inactiveAt).toEqual(now + 100)
+    jest.setSystemTime(now + 1000)
+    session.refresh()
+    expect(session.inactiveAt).toEqual(now + 100 + 1000)
+  })
+
+  test('refresh resets the entity if expiresTimer is invalid', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, value })
+    expect(session.value).toEqual(value)
+    session.write({ ...session.read(), expiresAt: now - 1 })
+    session.refresh()
+    expect(session.value).not.toEqual(value)
+  })
+
+  test('refresh resets the entity if inactiveTimer is invalid', () => {
+    const now = Date.now()
+    jest.setSystemTime(now)
+    const session = new SessionEntity({ agentIdentifier, key, value })
+    expect(session.value).toEqual(value)
+    session.write({ ...session.read(), inactiveAt: now - 1 })
+    session.refresh()
+    expect(session.value).not.toEqual(value)
+  })
+})
+
+describe('syncCustomAttribute()', () => {
+  test('Custom data can be managed by session entity', () => {
+    const session = new SessionEntity({ agentIdentifier, key })
+
+    // if custom has never been set, and a "delete" action is triggered, do nothing
+    session.syncCustomAttribute('test', null)
+    expect(session?.custom?.test).toEqual(undefined)
+
+    session.syncCustomAttribute('test', 1)
+    expect(session?.custom?.test).toEqual(1)
+
+    session.syncCustomAttribute('test', 'string')
+    expect(session?.custom?.test).toEqual('string')
+
+    session.syncCustomAttribute('test', false)
+    expect(session?.custom?.test).toEqual(false)
+
+    // null specifically deletes the object completely
+    session.syncCustomAttribute('test', null)
+    expect(session?.custom?.test).toEqual(undefined)
+  })
+
+  test('Only runs in browser scope', () => {
+    mockBrowserScope.mockReturnValue(false)
+    const session = new SessionEntity({ agentIdentifier, key })
+    session.syncCustomAttribute('test', 1)
+    expect(session.read().custom?.test).toEqual(undefined)
+  })
+})

package/src/common/storage/first-party-cookies.js

@@ -0,0 +1,31 @@
+export class FirstPartyCookies {
+  constructor (domain) {
+    this.domain = domain
+  }
+
+  get (name) {
+    try {
+      var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'))
+      if (match) return match[2]
+    } catch (err) {
+      return ''
+    }
+  }
+
+  set (key, value) {
+    try {
+      const cookie = `${key}=${value}; Domain=${domain}; Path=/`
+      document.cookie = cookie
+    } catch (err) {
+      return
+    }
+  }
+
+  remove (key) {
+    try {
+      return document.cookie = `${key}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; Domain=${domain}; Path=/`
+    } catch (err) {
+      return
+    }
+  }
+}

package/src/common/storage/local-memory.js

@@ -0,0 +1,30 @@
+export class LocalMemory {
+  constructor (initialState = {}) {
+    this.state = initialState
+  }
+
+  get (key) {
+    try {
+      return this.state[key]
+    } catch (err) {
+      return ''
+    }
+  }
+
+  set (key, value) {
+    try {
+      if (value === undefined || value === null) return this.remove(key)
+      this.state[key] = value
+    } catch (err) {
+      return
+    }
+  }
+
+  remove (key) {
+    try {
+      delete this.state[key]
+    } catch (err) {
+      return
+    }
+  }
+}

package/src/common/storage/local-memory.test.js

@@ -0,0 +1,19 @@
+import { LocalMemory } from './local-memory'
+
+test('Local-memory', () => {
+  const LM = new LocalMemory({ test: 1 })
+  expect(LM.state).toEqual({ test: 1 })
+  expect(LM.get('test')).toEqual(1)
+
+  LM.set('test', 2)
+  expect(LM.get('test')).toEqual(2)
+
+  LM.set('test')
+  expect(LM.get('test')).toEqual(undefined)
+
+  LM.set('test', 2)
+  expect(LM.get('test')).toEqual(2)
+
+  LM.remove('test')
+  expect(LM.get('test')).toEqual(undefined)
+})

package/src/common/storage/local-storage.js

@@ -0,0 +1,28 @@
+export class LocalStorage {
+  get (key) {
+    try {
+      // localStorage strangely type-casts non-existing data to "null"...
+      // Cast it back to undefined if it doesnt exist
+      return localStorage.getItem(key) || undefined
+    } catch (err) {
+      return ''
+    }
+  }
+
+  set (key, value) {
+    try {
+      if (value === undefined || value === null) return this.remove(key)
+      return localStorage.setItem(key, value)
+    } catch (err) {
+      return
+    }
+  }
+
+  remove (key) {
+    try {
+      localStorage.removeItem(key)
+    } catch (err) {
+      return
+    }
+  }
+}