From 4c4304a41984e5a46d0ce94f175f6fa86fbb0808 Mon Sep 17 00:00:00 2001 From: sylenien Date: Tue, 30 Aug 2022 16:19:31 +0200 Subject: [PATCH 1/4] feat(tracker): capture pinia state updates --- tracker/tracker-vuex/src/index.ts | 70 ++++++++++++++++++++++--------- 1 file changed, 51 insertions(+), 19 deletions(-) diff --git a/tracker/tracker-vuex/src/index.ts b/tracker/tracker-vuex/src/index.ts index 30333904e..68256dc20 100644 --- a/tracker/tracker-vuex/src/index.ts +++ b/tracker/tracker-vuex/src/index.ts @@ -1,10 +1,35 @@ -import { App, Messages } from '@openreplay/tracker'; +import { App, Messages } from "@openreplay/tracker"; import { Encoder, sha1 } from "./syncod/index.js"; export interface Options { filter: (mutation: any, state: any) => boolean; transformer: (state: any) => any; mutationTransformer: (mutation: any) => any; + storeName?: string; +} + +function processMutationAndState( + app: App, + options: Options, + encoder: Encoder, + mutation: any, + state: any +) { + if (options.filter(mutation, state)) { + try { + const { type } = mutation; + if (typeof type === "string" && type) { + app.send(Messages.StateAction(type)); + } + const _mutation = encoder.encode(options.mutationTransformer(mutation)); + const _state = encoder.encode(options.transformer(state)); + const _table = encoder.commit(); + for (let key in _table) app.send(Messages.OTable(key, _table[key])); + app.send(Messages.Vuex(_mutation, _state)); + } catch { + encoder.clear(); + } + } } export default function(opts: Partial = {}) { @@ -12,7 +37,8 @@ export default function(opts: Partial = {}) { { filter: () => true, transformer: state => state, - mutationTransformer: mutation => mutation + mutationTransformer: mutation => mutation, + storeName: undefined, }, opts ); @@ -21,26 +47,32 @@ export default function(opts: Partial = {}) { return Function.prototype; } const encoder = new Encoder(sha1, 50); + const state = {}; return store => { - store.subscribe((mutation, state) => { - if (options.filter(mutation, state)) { + // Vuex + if (store.subscribe) { + const randomId = Math.random().toString(36).substring(2, 9) + store.subscribe((mutation, storeState) => { + state[options.storeName || randomId] = state + processMutationAndState(app, options, encoder, mutation, storeState); + }); + } + + // Pinia + if (store.$onAction) { + store.$onAction(({ name, store, args }) => { try { - const { type } = mutation; - if (typeof type === 'string' && type) { - app.send(Messages.StateAction(type)); - } - const _mutation = encoder.encode( - options.mutationTransformer(mutation) - ); - const _state = encoder.encode(options.transformer(state)); - const _table = encoder.commit(); - for (let key in _table) app.send(Messages.OTable(key, _table[key])); - app.send(Messages.Vuex(_mutation, _state)); - } catch { - encoder.clear(); + state[options.storeName || store.$id] = store.$state; + const mutation = { + type: name, + payload: args + }; + processMutationAndState(app, options, encoder, mutation, state); + } catch (e) { + app.debug.error(e) } - } - }); + }); + } }; }; } From dff9cd92bfdca3bff4aa5ab5ed906c67a94e665c Mon Sep 17 00:00:00 2001 From: sylenien Date: Tue, 30 Aug 2022 16:29:10 +0200 Subject: [PATCH 2/4] feat(tracker): fix store name arg --- tracker/tracker-vuex/src/index.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/tracker/tracker-vuex/src/index.ts b/tracker/tracker-vuex/src/index.ts index 68256dc20..37cd0d2cc 100644 --- a/tracker/tracker-vuex/src/index.ts +++ b/tracker/tracker-vuex/src/index.ts @@ -5,7 +5,6 @@ export interface Options { filter: (mutation: any, state: any) => boolean; transformer: (state: any) => any; mutationTransformer: (mutation: any) => any; - storeName?: string; } function processMutationAndState( @@ -38,7 +37,6 @@ export default function(opts: Partial = {}) { filter: () => true, transformer: state => state, mutationTransformer: mutation => mutation, - storeName: undefined, }, opts ); @@ -48,12 +46,12 @@ export default function(opts: Partial = {}) { } const encoder = new Encoder(sha1, 50); const state = {}; - return store => { + return (store, storeName) => { // Vuex if (store.subscribe) { const randomId = Math.random().toString(36).substring(2, 9) store.subscribe((mutation, storeState) => { - state[options.storeName || randomId] = state + state[storeName || randomId] = state processMutationAndState(app, options, encoder, mutation, storeState); }); } @@ -62,7 +60,7 @@ export default function(opts: Partial = {}) { if (store.$onAction) { store.$onAction(({ name, store, args }) => { try { - state[options.storeName || store.$id] = store.$state; + state[storeName || store.$id] = store.$state; const mutation = { type: name, payload: args From 0003e1130356f3feb72984df6cd626843e8fccba Mon Sep 17 00:00:00 2001 From: sylenien Date: Wed, 31 Aug 2022 09:47:29 +0200 Subject: [PATCH 3/4] fix(tracker): fix store naming --- tracker/tracker-vuex/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tracker/tracker-vuex/src/index.ts b/tracker/tracker-vuex/src/index.ts index 37cd0d2cc..f8d8c1dba 100644 --- a/tracker/tracker-vuex/src/index.ts +++ b/tracker/tracker-vuex/src/index.ts @@ -46,7 +46,7 @@ export default function(opts: Partial = {}) { } const encoder = new Encoder(sha1, 50); const state = {}; - return (store, storeName) => { + return (storeName: string) => (store) => { // Vuex if (store.subscribe) { const randomId = Math.random().toString(36).substring(2, 9) From 96f563b0999bd499e302bbbec802ca953ed0f106 Mon Sep 17 00:00:00 2001 From: sylenien Date: Wed, 7 Sep 2022 15:53:41 +0200 Subject: [PATCH 4/4] change(tracker): change version to 4.0 --- tracker/tracker-vuex/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tracker/tracker-vuex/package.json b/tracker/tracker-vuex/package.json index 005a9393c..69f43df64 100644 --- a/tracker/tracker-vuex/package.json +++ b/tracker/tracker-vuex/package.json @@ -1,7 +1,7 @@ { "name": "@openreplay/tracker-vuex", "description": "Tracker plugin for Vuex state recording", - "version": "3.0.0", + "version": "4.0.0", "keywords": [ "vuex", "logging",