From 84fecd352109e2310116d79bce3f3cc920ca5c93 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 3 Dec 2025 16:03:18 +0100 Subject: [PATCH] Backoffice: CTRL+Click to open in a new tab should work on Linux (closes #21009) (#21027) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: uses 'href' as property instead of attribute * build: runs on PR to release branches * Content references: Avoid requesting references for content that is not yet persisted server side (#21035) * Avoid requesting references for content that is not yet persisted server side. * Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * refactor to use condition * revert * danish translations * da translation --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Co-authored-by: Niels Lyngsø * fix: CTRL+Click now opens links in new tab on Linux The router's anchor click handler incorrectly assumed non-Windows platforms use Meta (⌘) key for "open in new tab". This broke CTRL+Click on Linux, which uses CTRL like Windows. Changed detection from "is Windows" to "is Mac" so Linux correctly uses CTRL+Click while Mac continues to use Meta+Click. Also replaced deprecated navigator.platform with navigator.userAgent. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --------- Co-authored-by: Andy Butland Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Co-authored-by: Niels Lyngsø Co-authored-by: Claude --- .github/workflows/azure-backoffice.yml | 2 ++ .../components/backoffice-header-sections.element.ts | 9 +++------ .../src/packages/core/router/router-slot/util/anchor.ts | 8 +++++--- 3 files changed, 10 insertions(+), 9 deletions(-) diff --git a/.github/workflows/azure-backoffice.yml b/.github/workflows/azure-backoffice.yml index 61c1d5e4c1..919d81b877 100644 --- a/.github/workflows/azure-backoffice.yml +++ b/.github/workflows/azure-backoffice.yml @@ -4,6 +4,7 @@ on: push: branches: - main + - release/* - v*/dev - v*/main paths: @@ -15,6 +16,7 @@ on: types: [opened, synchronize, reopened, closed] branches: - main + - release/* - v*/dev - v*/main workflow_dispatch: diff --git a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts index 407ca3fa7c..48cad6b43c 100644 --- a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts +++ b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts @@ -1,6 +1,5 @@ import { UMB_BACKOFFICE_CONTEXT } from '../backoffice.context.js'; import type { UmbBackofficeContext } from '../backoffice.context.js'; -import type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit'; import { css, customElement, html, ifDefined, repeat, state } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; import type { ManifestSection } from '@umbraco-cms/backoffice/section'; @@ -113,15 +112,13 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement { const label = this.localize.string(manifest?.meta.label || manifest?.name); return html` this.#onSectionClick(event, manifest)} - >${label}`; + @click=${(event: PointerEvent) => this.#onSectionClick(event, manifest)}>`; } - static override styles: CSSResultGroup = [ + static override readonly styles = [ css` :host { display: contents; diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/router/router-slot/util/anchor.ts b/src/Umbraco.Web.UI.Client/src/packages/core/router/router-slot/util/anchor.ts index 267ff0283d..2b02f4e731 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/router/router-slot/util/anchor.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/router/router-slot/util/anchor.ts @@ -3,11 +3,13 @@ * that has a relative HREF, uses the history API instead. */ export function ensureAnchorHistory() { - const isWindows = navigator.platform.toUpperCase().indexOf('WIN') !== -1; + const isMac = /Mac|iPhone|iPad|iPod/.test(navigator.userAgent); window.addEventListener('click', (e: MouseEvent) => { - // If we try to open link in a new tab, then we want to skip skip: - if ((isWindows && e.ctrlKey) || (!isWindows && e.metaKey)) return; + // If we try to open link in a new tab, we want to skip: + // - Mac uses Meta (⌘) + Click + // - Windows and Linux use Ctrl + Click + if ((isMac && e.metaKey) || (!isMac && e.ctrlKey)) return; // Find the target by using the composed path to get the element through the shadow boundaries. // Support both HTML anchor tags and SVG anchor tags