[Enterprise Search] Update the browser/document title on plugin navigation (#74392)

* Rename kibana_breadcrumbs to kibana_chrome

- in anticipation of upcoming refactor where SetPageChrome now handles document title as well as Kibana breadcrumbs
+ cleanup exports

* Add generate_title helpers

- will be used by new set_chrome helper

* Add setDocTitle context + behavior to set_chrome

+ refactor set_chrome.test.tsx:
  - add title tests
  - add SetWorkplaceSearchChrome test to increase coverage
  - clean up inner/outer call in favor of simpler mocks/imports
  - simplify isRoot tests

* Update plugins to set product titles
- on mount but before render

* Copy feedback - change pipe separator to hyphen

- to match ' - Elastic'

* Add functional tests confirming that document titles updated

test/functional/services/common/browser.ts

@@ -163,6 +163,14 @@ export async function BrowserProvider({ getService }: FtrProviderContext) {
       return currentWithoutTime;
     }
 
+    /**
+     * Gets the page/document title of the focused window/frame.
+     * https://www.selenium.dev/selenium/docs/api/javascript/module/selenium-webdriver/chrome_exports_Driver.html#getTitle
+     */
+    public async getTitle() {
+      return await driver.getTitle();
+    }
+
     /**
      * Navigates the focused window/frame to a new URL.
      * https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/chrome_exports_Driver.html#get

x-pack/plugins/enterprise_search/public/applications/__mocks__/kibana_context.mock.ts

@@ -13,5 +13,6 @@ import { httpServiceMock } from 'src/core/public/mocks';
 export const mockKibanaContext = {
   http: httpServiceMock.createSetupContract(),
   setBreadcrumbs: jest.fn(),
+  setDocTitle: jest.fn(),
   enterpriseSearchUrl: 'http://localhost:3002',
 };

x-pack/plugins/enterprise_search/public/applications/app_search/components/empty_states/empty_state.tsx

@@ -9,7 +9,7 @@ import { EuiPage, EuiPageBody, EuiPageContent, EuiEmptyPrompt, EuiButton } from
 import { FormattedMessage } from '@kbn/i18n/react';
 
 import { sendTelemetry } from '../../../shared/telemetry';
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { KibanaContext, IKibanaContext } from '../../../index';
 
 import { EngineOverviewHeader } from '../engine_overview_header';
@@ -33,7 +33,7 @@ export const EmptyState: React.FC = () => {
 
   return (
     <EuiPage restrictWidth>
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
 
       <EuiPageBody>
         <EngineOverviewHeader />

x-pack/plugins/enterprise_search/public/applications/app_search/components/empty_states/error_state.tsx

@@ -8,7 +8,7 @@ import React from 'react';
 import { EuiPage, EuiPageBody, EuiPageContent } from '@elastic/eui';
 
 import { ErrorStatePrompt } from '../../../shared/error_state';
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendAppSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import { EngineOverviewHeader } from '../engine_overview_header';
 
@@ -17,7 +17,7 @@ import './empty_states.scss';
 export const ErrorState: React.FC = () => {
   return (
     <EuiPage restrictWidth>
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
       <SendTelemetry action="error" metric="cannot_connect" />
 
       <EuiPageBody>

x-pack/plugins/enterprise_search/public/applications/app_search/components/empty_states/loading_state.tsx

@@ -7,7 +7,7 @@
 import React from 'react';
 import { EuiPage, EuiPageBody, EuiPageContent, EuiSpacer, EuiLoadingContent } from '@elastic/eui';
 
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { EngineOverviewHeader } from '../engine_overview_header';
 
 import './empty_states.scss';
@@ -15,7 +15,7 @@ import './empty_states.scss';
 export const LoadingState: React.FC = () => {
   return (
     <EuiPage restrictWidth>
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
 
       <EuiPageBody>
         <EngineOverviewHeader />

x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_overview/engine_overview.tsx

@@ -16,7 +16,7 @@ import {
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendAppSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import { LicenseContext, ILicenseContext, hasPlatinumLicense } from '../../../shared/licensing';
 import { KibanaContext, IKibanaContext } from '../../../index';
@@ -93,7 +93,7 @@ export const EngineOverview: React.FC = () => {
 
   return (
     <EuiPage restrictWidth className="engineOverview">
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
       <SendTelemetry action="viewed" metric="engines_overview" />
 
       <EuiPageBody>

x-pack/plugins/enterprise_search/public/applications/app_search/components/setup_guide/setup_guide.test.tsx

@@ -7,7 +7,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SetupGuide as SetupGuideLayout } from '../../../shared/setup_guide';
 import { SetupGuide } from './';
 
@@ -16,6 +16,6 @@ describe('SetupGuide', () => {
     const wrapper = shallow(<SetupGuide />);
 
     expect(wrapper.find(SetupGuideLayout)).toHaveLength(1);
-    expect(wrapper.find(SetBreadcrumbs)).toHaveLength(1);
+    expect(wrapper.find(SetPageChrome)).toHaveLength(1);
   });
 });

x-pack/plugins/enterprise_search/public/applications/app_search/components/setup_guide/setup_guide.tsx

@@ -11,7 +11,7 @@ import { i18n } from '@kbn/i18n';
 
 import { APP_SEARCH_PLUGIN } from '../../../../../common/constants';
 import { SetupGuide as SetupGuideLayout } from '../../../shared/setup_guide';
-import { SetAppSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendAppSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import GettingStarted from '../../assets/getting_started.png';
 
@@ -22,7 +22,7 @@ export const SetupGuide: React.FC = () => (
     standardAuthLink="https://swiftype.com/documentation/app-search/self-managed/security#standard"
     elasticsearchNativeAuthLink="https://swiftype.com/documentation/app-search/self-managed/security#elasticsearch-native-realm"
   >
-    <SetBreadcrumbs
+    <SetPageChrome
       text={i18n.translate('xpack.enterpriseSearch.setupGuide.title', {
         defaultMessage: 'Setup Guide',
       })}

x-pack/plugins/enterprise_search/public/applications/index.tsx

@@ -17,6 +17,7 @@ export interface IKibanaContext {
   enterpriseSearchUrl?: string;
   http: HttpSetup;
   setBreadcrumbs(crumbs: ChromeBreadcrumb[]): void;
+  setDocTitle(title: string): void;
 }
 
 export const KibanaContext = React.createContext({});
@@ -41,6 +42,7 @@ export const renderApp = (
           http: core.http,
           enterpriseSearchUrl: config.host,
           setBreadcrumbs: core.chrome.setBreadcrumbs,
+          setDocTitle: core.chrome.docTitle.change,
         }}
       >
         <LicenseProvider license$={plugins.licensing.license$}>

x-pack/plugins/enterprise_search/public/applications/shared/kibana_breadcrumbs/set_breadcrumbs.test.tsx

@@ -1,63 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-import React from 'react';
-
-import '../../__mocks__/react_router_history.mock';
-import { mountWithKibanaContext } from '../../__mocks__';
-
-jest.mock('./generate_breadcrumbs', () => ({ appSearchBreadcrumbs: jest.fn() }));
-import { appSearchBreadcrumbs, SetAppSearchBreadcrumbs } from './';
-
-describe('SetAppSearchBreadcrumbs', () => {
-  const setBreadcrumbs = jest.fn();
-  const builtBreadcrumbs = [] as any;
-  const appSearchBreadCrumbsInnerCall = jest.fn().mockReturnValue(builtBreadcrumbs);
-  const appSearchBreadCrumbsOuterCall = jest.fn().mockReturnValue(appSearchBreadCrumbsInnerCall);
-  (appSearchBreadcrumbs as jest.Mock).mockImplementation(appSearchBreadCrumbsOuterCall);
-
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  const mountSetAppSearchBreadcrumbs = (props: any) => {
-    return mountWithKibanaContext(<SetAppSearchBreadcrumbs {...props} />, {
-      http: {},
-      enterpriseSearchUrl: 'http://localhost:3002',
-      setBreadcrumbs,
-    });
-  };
-
-  describe('when isRoot is false', () => {
-    const subject = () => mountSetAppSearchBreadcrumbs({ text: 'Page 1', isRoot: false });
-
-    it('calls appSearchBreadcrumbs to build breadcrumbs, then registers them with Kibana', () => {
-      subject();
-
-      // calls appSearchBreadcrumbs to build breadcrumbs with the target page and current location
-      expect(appSearchBreadCrumbsInnerCall).toHaveBeenCalledWith([
-        { text: 'Page 1', path: '/current-path' },
-      ]);
-
-      // then registers them with Kibana
-      expect(setBreadcrumbs).toHaveBeenCalledWith(builtBreadcrumbs);
-    });
-  });
-
-  describe('when isRoot is true', () => {
-    const subject = () => mountSetAppSearchBreadcrumbs({ text: 'Page 1', isRoot: true });
-
-    it('calls appSearchBreadcrumbs to build breadcrumbs with an empty breadcrumb, then registers them with Kibana', () => {
-      subject();
-
-      // uses an empty bredcrumb
-      expect(appSearchBreadCrumbsInnerCall).toHaveBeenCalledWith([]);
-
-      // then registers them with Kibana
-      expect(setBreadcrumbs).toHaveBeenCalledWith(builtBreadcrumbs);
-    });
-  });
-});

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/generate_breadcrumbs.test.ts

@@ -4,8 +4,12 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { generateBreadcrumb } from './generate_breadcrumbs';
-import { appSearchBreadcrumbs, enterpriseSearchBreadcrumbs, workplaceSearchBreadcrumbs } from './';
+import {
+  generateBreadcrumb,
+  appSearchBreadcrumbs,
+  enterpriseSearchBreadcrumbs,
+  workplaceSearchBreadcrumbs,
+} from './generate_breadcrumbs';
 
 import { mockHistory as mockHistoryUntyped } from '../../__mocks__';
 const mockHistory = mockHistoryUntyped as any;

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/generate_title.test.ts

@@ -0,0 +1,60 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import {
+  generateTitle,
+  enterpriseSearchTitle,
+  appSearchTitle,
+  workplaceSearchTitle,
+} from './generate_title';
+
+describe('generateTitle', () => {
+  it('creates a hyphen separated string from an array of page titles', () => {
+    const title = generateTitle(['Curations', 'some Engine', 'App Search']);
+    expect(title).toEqual('Curations - some Engine - App Search');
+  });
+});
+
+describe('enterpriseSearchTitle', () => {
+  it('automatically appends the Enterprise Search product onto the pages array', () => {
+    const title = enterpriseSearchTitle(['Setup Guide']);
+    expect(title).toEqual('Setup Guide - Enterprise Search');
+  });
+
+  it('can be mixed and matched', () => {
+    const title = enterpriseSearchTitle([appSearchTitle(['Some Page'])]);
+    expect(title).toEqual('Some Page - App Search - Enterprise Search');
+  });
+
+  it('falls back to product name', () => {
+    const title = enterpriseSearchTitle();
+    expect(title).toEqual('Enterprise Search');
+  });
+});
+
+describe('appSearchTitle', () => {
+  it('automatically appends the App Search product onto the pages array', () => {
+    const title = appSearchTitle(['Engines']);
+    expect(title).toEqual('Engines - App Search');
+  });
+
+  it('falls back to product name', () => {
+    const title = appSearchTitle();
+    expect(title).toEqual('App Search');
+  });
+});
+
+describe('workplaceSearchTitle', () => {
+  it('automatically appends the Workplace Search product onto the pages array', () => {
+    const title = workplaceSearchTitle(['Sources']);
+    expect(title).toEqual('Sources - Workplace Search');
+  });
+
+  it('falls back to product name', () => {
+    const title = workplaceSearchTitle();
+    expect(title).toEqual('Workplace Search');
+  });
+});

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/generate_title.ts

@@ -0,0 +1,38 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import {
+  ENTERPRISE_SEARCH_PLUGIN,
+  APP_SEARCH_PLUGIN,
+  WORKPLACE_SEARCH_PLUGIN,
+} from '../../../../common/constants';
+
+/**
+ * Generate a document title that generally follows our breadcrumb trails
+ * https://github.com/elastic/kibana/blob/master/docs/development/core/public/kibana-plugin-core-public.chromedoctitle.md
+ */
+
+export type TTitle = string[];
+
+/**
+ * Given an array of page titles, return a final formatted document title
+ * @param pages - e.g., ['Curations', 'some Engine', 'App Search']
+ * @returns - e.g., 'Curations | some Engine | App Search'
+ */
+export const generateTitle = (pages: TTitle) => pages.join(' - ');
+
+/**
+ * Product-specific helpers
+ */
+
+export const enterpriseSearchTitle = (page: TTitle = []) =>
+  generateTitle([...page, ENTERPRISE_SEARCH_PLUGIN.NAME]);
+
+export const appSearchTitle = (page: TTitle = []) =>
+  generateTitle([...page, APP_SEARCH_PLUGIN.NAME]);
+
+export const workplaceSearchTitle = (page: TTitle = []) =>
+  generateTitle([...page, WORKPLACE_SEARCH_PLUGIN.NAME]);

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/index.ts

@@ -4,9 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export {
-  enterpriseSearchBreadcrumbs,
-  appSearchBreadcrumbs,
-  workplaceSearchBreadcrumbs,
-} from './generate_breadcrumbs';
-export { SetAppSearchBreadcrumbs, SetWorkplaceSearchBreadcrumbs } from './set_breadcrumbs';
+export { SetAppSearchChrome, SetWorkplaceSearchChrome } from './set_chrome';

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/set_chrome.test.tsx

@@ -0,0 +1,84 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+
+import '../../__mocks__/react_router_history.mock';
+import { mockKibanaContext, mountWithKibanaContext } from '../../__mocks__';
+
+jest.mock('./generate_breadcrumbs', () => ({
+  appSearchBreadcrumbs: jest.fn(() => (crumbs: any) => crumbs),
+  workplaceSearchBreadcrumbs: jest.fn(() => (crumbs: any) => crumbs),
+}));
+import { appSearchBreadcrumbs, workplaceSearchBreadcrumbs } from './generate_breadcrumbs';
+
+jest.mock('./generate_title', () => ({
+  appSearchTitle: jest.fn((title: any) => title),
+  workplaceSearchTitle: jest.fn((title: any) => title),
+}));
+import { appSearchTitle, workplaceSearchTitle } from './generate_title';
+
+import { SetAppSearchChrome, SetWorkplaceSearchChrome } from './';
+
+describe('SetAppSearchChrome', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  afterEach(() => {
+    expect(appSearchBreadcrumbs).toHaveBeenCalled();
+    expect(appSearchTitle).toHaveBeenCalled();
+  });
+
+  it('sets breadcrumbs and document title', () => {
+    mountWithKibanaContext(<SetAppSearchChrome text="Engines" />);
+
+    expect(mockKibanaContext.setBreadcrumbs).toHaveBeenCalledWith([
+      {
+        text: 'Engines',
+        path: '/current-path',
+      },
+    ]);
+    expect(mockKibanaContext.setDocTitle).toHaveBeenCalledWith(['Engines']);
+  });
+
+  it('sets empty breadcrumbs and document title when isRoot is true', () => {
+    mountWithKibanaContext(<SetAppSearchChrome isRoot />);
+
+    expect(mockKibanaContext.setBreadcrumbs).toHaveBeenCalledWith([]);
+    expect(mockKibanaContext.setDocTitle).toHaveBeenCalledWith([]);
+  });
+});
+
+describe('SetWorkplaceSearchChrome', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  afterEach(() => {
+    expect(workplaceSearchBreadcrumbs).toHaveBeenCalled();
+    expect(workplaceSearchTitle).toHaveBeenCalled();
+  });
+
+  it('sets breadcrumbs and document title', () => {
+    mountWithKibanaContext(<SetWorkplaceSearchChrome text="Sources" />);
+
+    expect(mockKibanaContext.setBreadcrumbs).toHaveBeenCalledWith([
+      {
+        text: 'Sources',
+        path: '/current-path',
+      },
+    ]);
+    expect(mockKibanaContext.setDocTitle).toHaveBeenCalledWith(['Sources']);
+  });
+
+  it('sets empty breadcrumbs and document title when isRoot is true', () => {
+    mountWithKibanaContext(<SetWorkplaceSearchChrome isRoot />);
+
+    expect(mockKibanaContext.setBreadcrumbs).toHaveBeenCalledWith([]);
+    expect(mockKibanaContext.setDocTitle).toHaveBeenCalledWith([]);
+  });
+});

