diff --git a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx
index ea1bea52c83d..1ff789ab6120 100644
--- a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx
+++ b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx
@@ -41,6 +41,7 @@ import { useDashboardOutcomeValidation } from './hooks/use_dashboard_outcome_val
import { loadDashboardHistoryLocationState } from './locator/load_dashboard_history_location_state';
import type { DashboardCreationOptions } from '../dashboard_container/embeddable/dashboard_container_factory';
import { DashboardTopNav } from '../dashboard_top_nav';
+import { DashboardTabTitleSetter } from './tab_title_setter/dashboard_tab_title_setter';
export interface DashboardAppProps {
history: History;
@@ -200,15 +201,17 @@ export function DashboardApp({
{!showNoDataPage && (
<>
{dashboardAPI && (
-
+ <>
+
+
+ >
)}
{getLegacyConflictWarning?.()}
-
{
+ const {
+ chrome: { docTitle: chromeDocTitle },
+ } = pluginServices.getServices();
+ const title = dashboardContainer.select((state) => state.explicitInput.title);
+ const lastSavedId = dashboardContainer.select((state) => state.componentState.lastSavedId);
+
+ /**
+ * Set chrome tab title when dashboard's title changes
+ */
+ useEffect(() => {
+ /** We do not want the tab title to include the "Editing" prefix, so always send in view mode */
+ chromeDocTitle.change(getDashboardTitle(title, ViewMode.VIEW, !lastSavedId));
+ }, [title, chromeDocTitle, lastSavedId]);
+
+ return null;
+};
diff --git a/test/functional/apps/dashboard/group5/dashboard_settings.ts b/test/functional/apps/dashboard/group5/dashboard_settings.ts
index ae0e727814ee..bd6fb8d6c83a 100644
--- a/test/functional/apps/dashboard/group5/dashboard_settings.ts
+++ b/test/functional/apps/dashboard/group5/dashboard_settings.ts
@@ -12,6 +12,7 @@ import { FtrProviderContext } from '../../../ftr_provider_context';
export default function ({ getService, getPageObjects }: FtrProviderContext) {
const retry = getService('retry');
+ const browser = getService('browser');
const globalNav = getService('globalNav');
const kibanaServer = getService('kibanaServer');
const dashboardSettings = getService('dashboardSettings');
@@ -20,6 +21,14 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
describe('dashboard settings', () => {
let originalTitles: string[] = [];
+ const checkDashboardTitle = async (expectedTitle: string) => {
+ expect(await browser.getTitle()).to.equal(`${expectedTitle} - Elastic`);
+ await retry.try(async () => {
+ const breadcrumb = await globalNav.getLastBreadcrumb();
+ expect(breadcrumb).to.equal(`Editing ${expectedTitle}`);
+ });
+ };
+
before(async () => {
await kibanaServer.savedObjects.cleanStandardList();
await kibanaServer.importExport.load(
@@ -60,13 +69,14 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
});
it('should update the title of the dashboard', async () => {
+ await checkDashboardTitle('few panels');
+
const newTitle = 'My awesome dashboard!!1';
await PageObjects.dashboard.openSettingsFlyout();
await dashboardSettings.setCustomPanelTitle(newTitle);
await dashboardSettings.clickApplyButton();
- await retry.try(async () => {
- expect((await globalNav.getLastBreadcrumb()) === newTitle);
- });
+
+ await checkDashboardTitle(newTitle);
});
it('should disable quick save when the settings are open', async () => {
@@ -106,9 +116,8 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await dashboardSettings.expectDuplicateTitleWarningDisplayed();
});
await dashboardSettings.clickApplyButton();
- await retry.try(async () => {
- expect((await globalNav.getLastBreadcrumb()) === newTitle);
- });
+
+ await checkDashboardTitle(newTitle);
});
});
}