Immer: Array out-of-range assignments are not picked up properly in IE 11

[toli444]

🐛 Bug Report

If my state is an object and I set a property to it of array with not existed index:

import { set } from 'lodash';

const state = {
    field: []
} 

produce(state, draft => {
     set(draft, 'field[2]', '2')

     return draft
}

I get this as a result:

{
     field: [undefined, undefined, '2']
}

and if then I set some other array index that goes before the one I used previously:

set(draft, 'field[1]', '1')

I still get:

{
     field: [undefined, undefined, '2']
}

Whereas I would expect to get:

{
     field: [undefined, '1' , '2']
}

Additional context

It works fine in Chrome, Firefox, also when you first set index 1 then 2 (in my example I have the bug because I first set 2 then 1) and also it works as expected when you explicitly define the array with undefined values or something (like [undefined, undefined, undefined])

Environment

IE11
Immer version 6+

[mweststrate]

Pretty sure the problem is solved if you don't use lodash.set. There is really no reason to use lodash.set if you are using immer. I'll expect draft.field[2] = 2 will already do the trick. If it doesn't you might need to set a length explicitly first. But in any case, bug reports without reproduction are inactionable, so please attach a reproduction or close the issue. IE 11 behavior can often be simulate by explicitly setting useProxies(false)

[toli444]

@mweststrate here is codesandbox with the issue (w/o lodash):

https://codesandbox.io/s/laughing-lovelace-rfxhc?file=/src/index.js

• First click on the first button, then on the second - no issue.
• Reload the page
• First click on the second button then on the first - issue occures.

[toli444]

Any updates on this issue?

[mweststrate]

Looks like a bug indeed. But note that out-of-range assignments are an anti pattern though (which is probably why nobody did run into this before). I recommend to use push to add items, or if your collection is intended to be sparse, to use maps.

[mweststrate]

Thanks for the detailed report!

[aleclarson]

:tada: This issue has been resolved in version 7.0.7 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: