Mobile: Plugin commands: Support renderMarkup (replacable URIs)

This commit adds support for the renderMarkup command on mobile and web.
Resource URLs take different forms on desktop, web, and mobile. As such,
this commit takes the approach of rendering a replacable resource URL in
the form   joplin-resource://<resource-id>.<extension>  . To properly
support this, the webviewApi in user webviews will need to be extended
to allow resolving resources from URLs.

Possible alternatives:
- Use a different resource base URL on mobile and desktop (perhaps
  determined by   shim.noteViewerBaseUrl  ?)
  - This wouldn't help on web, where each resource must be sent to a
    note viewer before it can be loaded (web uses a virtual file
    system).
- Rather than have a renderMarkup command, extend
  laurent22#11296 to extend webviewApi
  with a renderMarkup function. Calling this function would load
  and select the correct resource URIs for the current webview. This
  would also allow user plugins to run.
  - This approach is more complicated than the approach taken here. It
    could potentially be used **in addition** to this existing
    command-based approach.

See also: ff09937

.eslintignore

@@ -155,8 +155,6 @@ packages/app-desktop/commands/exportNotes.js
 packages/app-desktop/commands/focusElement.js
 packages/app-desktop/commands/index.js
 packages/app-desktop/commands/openProfileDirectory.js
-packages/app-desktop/commands/renderMarkup.test.js
-packages/app-desktop/commands/renderMarkup.js
 packages/app-desktop/commands/replaceMisspelling.js
 packages/app-desktop/commands/restoreNoteRevision.js
 packages/app-desktop/commands/startExternalEditing.js
@@ -953,6 +951,8 @@ packages/lib/commands/historyForward.js
 packages/lib/commands/index.js
 packages/lib/commands/openMasterPasswordDialog.js
 packages/lib/commands/permanentlyDeleteNote.js
+packages/lib/commands/renderMarkup.test.js
+packages/lib/commands/renderMarkup.js
 packages/lib/commands/synchronize.js
 packages/lib/components/EncryptionConfigScreen/utils.test.js
 packages/lib/components/EncryptionConfigScreen/utils.js

.gitignore

@@ -132,8 +132,6 @@ packages/app-desktop/commands/exportNotes.js
 packages/app-desktop/commands/focusElement.js
 packages/app-desktop/commands/index.js
 packages/app-desktop/commands/openProfileDirectory.js
-packages/app-desktop/commands/renderMarkup.test.js
-packages/app-desktop/commands/renderMarkup.js
 packages/app-desktop/commands/replaceMisspelling.js
 packages/app-desktop/commands/restoreNoteRevision.js
 packages/app-desktop/commands/startExternalEditing.js
@@ -930,6 +928,8 @@ packages/lib/commands/historyForward.js
 packages/lib/commands/index.js
 packages/lib/commands/openMasterPasswordDialog.js
 packages/lib/commands/permanentlyDeleteNote.js
+packages/lib/commands/renderMarkup.test.js
+packages/lib/commands/renderMarkup.js
 packages/lib/commands/synchronize.js
 packages/lib/components/EncryptionConfigScreen/utils.test.js
 packages/lib/components/EncryptionConfigScreen/utils.js

packages/app-desktop/commands/index.ts

@@ -6,7 +6,6 @@ import * as exportFolders from './exportFolders';
 import * as exportNotes from './exportNotes';
 import * as focusElement from './focusElement';
 import * as openProfileDirectory from './openProfileDirectory';
-import * as renderMarkup from './renderMarkup';
 import * as replaceMisspelling from './replaceMisspelling';
 import * as restoreNoteRevision from './restoreNoteRevision';
 import * as startExternalEditing from './startExternalEditing';
@@ -26,7 +25,6 @@ const index: any[] = [
 	exportNotes,
 	focusElement,
 	openProfileDirectory,
-	renderMarkup,
 	replaceMisspelling,
 	restoreNoteRevision,
 	startExternalEditing,

packages/lib/commands/index.ts

@@ -4,6 +4,7 @@ import * as historyBackward from './historyBackward';
 import * as historyForward from './historyForward';
 import * as openMasterPasswordDialog from './openMasterPasswordDialog';
 import * as permanentlyDeleteNote from './permanentlyDeleteNote';
+import * as renderMarkup from './renderMarkup';
 import * as synchronize from './synchronize';
 
 const index: any[] = [
@@ -12,6 +13,7 @@ const index: any[] = [
 	historyForward,
 	openMasterPasswordDialog,
 	permanentlyDeleteNote,
+	renderMarkup,
 	synchronize,
 ];
 

packages/app-desktop/commands/renderMarkup.test.ts → packages/lib/commands/renderMarkup.test.ts

@@ -1,7 +1,7 @@
-import shim from '@joplin/lib/shim';
-import Resource from '@joplin/lib/models/Resource';
-import Note from '@joplin/lib/models/Note';
-import { setupDatabaseAndSynchronizer, supportDir, switchClient } from '@joplin/lib/testing/test-utils';
+import shim from '../shim';
+import Resource from '../models/Resource';
+import Note from '../models/Note';
+import { setupDatabaseAndSynchronizer, supportDir, switchClient } from '../testing/test-utils';
 import { runtime } from './renderMarkup';
 import { MarkupLanguage } from '@joplin/renderer';
 const testImagePath = `${supportDir}/photo.jpg`;
@@ -38,7 +38,7 @@ describe('renderMarkup', () => {
 			const resource = (await Resource.all())[0];
 			const noteBody = (await Note.load(note.id)).body;
 			const renderedNote = await await command.execute(null, MarkupLanguage.Markdown, noteBody);
-			expect(renderedNote.html).toContain(`<div id="rendered-md"><p><img data-from-md data-resource-id="${resource.id}" src="joplin-content://note-viewer/`);
+			expect(renderedNote.html).toContain(`<div id="rendered-md"><p><img data-from-md data-resource-id="${resource.id}" src="joplin-resource://`);
 			expect(renderedNote.html).toContain(`/resources-1/${resource.id}.jpg?t=`);
 			expect(renderedNote.html).toContain('" title alt="photo.jpg" /></p>');
 		}

packages/app-desktop/commands/renderMarkup.ts → packages/lib/commands/renderMarkup.ts

@@ -1,16 +1,16 @@
-import markupLanguageUtils from '@joplin/lib/markupLanguageUtils';
-import Setting from '@joplin/lib/models/Setting';
-import { CommandRuntime, CommandDeclaration, CommandContext } from '@joplin/lib/services/CommandService';
-import { themeStyle } from '@joplin/lib/theme';
-import attachedResources from '@joplin/lib/utils/attachedResources';
+import markupLanguageUtils from '../markupLanguageUtils';
+import Setting from '../models/Setting';
+import { CommandRuntime, CommandDeclaration, CommandContext } from '../services/CommandService';
+import { themeStyle } from '../theme';
+import attachedResources from '../utils/attachedResources';
 import { MarkupLanguage } from '@joplin/renderer';
 
 export const declaration: CommandDeclaration = {
 	name: 'renderMarkup',
 };
 
 const getMarkupToHtml = () => {
-	const resourceBaseUrl = `joplin-content://note-viewer/${Setting.value('resourceDir')}/`;
+	const resourceBaseUrl = 'joplin-resource://';
 
 	return markupLanguageUtils.newMarkupToHtml({}, {
 		resourceBaseUrl,