Mobile: Support building for web

.eslintignore

@@ -53,6 +53,7 @@ packages/app-desktop/services/electron-context-menu.js
 packages/app-desktop/vendor/lib/
 packages/app-mobile/android
 packages/app-mobile/**/*.bundle.js
+packages/app-mobile/web/public/pluginAssets/**/*
 packages/app-mobile/ios
 packages/app-mobile/lib/rnInjectedJs/
 packages/app-mobile/locales
@@ -517,15 +518,17 @@ packages/app-mobile/commands/openItem.js
 packages/app-mobile/commands/openNote.js
 packages/app-mobile/commands/scrollToHash.js
 packages/app-mobile/commands/util/goToNote.js
-packages/app-mobile/components/ActionButton.js
+packages/app-mobile/commands/util/showResource.js
 packages/app-mobile/components/BackButtonDialogBox.js
 packages/app-mobile/components/BetaChip.js
 packages/app-mobile/components/CameraView.js
+packages/app-mobile/components/DialogManager.js
 packages/app-mobile/components/DismissibleDialog.js
 packages/app-mobile/components/Dropdown.test.js
 packages/app-mobile/components/Dropdown.js
 packages/app-mobile/components/ExtendedWebView/index.jest.js
 packages/app-mobile/components/ExtendedWebView/index.js
+packages/app-mobile/components/ExtendedWebView/index.web.js
 packages/app-mobile/components/ExtendedWebView/types.js
 packages/app-mobile/components/FolderPicker.js
 packages/app-mobile/components/Icon.js
@@ -589,15 +592,19 @@ packages/app-mobile/components/ProfileSwitcher/useProfileConfig.js
 packages/app-mobile/components/ScreenHeader/WarningBanner.test.js
 packages/app-mobile/components/ScreenHeader/WarningBanner.js
 packages/app-mobile/components/ScreenHeader/WarningBox.js
+packages/app-mobile/components/ScreenHeader/WebBetaButton.js
 packages/app-mobile/components/ScreenHeader/index.js
 packages/app-mobile/components/SelectDateTimeDialog.js
 packages/app-mobile/components/SideMenu.js
 packages/app-mobile/components/TextInput.js
+packages/app-mobile/components/accessibility/AccessibleModalMenu.js
+packages/app-mobile/components/accessibility/AccessibleView.js
 packages/app-mobile/components/app-nav.js
 packages/app-mobile/components/base-screen.js
 packages/app-mobile/components/biometrics/BiometricPopup.js
 packages/app-mobile/components/biometrics/biometricAuthenticate.js
 packages/app-mobile/components/biometrics/sensorInfo.js
+packages/app-mobile/components/buttons/FloatingActionButton.js
 packages/app-mobile/components/buttons/TextButton.js
 packages/app-mobile/components/buttons/index.js
 packages/app-mobile/components/getResponsiveValue.test.js
@@ -611,7 +618,6 @@ packages/app-mobile/components/plugins/backgroundPage/pluginRunnerBackgroundPage
 packages/app-mobile/components/plugins/backgroundPage/startStopPlugin.js
 packages/app-mobile/components/plugins/backgroundPage/utils/getFormData.test.js
 packages/app-mobile/components/plugins/backgroundPage/utils/getFormData.js
-packages/app-mobile/components/plugins/backgroundPage/utils/makeSandboxedIframe.js
 packages/app-mobile/components/plugins/backgroundPage/utils/reportUnhandledErrors.js
 packages/app-mobile/components/plugins/backgroundPage/utils/wrapConsoleLog.js
 packages/app-mobile/components/plugins/dialogs/PluginDialogManager.js
@@ -689,9 +695,11 @@ packages/app-mobile/components/screens/status.js
 packages/app-mobile/components/side-menu-content.js
 packages/app-mobile/components/voiceTyping/VoiceTypingDialog.js
 packages/app-mobile/gulpfile.js
+packages/app-mobile/index.web.js
 packages/app-mobile/root.js
 packages/app-mobile/services/AlarmServiceDriver.android.js
 packages/app-mobile/services/AlarmServiceDriver.ios.js
+packages/app-mobile/services/AlarmServiceDriver.web.js
 packages/app-mobile/services/e2ee/RSA.react-native.js
 packages/app-mobile/services/plugins/PlatformImplementation.js
 packages/app-mobile/services/profiles/index.js
@@ -702,6 +710,7 @@ packages/app-mobile/tools/buildInjectedJs/BundledFile.js
 packages/app-mobile/tools/buildInjectedJs/constants.js
 packages/app-mobile/tools/buildInjectedJs/copyJs.js
 packages/app-mobile/tools/buildInjectedJs/gulpTasks.js
