flipstate/dev-tool.js at master · concept-not-found/flipstate · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
export default (getThat, getUpdate) => {
  if (!process || !process.env || process.env.NODE_ENV === 'production') {
    return () => {}
  }
  let devToolSubscribed
  function sendStateToDevTool () {
    const {origin, source} = devToolSubscribed
    source.postMessage({
      protocol: 'flipstate-devtool v1',
      type: 'application state',
      location: window.location.href,
      state: JSON.stringify(getThat().state)
    }, origin)
    devToolSubscribed = undefined
  }
  window.addEventListener('message', (event) => {
    const {origin, data = {}, source} = event
    if (!origin.startsWith('http://localhost:') && origin !== 'https://concept-not-found.github.io') {
      return
    }
    switch (data.type) {
      case 'get state':
        devToolSubscribed = {
          source,
          origin
        }
        return sendStateToDevTool()
      case 'set state':
        return getUpdate()(JSON.parse(data.state))
      case 'subscribe state update':
        devToolSubscribed = {
          source,
          origin
        }
        return
      case 'move history backwards':
        window.history.go(-1)
        return sendStateToDevTool()
      case 'move history forwards':
        window.history.go(1)
        return sendStateToDevTool()
      default:
        // ignore messages we don't understand
    }
  }, false)

  return () => {
    if (devToolSubscribed) {
      sendStateToDevTool()
    }
  }
}