[stable33] fix(viewer): register handlers not yet in the lookup table when opening a file

css/viewer-main.css

@@ -1,3 +1,3 @@
 /* extracted by css-entry-points-plugin */
-@import './main-BQAo6xiu.chunk.css';
+@import './main-CS-6EKf2.chunk.css';
 @import './previewUtils-CU5qdRbf.chunk.css';

playwright/e2e/sharing/single-file-share.spec.ts

@@ -50,4 +50,28 @@ test.describe('See shared single file with link share', () => {
 		await expect(getMenuToggle(page)).toBeVisible()
 		await expect(getCloseButton(page)).toBeVisible()
 	})
+
+	test('Opens the shared image before the page finished loading', async ({ page }) => {
+		// Deferred scripts run in document order and DOMContentLoaded waits for all of them,
+		// so a slow last script lets the files app open the shared file before the event fires
+		await page.route('**/playwright-delay-dom-content-loaded.js', async (route) => {
+			await new Promise((resolve) => setTimeout(resolve, 3000))
+			await route.fulfill({ contentType: 'text/javascript', body: '' })
+		})
+		await page.route(`**/s/${imageToken}`, async (route) => {
+			const response = await route.fetch()
+			const body = await response.text()
+			const nonce = body.match(/nonce="([^"]+)"/)?.[1] ?? ''
+			await route.fulfill({
+				response,
+				body: body.replace('</body>', `<script defer nonce="${nonce}" src="/playwright-delay-dom-content-loaded.js"></script></body>`),
+			})
+		})
+
+		await visitPublicShare(page, imageToken)
+
+		await expectViewerLoaded(page)
+		await expectActiveSource(page, 'img', '/apps/files_sharing/publicpreview/')
+		await expect(page.getByText('There is no plugin available to display this file type')).toHaveCount(0)
+	})
 })

src/views/Viewer.vue

@@ -243,6 +243,7 @@ export default defineComponent({
 			components: {},
 			mimeGroups: {},
 			registeredHandlers: {},
+			registeredHandlersCount: 0,
 
 			// Files variables
 			currentIndex: 0,
@@ -519,27 +520,9 @@ export default defineComponent({
 		}
 
 		// register on load
+		// (openFileInfo also registers them if a file is opened before DOMContentLoaded)
 		document.addEventListener('DOMContentLoaded', () => {
-			// load all init handlers
-			if (window._oca_viewer_handlers) {
-				window._oca_viewer_handlers.forEach((handler) => {
-					OCA.Viewer.registerHandler(handler)
-				})
-			}
-
-			// register all primary components mimes
-			this.handlers.forEach(handler => {
-				this.registerHandler(handler)
-			})
-
-			// then register aliases. We need to have the components
-			// first so we can bind the alias to them.
-			this.handlers.forEach(handler => {
-				this.registerHandlerAlias(handler)
-			})
-			this.isLoaded = true
-
-			logger.info(`${this.handlers.length} viewer handlers registered`, { handlers: this.handlers })
+			this.registerNewHandlers()
 		})
 
 		window.addEventListener('resize', this.onResize)
@@ -713,6 +696,8 @@ export default defineComponent({
 				return
 			}
 
+			this.registerNewHandlers()
+
 			// get original mime and alias
 			const mime = fileInfo.mime
 			const alias = mime.split('/')[0]
@@ -869,6 +854,38 @@ export default defineComponent({
 			document.title = `${fileName} - ${OCA.Theming?.name ?? oc_defaults.name}`
 		},
 
+		registerNewHandlers() {
+			// load all init handlers
+			if (window._oca_viewer_handlers) {
+				window._oca_viewer_handlers.forEach((handler) => {
+					if (!this.handlers.some(h => h.id === handler.id)) {
+						OCA.Viewer.registerHandler(handler)
+					}
+				})
+			}
+
+			// handlers are only ever appended to the service
+			const newHandlers = this.handlers.slice(this.registeredHandlersCount)
+			if (newHandlers.length === 0) {
+				return
+			}
+			this.registeredHandlersCount = this.handlers.length
+
+			// register all primary components mimes
+			newHandlers.forEach(handler => {
+				this.registerHandler(handler)
+			})
+
+			// then register aliases. We need to have the components
+			// first so we can bind the alias to them.
+			newHandlers.forEach(handler => {
+				this.registerHandlerAlias(handler)
+			})
+			this.isLoaded = true
+
+			logger.info(`${newHandlers.length} viewer handlers registered`, { handlers: newHandlers })
+		},
+
 		/**
 		 * Registering possible new handlers
 		 *