title: Nuxt/Vuex object with Firebase DocumentReference causes [vuex] do not mutate vuex store state outside mutation handlers
body: <p>So I have this issue where creating a snapshot to the collection keeps getting me the error:</p>
  <p><code>[vuex] do not mutate vuex store state outside mutation handlers</code></p>
  <p>The code I have is as follows. I have an Action in the Vuex store to create a snapshot of the collection in firestore. Having the <code>doc.ref</code> is what is causing me the issue. If I remove this the mutation goes through without a problem. But if I leave the <code>doc.ref</code> I get the previously mentioned error.</p>
  <pre><code> getAllProjects({commit, state}) {
      firebase.firestore()
          .collection(&quot;users&quot;)
          .doc(state.loggedInUser.id)
          .collection(&quot;projects&quot;)
          .onSnapshot(snapshot =&gt; {
              let projects = []
              snapshot.docs.forEach(doc =&gt; {
                  let pr = new Project(doc.ref, doc.id, doc.data().title, doc.data().languages, doc.data().baseLanguage);
                  projects.push(pr);
              })
              commit('setProjects', [...projects]);
          });
  }
  </code></pre>
  <p>Mutation:</p>
  <pre><code>setProjects(state, projects) {
      state.projects = projects
  },
  </code></pre>