Emit vuexPersistStateRestored when state replaced for async stores

[morphatic]

Addresses issue raised in issue 15 by @rulrok. Also addresses #56.

This PR contains updated indext.ts as well as README.md to update the documentation on how to use the new event.

As noted in the docs, the store is not immediately restored from asnyc stores like localForage. This
can have the unfortunate side effect of overwriting mutations to the store that happen before
vuex-persist has a chance to do its thing. In strict mode, you can create a plugin to
subscribe to RESTORE_MUTATION so that you tell your app to wait until the state has been
restored before committing any further mutations. (Issue #15 demonstrates how to write such a
plugin.) However, since you should
turn strict mode off in production, and since vuex doesn't currently provide any kind of
notification when replaceState() has been called,
this PR would cause vuex-persist to emit a vuexPersistStateRestored event and also set
a vuexPersistStateRestored flag to let you know the state has been restored and that it is
now safe to commit any mutations that modify the stored state.

Here's an example of a beforeEach() hook in vuex-router that will cause your app to wait
for vuex-persist to restore the state before taking any further actions:

// in src/router.js
import Vue from 'vue'
import Router from 'vue-router'
import { store } from '@/store' // ...or wherever your `vuex` store is defined

Vue.use(Router)

const router = new Router({
  // define your router as you normally would
})

const waitForStorageToBeReady = (to, from, next) => {
  if (!store._vm.$root.$data['vuexPersistStateRestored']) {
    store._vm.$root.$on('vuexPersistStateRestored', () => {
      next()
    })
  } else {
    next()
  }
}
router.beforeEach(waitForStorageToBeReady)

export default router

Note 1: store._vm.$root.$data['vuexPersistStateRestored'] will be undefined and therefore
"falsy" prior to being set to true by the vuex-persist plugin. There should be no need
to explicitly give it a value at any point.

Note 2: My linter automatically added in some spaces in the import statements at the top of the module, and also reformatted the indentation of restoreState() and saveState(). I tried to revert and reapply my changes with the linter off so that this wouldn't happen, but it seemed to be following the rules already expressed in tslint.json so I gave up and left it as is. I don't make a habit of reformatting other people's code. ;)

[codecov]

Codecov Report

Merging #107 into master will increase coverage by 0.28%.
The diff coverage is 62.5%.

@@            Coverage Diff             @@
##           master     #107      +/-   ##
==========================================
+ Coverage   83.47%   83.76%   +0.28%     
==========================================
  Files           5        5              
  Lines         115      117       +2     
  Branches       38       38              
==========================================
+ Hits           96       98       +2     
  Misses          7        7              
  Partials       12       12

Impacted Files	Coverage Δ
src/index.ts	78.37% <62.5%> (+0.6%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 63651d3...3ea9371. Read the comment docs.

[darthf1]

What needs to happen to get this merged? Looking for this feature specifically.

[morphatic]

In the meantime, you can install directly from my fork:

// package.json
{
  dependencies: {
    // ... other stuff
    "vuex-persist": "github:morphatic/vuex-persist"
  }
}

Hth

[ssuess]

Is there a plan to merge this soon? I also need this to be able to continue with vuex-persist. Thanks!

[championswimmer]

Will take a look and merge today

…

On Tue 21 May, 2019, 11:29 AM Stephen, ***@***.***> wrote: Is there a plan to merge this soon? I also need this to be able to continue with vuex-persist. Thanks! — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#107?email_source=notifications&email_token=AAKD7STM6EUWGGWAFMTF7O3PWOFUPA5CNFSM4HEEFZK2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODV22YJA#issuecomment-494251044>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAKD7SX77LA5WT2HS4ASJGDPWOFUPANCNFSM4HEEFZKQ> .

[championswimmer]

Please do not contribute dist files to the repository. Those are autogenerated when I publish.

Also is it possible to add tests for the code you added, as that will prevent coverage % from falling.

[morphatic]

Sorry. The dist files were not a part of the original PR. GitHub added them automatically later when I added them to my repo. I didn't know that would happen. I only added them to my repo because I wanted to be able to install the forked plugin directly from github rather than publishing the forked repo to npm. It's too confusing to figure out how to roll back some of the changes. I'm going to close this PR, delete my fork, create a new fork, then submit a new PR with just the necessary changes, adding tests. Look for a new PR shortly.