diff --git a/packages/app-cli/tests/support/plugins/toc/src/webview.js b/packages/app-cli/tests/support/plugins/toc/src/webview.js index 96755a8fee..d8f846b562 100644 --- a/packages/app-cli/tests/support/plugins/toc/src/webview.js +++ b/packages/app-cli/tests/support/plugins/toc/src/webview.js @@ -1,6 +1,7 @@ document.addEventListener('click', event => { const element = event.target; if (element.className === 'toc-item-link') { + console.debug('TOC Plugin Webview: Sending scrollToHash message', element.dataset.slug); webviewApi.postMessage({ name: 'scrollToHash', hash: element.dataset.slug, diff --git a/packages/app-desktop/gui/MainScreen/MainScreen.tsx b/packages/app-desktop/gui/MainScreen/MainScreen.tsx index a5402b1478..acaa3d49be 100644 --- a/packages/app-desktop/gui/MainScreen/MainScreen.tsx +++ b/packages/app-desktop/gui/MainScreen/MainScreen.tsx @@ -30,6 +30,7 @@ import { themeStyle } from '@joplin/lib/theme'; import validateLayout from '../ResizableLayout/utils/validateLayout'; import iterateItems from '../ResizableLayout/utils/iterateItems'; import removeItem from '../ResizableLayout/utils/removeItem'; +import Logger from '@joplin/lib/Logger'; const { connect } = require('react-redux'); const { PromptDialog } = require('../PromptDialog.min.js'); @@ -38,6 +39,8 @@ const PluginManager = require('@joplin/lib/services/PluginManager'); const EncryptionService = require('@joplin/lib/services/EncryptionService'); const ipcRenderer = require('electron').ipcRenderer; +const logger = Logger.create('MainScreen'); + interface LayerModalState { visible: boolean; message: string; @@ -564,6 +567,7 @@ class MainScreenComponent extends React.Component { } userWebview_message(event: any) { + logger.debug('Got message (WebView => Plugin) (2)', event); PluginService.instance().pluginById(event.pluginId).viewController(event.viewId).emitMessage(event); } diff --git a/packages/app-desktop/package-lock.json b/packages/app-desktop/package-lock.json index 7246d4924b..caaaee65a9 100644 --- a/packages/app-desktop/package-lock.json +++ b/packages/app-desktop/package-lock.json @@ -1,6 +1,6 @@ { "name": "@joplin/app-desktop", - "version": "1.4.12", + "version": "1.4.13", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/packages/app-desktop/package.json b/packages/app-desktop/package.json index 5728fa13c6..447deddf87 100644 --- a/packages/app-desktop/package.json +++ b/packages/app-desktop/package.json @@ -1,6 +1,6 @@ { "name": "@joplin/app-desktop", - "version": "1.4.12", + "version": "1.4.13", "description": "Joplin for Desktop", "main": "main.js", "private": true, diff --git a/packages/app-desktop/services/plugins/PluginRunner.ts b/packages/app-desktop/services/plugins/PluginRunner.ts index d7ef0db86e..d7664a9612 100644 --- a/packages/app-desktop/services/plugins/PluginRunner.ts +++ b/packages/app-desktop/services/plugins/PluginRunner.ts @@ -6,8 +6,11 @@ import bridge from '../bridge'; import Setting from '@joplin/lib/models/Setting'; import { EventHandlers } from '@joplin/lib/services/plugins/utils/mapEventHandlersToIds'; import shim from '@joplin/lib/shim'; +import Logger from '@joplin/lib/Logger'; const ipcRenderer = require('electron').ipcRenderer; +const logger = Logger.create('PluginRunner'); + enum PluginMessageTarget { MainWindow = 'mainWindow', Plugin = 'plugin', @@ -127,7 +130,9 @@ export default class PluginRunner extends BasePluginRunner { const mappedArgs = mapEventIdsToHandlers(plugin.id, message.args); const fullPath = `joplin.${message.path}`; - this.logger().debug(`PluginRunner: execute call: ${fullPath}: ${mappedArgs}`); + // Don't log complete HTML code, which can be long, for setHtml calls + const debugMappedArgs = fullPath.includes('setHtml') ? '' : mappedArgs; + logger.debug(`Got message (3): ${fullPath}: ${debugMappedArgs}`); let result: any = null; let error: any = null; diff --git a/packages/app-desktop/services/plugins/UserWebview.tsx b/packages/app-desktop/services/plugins/UserWebview.tsx index e8b659f468..9384cf8d7e 100644 --- a/packages/app-desktop/services/plugins/UserWebview.tsx +++ b/packages/app-desktop/services/plugins/UserWebview.tsx @@ -7,7 +7,10 @@ import useSubmitHandler from './hooks/useSubmitHandler'; import useHtmlLoader from './hooks/useHtmlLoader'; import useWebviewToPluginMessages from './hooks/useWebviewToPluginMessages'; import useScriptLoader from './hooks/useScriptLoader'; -const styled = require('styled-components').default; +import Logger from '@joplin/lib/Logger'; +import styled from 'styled-components'; + +const logger = Logger.create('UserWebview'); export interface Props { html: string; @@ -72,6 +75,9 @@ function UserWebview(props: Props, ref: any) { function postMessage(name: string, args: any = null) { const win = frameWindow(); if (!win) return; + + logger.debug('Got message', name, args); + win.postMessage({ target: 'webview', name, args }, '*'); } @@ -112,6 +118,7 @@ function UserWebview(props: Props, ref: any) { useWebviewToPluginMessages( frameWindow(), + isReady, props.onMessage, props.pluginId, props.viewId diff --git a/packages/app-desktop/services/plugins/UserWebviewIndex.js b/packages/app-desktop/services/plugins/UserWebviewIndex.js index e88a1d41b3..4562b59761 100644 --- a/packages/app-desktop/services/plugins/UserWebviewIndex.js +++ b/packages/app-desktop/services/plugins/UserWebviewIndex.js @@ -58,10 +58,10 @@ const webviewApi = { setHtml: (args) => { contentElement.innerHTML = args.html; - console.debug('UserWebView frame: setting html to', args.html); + // console.debug('UserWebviewIndex: setting html to', args.html); window.requestAnimationFrame(() => { - console.debug('UserWebView frame: setting html callback', args.hash); + console.debug('UserWebviewIndex: setting html callback', args.hash); window.postMessage({ target: 'UserWebview', message: 'htmlIsSet', hash: args.hash }, '*'); }); }, @@ -105,6 +105,7 @@ const webviewApi = { if (!ipc[callName]) { console.warn('Missing IPC function:', event.data); } else { + console.debug('UserWebviewIndex: Got message', callName, args); ipc[callName](args); } })); @@ -115,7 +116,7 @@ const webviewApi = { // Need to send it with a delay to make sure all listeners are // ready when the message is sent. window.requestAnimationFrame(() => { - console.debug('UserWebView frame: calling isReady'); + console.debug('UserWebViewIndex: calling isReady'); window.postMessage({ target: 'UserWebview', message: 'ready' }, '*'); }); }); diff --git a/packages/app-desktop/services/plugins/hooks/useHtmlLoader.ts b/packages/app-desktop/services/plugins/hooks/useHtmlLoader.ts index 9b69cc8704..429e2df670 100644 --- a/packages/app-desktop/services/plugins/hooks/useHtmlLoader.ts +++ b/packages/app-desktop/services/plugins/hooks/useHtmlLoader.ts @@ -39,7 +39,7 @@ export default function(frameWindow: any, isReady: boolean, postMessage: Functio if (!isReady) return; - console.info('useHtmlLoader: setHtml', htmlHash, html); + console.info('useHtmlLoader: setHtml', htmlHash); postMessage('setHtml', { hash: htmlHash, diff --git a/packages/app-desktop/services/plugins/hooks/useWebviewToPluginMessages.ts b/packages/app-desktop/services/plugins/hooks/useWebviewToPluginMessages.ts index fc45b88a9f..53ada67a81 100644 --- a/packages/app-desktop/services/plugins/hooks/useWebviewToPluginMessages.ts +++ b/packages/app-desktop/services/plugins/hooks/useWebviewToPluginMessages.ts @@ -1,11 +1,20 @@ +import Logger from '@joplin/lib/Logger'; import { useEffect } from 'react'; -export default function(frameWindow: any, onMessage: Function, pluginId: string, viewId: string) { +const logger = Logger.create('useWebviewToPluginMessages'); + +export default function(frameWindow: any, isReady: boolean, onMessage: Function, pluginId: string, viewId: string) { useEffect(() => { if (!frameWindow) return () => {}; - function onMessage(event: any) { + function onMessage_(event: any) { if (!event.data || event.data.target !== 'plugin') return; + + // The message is passed from one component or service to the next + // till it reaches its destination, so if something doesn't work + // follow the chain of messages searching for the string "Got message" + logger.debug('Got message (WebView => Plugin) (1)', pluginId, viewId, event.data.message); + onMessage({ pluginId: pluginId, viewId: viewId, @@ -13,10 +22,10 @@ export default function(frameWindow: any, onMessage: Function, pluginId: string, }); } - frameWindow.addEventListener('message', onMessage); + frameWindow.addEventListener('message', onMessage_); return () => { - frameWindow.removeEventListener('message', onMessage); + frameWindow.removeEventListener('message', onMessage_); }; - }, [onMessage, pluginId, viewId]); + }, [frameWindow, onMessage, isReady, pluginId, viewId]); }