When an array has more than 21 items, it is parsed from a url string into an object, instead of array

Following an error that array.includes is not a function, it turns out that when an array which is longer than 21 items is translated into a url query string (using qs.stringify), and than the url string is parsed (using qs.parse) it returns an object, not an array. This can obviously cause issues when you expect an array and it’s methods.

console.log( typeof(qs.parse(qs.stringify({activities:[....array 20 items long]})) ) // Array
console.log( typeof(qs.parse(qs.stringify({activities:[....array 22 items long]})) ) // Object

[jmikrut]

@ljharb — I can give some more info here.

@samicodesit is hitting the same issue that I am. Although arrayLimit is an option for qs.parse, it is not an option for qs.stringify. So, when we attempt to stringify an array with more than 20 items in the array, the function appears to use arrayFormat: 'indices' instead of the desired ``arrayFormat: ‘brackets’`.

We just need an option to specify an arrayLimit in the stringify method.

Also, THANK YOU for this package. We are heavily using qs in Payload CMS and have just run into this same need.

UPDATE:

I just found that this was actually not caused by the qs.stringify method on our frontend app—instead, it was caused by the qs-middleware package that we used on the backend, which was responsible for parsing incoming query strings. I needed to set the arrayLimit in that middleware, in order to parse large arrays. I thought it was the frontend stringify but it was actually the backend.

@samicodesit you might be having the same issue?

[ljharb]

This is the arrayLimit option, which is documented in the readme.