+packages/app-mobile/tools/copyAssets.js
 packages/app-mobile/utils/ShareExtension.js
 packages/app-mobile/utils/ShareUtils.test.js
 packages/app-mobile/utils/ShareUtils.js
@@ -710,9 +719,13 @@ packages/app-mobile/utils/appDefaultState.js
 packages/app-mobile/utils/autodetectTheme.js
 packages/app-mobile/utils/checkPermissions.js
 packages/app-mobile/utils/createRootStyle.js
+packages/app-mobile/utils/database-driver-react-native.js
+packages/app-mobile/utils/database-driver-react-native.web.js
 packages/app-mobile/utils/debounce.js
 packages/app-mobile/utils/fs-driver/constants.js
 packages/app-mobile/utils/fs-driver/fs-driver-rn.js
+packages/app-mobile/utils/fs-driver/fs-driver-rn.web.js
+packages/app-mobile/utils/fs-driver/fs-driver-rn.web.worker.js
 packages/app-mobile/utils/fs-driver/runOnDeviceTests.js
 packages/app-mobile/utils/fs-driver/tarCreate.js
 packages/app-mobile/utils/fs-driver/tarExtract.test.js
@@ -721,22 +734,29 @@ packages/app-mobile/utils/fs-driver/testUtil/createFilesFromPathRecord.js
 packages/app-mobile/utils/fs-driver/testUtil/verifyDirectoryMatches.js
 packages/app-mobile/utils/getPackageInfo.js
 packages/app-mobile/utils/getVersionInfoText.js
+packages/app-mobile/utils/image/fileToImage.web.js
 packages/app-mobile/utils/image/getImageDimensions.js
 packages/app-mobile/utils/image/resizeImage.js
 packages/app-mobile/utils/initializeCommandService.js
 packages/app-mobile/utils/injectedJs.js
 packages/app-mobile/utils/ipc/RNToWebViewMessenger.js
 packages/app-mobile/utils/ipc/WebViewToRNMessenger.js
+packages/app-mobile/utils/lockToSingleInstance.js
+packages/app-mobile/utils/makeShowMessageBox.js
 packages/app-mobile/utils/pickDocument.js
 packages/app-mobile/utils/polyfills/bufferPolyfill.js
 packages/app-mobile/utils/polyfills/index.js
 packages/app-mobile/utils/setupNotifications.js
+packages/app-mobile/utils/shareFile.js
 packages/app-mobile/utils/shareHandler.js
-packages/app-mobile/utils/shim-init-react.js
-packages/app-mobile/utils/showMessageBox.js
+packages/app-mobile/utils/shim-init-react/index.js
+packages/app-mobile/utils/shim-init-react/index.web.js
+packages/app-mobile/utils/shim-init-react/injectedJs.js
+packages/app-mobile/utils/shim-init-react/shimInitShared.js
 packages/app-mobile/utils/testing/createMockReduxStore.js
 packages/app-mobile/utils/testing/getWebViewDomById.js
 packages/app-mobile/utils/types.js
+packages/app-mobile/web/serviceWorker.js
 packages/default-plugins/build.js
 packages/default-plugins/buildDefaultPlugins.js
 packages/default-plugins/commands/buildAll.js
@@ -1269,13 +1289,17 @@ packages/lib/urlUtils.js
 packages/lib/utils/ActionLogger.test.js
 packages/lib/utils/ActionLogger.js
 packages/lib/utils/credentialFiles.js
+packages/lib/utils/dom/makeSandboxedIframe.js
 packages/lib/utils/focusHandler.js
 packages/lib/utils/frontMatter.js
 packages/lib/utils/ipc/RemoteMessenger.test.js
 packages/lib/utils/ipc/RemoteMessenger.js
 packages/lib/utils/ipc/TestMessenger.js
 packages/lib/utils/ipc/WindowMessenger.js
+packages/lib/utils/ipc/WorkerMessenger.js
+packages/lib/utils/ipc/WorkerToWindowMessenger.js
 packages/lib/utils/ipc/types.js
+packages/lib/utils/ipc/utils/isTransferableObject.js
 packages/lib/utils/ipc/utils/mergeCallbacksAndSerializable.test.js
 packages/lib/utils/ipc/utils/mergeCallbacksAndSerializable.js
 packages/lib/utils/ipc/utils/separateCallbacksFromSerializable.test.js

