diff --git a/package.json b/package.json index 6b5a5fe..096eda0 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "redux-iframe", "description": "Build stateful micro frontends by sharing Redux state and actions between iframe modules and container applications", - "version": "1.1.0", + "version": "1.1.1", "license": "MIT", "keywords": [ "redux", diff --git a/src/events/event-listener.ts b/src/events/event-listener.ts index 1774f30..f7b6327 100644 --- a/src/events/event-listener.ts +++ b/src/events/event-listener.ts @@ -14,6 +14,10 @@ type EventListenerOptions = { * or if the arrays actionsToSend and acceptedActions are disjoint. */ addMarker: boolean + /** + * If true, log all received messages from iFrame and their event.data. + */ + verbose: boolean } /** @@ -23,9 +27,9 @@ type EventListenerOptions = { * @param acceptedActions array of types (strings) of accepted actions * @param options parameters to control the event listener */ -export const installEventListener = (store: Store, acceptedActions: Array, options: EventListenerOptions = { addMarker: true }) => { +export const installEventListener = (store: Store, acceptedActions: Array, options: EventListenerOptions = { addMarker: true, verbose: false }) => { window.addEventListener('message', event => { - console.log('Received message', event.data) + if (options.verbose) console.log('Received message', event.data) try { const action: AnyAction = JSON.parse(event.data) if (action.type && acceptedActions.includes(action.type)) { diff --git a/src/events/event-sender.ts b/src/events/event-sender.ts index 00443c8..11f220d 100644 --- a/src/events/event-sender.ts +++ b/src/events/event-sender.ts @@ -29,8 +29,9 @@ export const createModuleEventSender = (actionsToSend: Array, iFrameId: * @param windowSelector function that returns the target window for the message * @param actionsToSend array of types (strings) of actions to be sent to the target window * @param targetOrigin the target origin (URL), defaults to the URL of the current window + * @param verbose boolean that logs sent message to console if true */ -const createEventSenderMiddleware = (windowSelector: WindowSelector, actionsToSend: Array, targetOrigin: string): Middleware => { +const createEventSenderMiddleware = (windowSelector: WindowSelector, actionsToSend: Array, targetOrigin: string, verbose: boolean = false): Middleware => { return (store: MiddlewareAPI>) => { return (next: Dispatch) => { return (action: AnyAction) => { @@ -43,7 +44,7 @@ const createEventSenderMiddleware = (windowSelector: WindowSelector, actionsToSe const targetWindow = windowSelector() if (targetWindow) { // Target window (iframe) may not be loaded at the moment const message = JSON.stringify(action) - console.log('Sending message', message) + if (verbose) console.log('Sending message', message) targetWindow.postMessage(message, targetOrigin) } } diff --git a/src/global/parent-state.ts b/src/global/parent-state.ts index f6fe404..2af09b0 100644 --- a/src/global/parent-state.ts +++ b/src/global/parent-state.ts @@ -15,16 +15,16 @@ import { Store } from 'redux' * * @param keys array of Redux top-level keys to copy from * @param globalName name of the global variable holding the Redux store + * @param verbose boolean that logs loaded state to console if true * @return a slice of the store of the parent window or undefined if no parent window exists */ -export const getParentState = (keys: Array, globalName: string = 'ReduxStore'): Object | undefined => { +export const getParentState = (keys: Array, globalName: string = 'ReduxStore', verbose: boolean = false): Object | undefined => { if (window.parent && typeof (window.parent as any)[globalName] === 'object') { const parentStore: Store = (window.parent as any)[globalName] if (typeof parentStore.getState === 'function') { const parentState = parentStore.getState() const filteredState = filterState(parentState, keys) - // TODO: Remove or configure log output - console.log('Loaded state from parent window:', filteredState) + if (verbose) console.log('Loaded state from parent window:', filteredState) return filteredState } } diff --git a/src/storage/web-storage.ts b/src/storage/web-storage.ts index cc5fa26..c2ac5ee 100644 --- a/src/storage/web-storage.ts +++ b/src/storage/web-storage.ts @@ -41,8 +41,9 @@ const DEFAULT_STORAGE_OPTIONS : StorageOptions = { * * @param keys array of Redux top-level keys to load * @param options storage options (which default to rootKey: 'state' and storage: SESSION) + * @param verbose boolean that logs loaded state to console if true */ -export const getStoredState = (keys: Array, options: StorageOptions = DEFAULT_STORAGE_OPTIONS): Object | undefined => { +export const getStoredState = (keys: Array, options: StorageOptions = DEFAULT_STORAGE_OPTIONS, verbose: boolean = false): Object | undefined => { const storage = getStorage(options.storageType || StorageType.SESSION) if (storage) { try { @@ -52,8 +53,7 @@ export const getStoredState = (keys: Array, options: StorageOptions = DE return undefined } const filteredState = filterState(JSON.parse(serializedState), keys) - // TODO: Remove or configure log output - console.log('Loaded state from storage:', filteredState) + if (verbose) console.log('Loaded state from storage:', filteredState) return filteredState } catch (err) { console.warn('Cannot read from storage:', err) @@ -102,15 +102,15 @@ const getStorage = (storageType: StorageType) => { * * @param state the Redux state object * @param options storage options (which default to rootKey: 'state' and storage: SESSION) + * @param verbose boolean that logs saved state to console if true * @return true if storing succeeded, false otherwise */ -const saveState = (state: Object, options: StorageOptions): boolean => { +const saveState = (state: Object, options: StorageOptions, verbose: boolean = false): boolean => { const storage = getStorage(options.storageType || StorageType.SESSION) if (storage) { try { if (state) { - // TODO: Remove or configure log output - console.log('Saved state to storage:', state) + if (verbose) console.log('Saved state to storage:', state) storage.setItem(options.rootKey || ROOT_KEY, JSON.stringify(state)) return true }