From 034fa9b081340ab917b5d9db830b2559426959b6 Mon Sep 17 00:00:00 2001
From: Jorge del Casar <948953+jorgecasar@users.noreply.github.com>
Date: Mon, 5 Feb 2024 11:42:09 +0100
Subject: [PATCH] fix: recover stored value on init (#26)

Closes #25
---
 src/_internal/storage.ts                    |  1 +
 src/test/controllers/localStorage_test.ts   | 31 +++++++++++++++++++++
 src/test/controllers/sessionStorage_test.ts | 31 +++++++++++++++++++++
 3 files changed, 63 insertions(+)

diff --git a/src/_internal/storage.ts b/src/_internal/storage.ts
index bbbfbde..460641b 100644
--- a/src/_internal/storage.ts
+++ b/src/_internal/storage.ts
@@ -45,6 +45,7 @@ export abstract class StorageController<T> implements ReactiveController {
     this.__storage = storage;
     this.__key = key;
     this.__initialValue = defaultValue;
+    this.__value = this.__readValueFromStorage();
 
     host.addController(this);
   }
diff --git a/src/test/controllers/localStorage_test.ts b/src/test/controllers/localStorage_test.ts
index 6949a64..44b811d 100644
--- a/src/test/controllers/localStorage_test.ts
+++ b/src/test/controllers/localStorage_test.ts
@@ -103,4 +103,35 @@ suite('LocalStorageController', () => {
       assert.is(storageValue, '[5,6]');
     });
   });
+
+  suite('with saved value', () => {
+    setup(() => {
+      window.localStorage.setItem('test-key', JSON.stringify([7, 8]));
+      element = document.createElement('test-element') as TestElement;
+      element.template = () => html`${JSON.stringify(controller.value)}`;
+      document.body.appendChild(element);
+    });
+
+    test('initialises to saved value', async () => {
+      controller = new LocalStorageController(element, 'test-key');
+      element.controllers.push(controller);
+      await element.updateComplete;
+
+      const storageValue = window.localStorage.getItem('test-key');
+      assert.equal(controller.value, [7, 8]);
+      assert.equal(element.shadowRoot!.textContent, '[7,8]');
+      assert.is(storageValue, '[7,8]');
+    });
+
+    test('ignore default value and use saved value', async () => {
+      controller = new LocalStorageController(element, 'test-key', [9, 10]);
+      element.controllers.push(controller);
+      await element.updateComplete;
+
+      const storageValue = window.localStorage.getItem('test-key');
+      assert.equal(controller.value, [7, 8]);
+      assert.equal(element.shadowRoot!.textContent, '[7,8]');
+      assert.is(storageValue, '[7,8]');
+    });
+  });
 });
diff --git a/src/test/controllers/sessionStorage_test.ts b/src/test/controllers/sessionStorage_test.ts
index 7484660..5d78ed9 100644
--- a/src/test/controllers/sessionStorage_test.ts
+++ b/src/test/controllers/sessionStorage_test.ts
@@ -106,4 +106,35 @@ suite('SessionStorageController', () => {
       assert.is(storageValue, '[5,6]');
     });
   });
+
+  suite('with saved value', () => {
+    setup(() => {
+      window.sessionStorage.setItem('test-key', JSON.stringify([7, 8]));
+      element = document.createElement('test-element') as TestElement;
+      element.template = () => html`${JSON.stringify(controller.value)}`;
+      document.body.appendChild(element);
+    });
+
+    test('initialises to saved value', async () => {
+      controller = new SessionStorageController(element, 'test-key');
+      element.controllers.push(controller);
+      await element.updateComplete;
+
+      const storageValue = window.sessionStorage.getItem('test-key');
+      assert.equal(controller.value, [7, 8]);
+      assert.equal(element.shadowRoot!.textContent, '[7,8]');
+      assert.is(storageValue, '[7,8]');
+    });
+
+    test('ignore default value and use saved value', async () => {
+      controller = new SessionStorageController(element, 'test-key', [9, 10]);
+      element.controllers.push(controller);
+      await element.updateComplete;
+
+      const storageValue = window.sessionStorage.getItem('test-key');
+      assert.equal(controller.value, [7, 8]);
+      assert.equal(element.shadowRoot!.textContent, '[7,8]');
+      assert.is(storageValue, '[7,8]');
+    });
+  });
 });