diff --git a/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.test.ts b/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.test.ts index 8293fb8f5f8..4dfccbd42a6 100644 --- a/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.test.ts +++ b/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.test.ts @@ -4,17 +4,9 @@ import { acquireWebviewsDragPassthrough } from '../host-guest/webview-drag-passt import { webviewRegistry } from '../host-guest/webview-registry' import { attachDocPreviewWebview } from './doc-preview-webview-attach' -it('restores pointer input when a drag ends after attaching a document preview', () => { - const container = document.createElement('div') - document.body.appendChild(container) - const append = vi.spyOn(container, 'appendChild') - append.mockImplementation((node) => { - expect((node as HTMLElement).style.pointerEvents).toBe('none') - return Node.prototype.appendChild.call(container, node) - }) - const release = acquireWebviewsDragPassthrough() - const attached = attachDocPreviewWebview({ - previewId: 'preview-drag', +function attach(previewId: string, container: HTMLDivElement) { + return attachDocPreviewWebview({ + previewId, container, url: 'orca-preview://grant/index.html', ariaLabel: 'HTML preview', @@ -25,6 +17,18 @@ it('restores pointer input when a drag ends after attaching a document preview', onTitleUpdated: vi.fn(), onViewportMessage: vi.fn() }) +} + +it('restores pointer input when a drag ends after attaching a document preview', () => { + const container = document.createElement('div') + document.body.appendChild(container) + const append = vi.spyOn(container, 'appendChild') + append.mockImplementation((node) => { + expect((node as HTMLElement).style.pointerEvents).toBe('none') + return Node.prototype.appendChild.call(container, node) + }) + const release = acquireWebviewsDragPassthrough() + const attached = attach('preview-drag', container) try { expect(webviewRegistry.get('preview-drag')).toBe(attached.webview) @@ -39,3 +43,9 @@ it('restores pointer input when a drag ends after attaching a document preview', } expect(webviewRegistry.has('preview-drag')).toBe(false) }) + +it('attaches an opaque guest so dark-scheme documents get a dark canvas', () => { + const attached = attach('preview-opaque', document.createElement('div')) + expect(attached.webview.getAttribute('webpreferences')).toContain('transparent=false') + attached.detach() +}) diff --git a/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.ts b/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.ts index ffeb8b51926..8ee6930bf6b 100644 --- a/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.ts +++ b/src/renderer/src/components/browser-pane/workspace-doc/doc-preview-webview-attach.ts @@ -1,5 +1,5 @@ import { DOC_PREVIEW_PARTITION } from '../../../../../shared/doc-preview-scheme' -import { ORCA_BROWSER_GUEST_WEB_PREFERENCES_ATTRIBUTE } from '../../../../../shared/browser-guest-web-preferences' +import { ORCA_BROWSER_PAGE_GUEST_WEB_PREFERENCES_ATTRIBUTE } from '../../../../../shared/browser-guest-web-preferences' import { moveFocusToRendererBeforeWebviewDetach, registerPersistentWebview, @@ -34,11 +34,9 @@ export function attachDocPreviewWebview({ // Why no allowpopups: the guest's preload intercepts a trusted click on a link before Chromium // considers a popup at all, so target="_blank" needs no popup path and every one stays denied. webview.setAttribute('partition', DOC_PREVIEW_PARTITION) - webview.setAttribute('webpreferences', ORCA_BROWSER_GUEST_WEB_PREFERENCES_ATTRIBUTE) + // Why opaque: Chromium paints its dark canvas for dark-scheme documents (JSON, text) only then. + webview.setAttribute('webpreferences', ORCA_BROWSER_PAGE_GUEST_WEB_PREFERENCES_ATTRIBUTE) webview.setAttribute('aria-label', ariaLabel) - // Browsers paint an undeclared page canvas white; the guest is transparent, so without this the - // editor's dark surface shows through and default black text becomes unreadable. - webview.style.backgroundColor = '#fff' webview.style.display = 'flex' webview.style.width = '100%' webview.style.height = '100%'