getItem and setItem value implementation for localstorage

[bochap]

Hi,

Thanks for the nice work in creating this. I was working with it and I am wondering it both the setItem and getItem should force the value to become a string. Looking back into the specs. The interface shows that the values should be DOMString. I am not sure if I am reading the DOMString spec right but that appears to be a string as well. Mozilla indicates it to be a string as well.

I am wondering if there might be code required to handle JSON values as well. I tried accessing the store for github and I think the value is converted to be a string on Chrome and Firefox when the value is a json object

jest-localstorage-mock/src/localstorage.js

Lines 3 to 13 in 50f3dfb

	Object.defineProperty(this, 'getItem', {
	enumerable: false,
	value: jest.fn(key => this[key] || null),
	});
	Object.defineProperty(this, 'setItem', {
	enumerable: false,
	// not mentioned in the spec, but we must always coerce to a string
	value: jest.fn((key, val = '') => {
	this[key] = val + '';
	}),
	});

Image of localStorage.getItem in Chrome and Mozilla for json values

Image of interface for localStorage

Reference: https://html.spec.whatwg.org/multipage/webstorage.html

DOMString:
https://heycam.github.io/webidl/#idl-DOMString
https://developer.mozilla.org/en-US/docs/Web/API/DOMString

[rodrigograca31]

I'm having a similar issue.

after doing localStorage.setItem('token', null); or trying to get a key that doesnt exist like localStorage.getItem('non-existing-key'); it returns "null" as a string.

this causes problems because my code is if (!token) which in the browser is if(!null) and evaluates to true but here is if(!"null") and evaluates to false........

the way I solved my problem was: localStorage.clear(); on the test file, then my component get an actual null

(also I remove this plugin and was still getting the same functionality/problem.... I wonder what was up with that.......... 🤔)

[bochap]

Actually if you do "localStorage.setItem('token', null)" and "localStorage.getItem('token')" following that it should give you "null". That is actually the correct behavior according to the W3C specifications for localStorage. The image below shows the behavior in Safari, Firefox and Chrome. So you might want to check your code's behavior in the browsers. The mock does not follow the behavior of the specifications. Since it stores and returns the values as the type that you supplies to it

[rodrigograca31]

True....! and now I can't replicate my problem on my tests..... not sure why..... 🤔
maybe I got confused yesterday... sorry 🙏