x-pack/plugins/enterprise_search/public/applications/shared/kibana_chrome/set_chrome.tsx

@@ -13,9 +13,10 @@ import {
   workplaceSearchBreadcrumbs,
   TBreadcrumbs,
 } from './generate_breadcrumbs';
+import { appSearchTitle, workplaceSearchTitle, TTitle } from './generate_title';
 
 /**
- * Small on-mount helper for setting Kibana's chrome breadcrumbs on any App Search view
+ * Helpers for setting Kibana chrome (breadcrumbs, doc titles) on React view mount
  * @see https://github.com/elastic/kibana/blob/master/src/core/public/chrome/chrome_service.tsx
  */
 
@@ -31,27 +32,31 @@ interface IRootBreadcrumbsProps {
 }
 type TBreadcrumbsProps = IBreadcrumbsProps | IRootBreadcrumbsProps;
 
-export const SetAppSearchBreadcrumbs: React.FC<TBreadcrumbsProps> = ({ text, isRoot }) => {
+export const SetAppSearchChrome: React.FC<TBreadcrumbsProps> = ({ text, isRoot }) => {
   const history = useHistory();
-  const { setBreadcrumbs } = useContext(KibanaContext) as IKibanaContext;
+  const { setBreadcrumbs, setDocTitle } = useContext(KibanaContext) as IKibanaContext;
 
   const crumb = isRoot ? [] : [{ text, path: history.location.pathname }];
+  const title = isRoot ? [] : [text];
 
   useEffect(() => {
     setBreadcrumbs(appSearchBreadcrumbs(history)(crumb as TBreadcrumbs | []));
+    setDocTitle(appSearchTitle(title as TTitle | []));
   }, []);
 
   return null;
 };
 
-export const SetWorkplaceSearchBreadcrumbs: React.FC<TBreadcrumbsProps> = ({ text, isRoot }) => {
+export const SetWorkplaceSearchChrome: React.FC<TBreadcrumbsProps> = ({ text, isRoot }) => {
   const history = useHistory();
-  const { setBreadcrumbs } = useContext(KibanaContext) as IKibanaContext;
+  const { setBreadcrumbs, setDocTitle } = useContext(KibanaContext) as IKibanaContext;
 
   const crumb = isRoot ? [] : [{ text, path: history.location.pathname }];
+  const title = isRoot ? [] : [text];
 
   useEffect(() => {
     setBreadcrumbs(workplaceSearchBreadcrumbs(history)(crumb as TBreadcrumbs | []));
+    setDocTitle(workplaceSearchTitle(title as TTitle | []));
   }, []);
 
   return null;

x-pack/plugins/enterprise_search/public/applications/workplace_search/components/error_state/error_state.tsx

@@ -9,14 +9,14 @@ import { EuiPage, EuiPageBody, EuiPageContent } from '@elastic/eui';
 
 import { WORKPLACE_SEARCH_PLUGIN } from '../../../../../common/constants';
 import { ErrorStatePrompt } from '../../../shared/error_state';
-import { SetWorkplaceSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendWorkplaceSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import { ViewContentHeader } from '../shared/view_content_header';
 
 export const ErrorState: React.FC = () => {
   return (
     <EuiPage restrictWidth>
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
       <SendTelemetry action="error" metric="cannot_connect" />
 
       <EuiPageBody>

x-pack/plugins/enterprise_search/public/applications/workplace_search/components/overview/overview.tsx

@@ -9,7 +9,7 @@ import { EuiPage, EuiPageBody, EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { useActions, useValues } from 'kea';
 
-import { SetWorkplaceSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendWorkplaceSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import { KibanaContext, IKibanaContext } from '../../../index';
 
@@ -72,7 +72,7 @@ export const Overview: React.FC = () => {
 
   return (
     <EuiPage restrictWidth>
-      <SetBreadcrumbs isRoot />
+      <SetPageChrome isRoot />
       <SendTelemetry action="viewed" metric="overview" />
 
       <EuiPageBody>

x-pack/plugins/enterprise_search/public/applications/workplace_search/components/setup_guide/setup_guide.test.tsx

@@ -7,7 +7,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import { SetWorkplaceSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SetupGuide as SetupGuideLayout } from '../../../shared/setup_guide';
 import { SetupGuide } from './';
 
@@ -16,6 +16,6 @@ describe('SetupGuide', () => {
     const wrapper = shallow(<SetupGuide />);
 
     expect(wrapper.find(SetupGuideLayout)).toHaveLength(1);
-    expect(wrapper.find(SetBreadcrumbs)).toHaveLength(1);
+    expect(wrapper.find(SetPageChrome)).toHaveLength(1);
   });
 });

x-pack/plugins/enterprise_search/public/applications/workplace_search/components/setup_guide/setup_guide.tsx

@@ -11,7 +11,7 @@ import { i18n } from '@kbn/i18n';
 
 import { WORKPLACE_SEARCH_PLUGIN } from '../../../../../common/constants';
 import { SetupGuide as SetupGuideLayout } from '../../../shared/setup_guide';
-import { SetWorkplaceSearchBreadcrumbs as SetBreadcrumbs } from '../../../shared/kibana_breadcrumbs';
+import { SetWorkplaceSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
 import { SendWorkplaceSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
 import GettingStarted from '../../assets/getting_started.png';
 
@@ -26,7 +26,7 @@ export const SetupGuide: React.FC = () => {
       standardAuthLink="https://www.elastic.co/guide/en/workplace-search/current/workplace-search-security.html#standard"
       elasticsearchNativeAuthLink="https://www.elastic.co/guide/en/workplace-search/current/workplace-search-security.html#elasticsearch-native-realm"
     >
-      <SetBreadcrumbs
+      <SetPageChrome
         text={i18n.translate('xpack.enterpriseSearch.setupGuide.title', {
           defaultMessage: 'Setup Guide',
         })}

x-pack/plugins/enterprise_search/public/plugin.ts

@@ -51,6 +51,8 @@ export class EnterpriseSearchPlugin implements Plugin {
       category: DEFAULT_APP_CATEGORIES.enterpriseSearch,
       mount: async (params: AppMountParameters) => {
         const [coreStart] = await core.getStartServices();
+        const { chrome } = coreStart;
+        chrome.docTitle.change(APP_SEARCH_PLUGIN.NAME);
 
         await this.setPublicUrl(config, coreStart.http);
 
@@ -68,6 +70,8 @@ export class EnterpriseSearchPlugin implements Plugin {
       category: DEFAULT_APP_CATEGORIES.enterpriseSearch,
       mount: async (params: AppMountParameters) => {
         const [coreStart] = await core.getStartServices();
+        const { chrome } = coreStart;
+        chrome.docTitle.change(WORKPLACE_SEARCH_PLUGIN.NAME);
 
         const { renderApp } = await import('./applications');
         const { WorkplaceSearch } = await import('./applications/workplace_search');

x-pack/test/functional_enterprise_search/apps/enterprise_search/with_host_configured/app_search/engines.ts

@@ -52,6 +52,9 @@ export default function enterpriseSearchSetupEnginesTests({
         await retry.try(async function () {
           const currentUrl = await browser.getCurrentUrl();
           expect(currentUrl).to.contain('/app_search');
+
+          const documentTitle = await browser.getTitle();
+          expect(documentTitle).to.contain('App Search - Elastic');
         });
       });
 

x-pack/test/functional_enterprise_search/apps/enterprise_search/without_host_configured/app_search/setup_guide.ts

@@ -29,6 +29,9 @@ export default function enterpriseSearchSetupGuideTests({
         await retry.try(async function () {
           const currentUrl = await browser.getCurrentUrl();
           expect(currentUrl).to.contain('/app_search/setup_guide');
+
+          const documentTitle = await browser.getTitle();
+          expect(documentTitle).to.contain('Setup Guide - App Search - Elastic');
         });
       });
     });

x-pack/test/functional_enterprise_search/apps/enterprise_search/without_host_configured/workplace_search/setup_guide.ts

@@ -29,6 +29,9 @@ export default function enterpriseSearchSetupGuideTests({
         await retry.try(async function () {
           const currentUrl = await browser.getCurrentUrl();
           expect(currentUrl).to.contain('/workplace_search/setup_guide');
+
+          const documentTitle = await browser.getTitle();
+          expect(documentTitle).to.contain('Setup Guide - Workplace Search - Elastic');
         });
       });
     });