.eslintrc.js

@@ -15,6 +15,18 @@ module.exports = {
 	'globals': {
 		'Atomics': 'readonly',
 		'SharedArrayBuffer': 'readonly',
+		'BufferEncoding': 'readonly',
+		'AsyncIterable': 'readonly',
+		'FileSystemFileHandle': 'readonly',
+		'FileSystemDirectoryHandle': 'readonly',
+		'ReadableStreamDefaultReader': 'readonly',
+		'FileSystemCreateWritableOptions': 'readonly',
+		'FileSystemHandle': 'readonly',
+
+		// ServiceWorker
+		'ExtendableEvent': 'readonly',
+		'WindowClient': 'readonly',
+		'FetchEvent': 'readonly',
 
 		// Jest variables
 		'test': 'readonly',

.gitignore

@@ -496,15 +496,17 @@ packages/app-mobile/commands/openItem.js
 packages/app-mobile/commands/openNote.js
 packages/app-mobile/commands/scrollToHash.js
 packages/app-mobile/commands/util/goToNote.js
-packages/app-mobile/components/ActionButton.js
+packages/app-mobile/commands/util/showResource.js
 packages/app-mobile/components/BackButtonDialogBox.js
 packages/app-mobile/components/BetaChip.js
 packages/app-mobile/components/CameraView.js
+packages/app-mobile/components/DialogManager.js
 packages/app-mobile/components/DismissibleDialog.js
 packages/app-mobile/components/Dropdown.test.js
 packages/app-mobile/components/Dropdown.js
 packages/app-mobile/components/ExtendedWebView/index.jest.js
 packages/app-mobile/components/ExtendedWebView/index.js
+packages/app-mobile/components/ExtendedWebView/index.web.js
 packages/app-mobile/components/ExtendedWebView/types.js
 packages/app-mobile/components/FolderPicker.js
 packages/app-mobile/components/Icon.js
@@ -568,15 +570,19 @@ packages/app-mobile/components/ProfileSwitcher/useProfileConfig.js
 packages/app-mobile/components/ScreenHeader/WarningBanner.test.js
 packages/app-mobile/components/ScreenHeader/WarningBanner.js
 packages/app-mobile/components/ScreenHeader/WarningBox.js
+packages/app-mobile/components/ScreenHeader/WebBetaButton.js
 packages/app-mobile/components/ScreenHeader/index.js
 packages/app-mobile/components/SelectDateTimeDialog.js
 packages/app-mobile/components/SideMenu.js
 packages/app-mobile/components/TextInput.js
+packages/app-mobile/components/accessibility/AccessibleModalMenu.js
+packages/app-mobile/components/accessibility/AccessibleView.js
 packages/app-mobile/components/app-nav.js
 packages/app-mobile/components/base-screen.js
 packages/app-mobile/components/biometrics/BiometricPopup.js
 packages/app-mobile/components/biometrics/biometricAuthenticate.js
 packages/app-mobile/components/biometrics/sensorInfo.js
+packages/app-mobile/components/buttons/FloatingActionButton.js
 packages/app-mobile/components/buttons/TextButton.js
 packages/app-mobile/components/buttons/index.js
 packages/app-mobile/components/getResponsiveValue.test.js
@@ -590,7 +596,6 @@ packages/app-mobile/components/plugins/backgroundPage/pluginRunnerBackgroundPage
 packages/app-mobile/components/plugins/backgroundPage/startStopPlugin.js
 packages/app-mobile/components/plugins/backgroundPage/utils/getFormData.test.js
 packages/app-mobile/components/plugins/backgroundPage/utils/getFormData.js
-packages/app-mobile/components/plugins/backgroundPage/utils/makeSandboxedIframe.js
 packages/app-mobile/components/plugins/backgroundPage/utils/reportUnhandledErrors.js
 packages/app-mobile/components/plugins/backgroundPage/utils/wrapConsoleLog.js
 packages/app-mobile/components/plugins/dialogs/PluginDialogManager.js
@@ -668,9 +673,11 @@ packages/app-mobile/components/screens/status.js
 packages/app-mobile/components/side-menu-content.js
 packages/app-mobile/components/voiceTyping/VoiceTypingDialog.js
 packages/app-mobile/gulpfile.js
+packages/app-mobile/index.web.js
 packages/app-mobile/root.js
 packages/app-mobile/services/AlarmServiceDriver.android.js
 packages/app-mobile/services/AlarmServiceDriver.ios.js
+packages/app-mobile/services/AlarmServiceDriver.web.js
 packages/app-mobile/services/e2ee/RSA.react-native.js
 packages/app-mobile/services/plugins/PlatformImplementation.js
 packages/app-mobile/services/profiles/index.js
@@ -681,6 +688,7 @@ packages/app-mobile/tools/buildInjectedJs/BundledFile.js
 packages/app-mobile/tools/buildInjectedJs/constants.js
 packages/app-mobile/tools/buildInjectedJs/copyJs.js
 packages/app-mobile/tools/buildInjectedJs/gulpTasks.js
+packages/app-mobile/tools/copyAssets.js
 packages/app-mobile/utils/ShareExtension.js
 packages/app-mobile/utils/ShareUtils.test.js
 packages/app-mobile/utils/ShareUtils.js
@@ -689,9 +697,13 @@ packages/app-mobile/utils/appDefaultState.js
 packages/app-mobile/utils/autodetectTheme.js
 packages/app-mobile/utils/checkPermissions.js
 packages/app-mobile/utils/createRootStyle.js
+packages/app-mobile/utils/database-driver-react-native.js
+packages/app-mobile/utils/database-driver-react-native.web.js
 packages/app-mobile/utils/debounce.js
 packages/app-mobile/utils/fs-driver/constants.js
 packages/app-mobile/utils/fs-driver/fs-driver-rn.js
+packages/app-mobile/utils/fs-driver/fs-driver-rn.web.js
+packages/app-mobile/utils/fs-driver/fs-driver-rn.web.worker.js
 packages/app-mobile/utils/fs-driver/runOnDeviceTests.js
 packages/app-mobile/utils/fs-driver/tarCreate.js
 packages/app-mobile/utils/fs-driver/tarExtract.test.js
@@ -700,22 +712,29 @@ packages/app-mobile/utils/fs-driver/testUtil/createFilesFromPathRecord.js
 packages/app-mobile/utils/fs-driver/testUtil/verifyDirectoryMatches.js
 packages/app-mobile/utils/getPackageInfo.js
 packages/app-mobile/utils/getVersionInfoText.js
+packages/app-mobile/utils/image/fileToImage.web.js
 packages/app-mobile/utils/image/getImageDimensions.js
 packages/app-mobile/utils/image/resizeImage.js
 packages/app-mobile/utils/initializeCommandService.js
 packages/app-mobile/utils/injectedJs.js
 packages/app-mobile/utils/ipc/RNToWebViewMessenger.js
 packages/app-mobile/utils/ipc/WebViewToRNMessenger.js
+packages/app-mobile/utils/lockToSingleInstance.js
+packages/app-mobile/utils/makeShowMessageBox.js
 packages/app-mobile/utils/pickDocument.js
 packages/app-mobile/utils/polyfills/bufferPolyfill.js
 packages/app-mobile/utils/polyfills/index.js
 packages/app-mobile/utils/setupNotifications.js
+packages/app-mobile/utils/shareFile.js
 packages/app-mobile/utils/shareHandler.js
-packages/app-mobile/utils/shim-init-react.js
-packages/app-mobile/utils/showMessageBox.js
+packages/app-mobile/utils/shim-init-react/index.js
+packages/app-mobile/utils/shim-init-react/index.web.js
+packages/app-mobile/utils/shim-init-react/injectedJs.js
+packages/app-mobile/utils/shim-init-react/shimInitShared.js
 packages/app-mobile/utils/testing/createMockReduxStore.js
 packages/app-mobile/utils/testing/getWebViewDomById.js
 packages/app-mobile/utils/types.js
+packages/app-mobile/web/serviceWorker.js
 packages/default-plugins/build.js
 packages/default-plugins/buildDefaultPlugins.js
 packages/default-plugins/commands/buildAll.js
@@ -1248,13 +1267,17 @@ packages/lib/urlUtils.js
 packages/lib/utils/ActionLogger.test.js
 packages/lib/utils/ActionLogger.js
 packages/lib/utils/credentialFiles.js
+packages/lib/utils/dom/makeSandboxedIframe.js
 packages/lib/utils/focusHandler.js
 packages/lib/utils/frontMatter.js
 packages/lib/utils/ipc/RemoteMessenger.test.js
 packages/lib/utils/ipc/RemoteMessenger.js
 packages/lib/utils/ipc/TestMessenger.js
 packages/lib/utils/ipc/WindowMessenger.js
+packages/lib/utils/ipc/WorkerMessenger.js
+packages/lib/utils/ipc/WorkerToWindowMessenger.js
 packages/lib/utils/ipc/types.js
+packages/lib/utils/ipc/utils/isTransferableObject.js
 packages/lib/utils/ipc/utils/mergeCallbacksAndSerializable.test.js
 packages/lib/utils/ipc/utils/mergeCallbacksAndSerializable.js
 packages/lib/utils/ipc/utils/separateCallbacksFromSerializable.test.js

packages/app-mobile/.gitignore

@@ -70,6 +70,7 @@ components/**/*.bundle.js
 components/**/*.bundle.js.LICENSE.txt
 components/**/*.bundle.js.md5
 components/**/*.bundle.min.js
+web/public/pluginAssets/*
 
 utils/fs-driver-android.js
 android/app/build-*

packages/app-mobile/PluginAssetsLoader.ts

@@ -3,52 +3,73 @@ const { dirname } = require('@joplin/lib/path-utils');
 import Setting from '@joplin/lib/models/Setting';
 const pluginAssets = require('./pluginAssets/index');
 import KvStore from '@joplin/lib/services/KvStore';
+import Logger from '@joplin/utils/Logger';
+import FsDriverWeb from './utils/fs-driver/fs-driver-rn.web';
+
+const logger = Logger.create('PluginAssetsLoader');
 
 export default class PluginAssetsLoader {
 
 	private static instance_: PluginAssetsLoader = null;
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
-	private logger_: any = null;
 
 	public static instance() {
 		if (PluginAssetsLoader.instance_) return PluginAssetsLoader.instance_;
 		PluginAssetsLoader.instance_ = new PluginAssetsLoader();
 		return PluginAssetsLoader.instance_;
 	}
 
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
-	public setLogger(logger: any) {
-		this.logger_ = logger;
+	private destDir_() {
+		return `${Setting.value('resourceDir')}/pluginAssets`;
+	}
+
+	private async importAssetsMobile_() {
+		const destDir = this.destDir_();
+
+		for (const name in pluginAssets.files) {
+			const dataBase64 = pluginAssets.files[name].data;
+			const destPath = `${destDir}/${name}`;
+			await shim.fsDriver().mkdir(dirname(destPath));
+			await shim.fsDriver().unlink(destPath);
+
+			logger.info(`PluginAssetsLoader: Copying: ${name} => ${destPath}`);
+			await shim.fsDriver().writeFile(destPath, dataBase64);
+		}
 	}
 
-	public logger() {
-		return this.logger_;
+	private async importAssetsWeb_() {
+		const destDir = this.destDir_();
+		const fsDriver = shim.fsDriver() as FsDriverWeb;
+
+		await Promise.all(pluginAssets.files.map(async (name: string) => {
+			const destPath = `${destDir}/${name}`;
+			const response = await fetch(`pluginAssets/${name}`);
+			await shim.fsDriver().mkdir(dirname(destPath));
+
+			await shim.fsDriver().unlink(destPath);
+			await fsDriver.writeFile(destPath, await response.arrayBuffer(), 'Buffer');
+		}));
 	}
 
 	public async importAssets() {
-		const destDir = `${Setting.value('resourceDir')}/pluginAssets`;
+		const destDir = this.destDir_();
 		await shim.fsDriver().mkdir(destDir);
 
 		const hash = pluginAssets.hash;
 		if (hash === await KvStore.instance().value('PluginAssetsLoader.lastHash')) {
-			this.logger().info(`PluginAssetsLoader: Assets are up to date. Hash: ${hash}`);
+			logger.info(`PluginAssetsLoader: Assets are up to date. Hash: ${hash}`);
 			return;
 		}
 
-		this.logger().info(`PluginAssetsLoader: Importing assets to ${destDir}`);
+		logger.info(`PluginAssetsLoader: Importing assets to ${destDir}`);
 
 		try {
-			for (const name in pluginAssets.files) {
-				const dataBase64 = pluginAssets.files[name].data;
-				const destPath = `${destDir}/${name}`;
-				await shim.fsDriver().mkdir(dirname(destPath));
-				await shim.fsDriver().unlink(destPath);
-
-				this.logger().info(`PluginAssetsLoader: Copying: ${name} => ${destPath}`);
-				await shim.fsDriver().writeFile(destPath, dataBase64);
+			if (shim.mobilePlatform() === 'web') {
+				await this.importAssetsWeb_();
+			} else {
+				await this.importAssetsMobile_();
 			}
 		} catch (error) {
-			this.logger().error(error);
+			logger.error(error);
 		}
 
 		await KvStore.instance().setValue('PluginAssetsLoader.lastHash', hash);