title: Cannot assign to read only property
body: <p>I am having some trouble understanding why I am getting an error message:</p>
  
  <blockquote>
    <p>TypeError: Cannot assign to read only property 'description' of object '#'</p>
  </blockquote>
  
  <p>I know that the principle is that I don't want to modify state in my reducer. Instead, I want to return a new copy of the state.</p>
  
  <p>Here is my reducer:</p>
  
  <pre><code>action TOGGLE_CHECKBOX:
      {
          let copyOfItems = [...state.items]; // create a new array of items
  
          copyOfItems.forEach(i =&gt; i.description = "newDescription");
  
          // return a new copy of the state
          return {
              ...state,
              items: copyOfItems
          }
      }
  </code></pre>
  
  <p>And here is my Reducer test:</p>
  
  <pre><code>it ('Test that each item description is set', () =&gt; {
      const state = {
          items: [
              { description: "d1" },
              { description: "d2" }
          ]
      }
  
      deepFreeze(state);
  
      expect(MyReducer(state, { type: TOGGLE_CHECKBOX })).toEqual({
          items: [
              { description: "newDescription" },
              { description: "newDescription" }
          ]
      });
  });
  </code></pre>
  
  <p>However, I get the above error message. If I remove the <code>deepFreeze</code> the test passes. This means that I am somehow modifying the original state in some way but I can't figure out why especially because I created a new array of spreaded items.</p>
  
  <p>Any help would be greatly appreciated.</p>