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 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..206e7a7 100644 --- a/src/test/controllers/localStorage_test.ts +++ b/src/test/controllers/localStorage_test.ts @@ -103,4 +103,43 @@ 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); + }); + + suite('without default value', () => { + setup(async () => { + controller = new LocalStorageController(element, 'test-key'); + element.controllers.push(controller); + await element.updateComplete; + }); + + test('initialises to saved value', () => { + 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]'); + }); + + suite('with default value', () => { + setup(async () => { + controller = new LocalStorageController(element, 'test-key', [5, 6]); + element.controllers.push(controller); + await element.updateComplete; + }); + + test('initialises to saved value', () => { + 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..6557fed 100644 --- a/src/test/controllers/sessionStorage_test.ts +++ b/src/test/controllers/sessionStorage_test.ts @@ -105,5 +105,48 @@ suite('SessionStorageController', () => { assert.equal(element.shadowRoot!.textContent, '[5,6]'); 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); + }); + + suite('without default value', () => { + setup(async () => { + controller = new SessionStorageController(element, 'test-key'); + element.controllers.push(controller); + await element.updateComplete; + }); + + test('initialises to saved value', () => { + 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]'); + }); + + suite('with default value', () => { + setup(async () => { + controller = new SessionStorageController( + element, + 'test-key', + [5, 6] + ); + element.controllers.push(controller); + await element.updateComplete; + }); + + test('initialises to saved value', () => { + 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]'); + }); + }); + }); + }); }); });