diff --git a/pages/app/index.tsx b/pages/app/index.tsx
index b7ac1bfe6c..8acc87f7fd 100644
--- a/pages/app/index.tsx
+++ b/pages/app/index.tsx
@@ -26,6 +26,7 @@ import styles from './styles.scss';
interface GlobalFlags {
appLayoutWidget?: boolean;
appLayoutToolbar?: boolean;
+ appLayoutHideToolbarBreadcrumbs?: boolean;
oneTheme?: boolean;
}
// used for local dev / testing
@@ -99,9 +100,15 @@ function App() {
}
const history = createHashHistory();
-const { direction, visualRefresh, theme, appLayoutWidget, appLayoutToolbar, appLayoutDelayedWidget } = parseQuery(
- history.location.search
-);
+const {
+ direction,
+ visualRefresh,
+ theme,
+ appLayoutWidget,
+ appLayoutToolbar,
+ appLayoutHideToolbarBreadcrumbs,
+ appLayoutDelayedWidget,
+} = parseQuery(history.location.search);
const oneTheme = theme === Theme.OneTheme;
// core-update is an override on top of visual refresh, so it always requires the visual refresh base.
const coreNew = theme === Theme.CoreUpdate;
@@ -117,6 +124,7 @@ if (!window[awsuiCustomFlagsSymbol]) {
}
window[awsuiGlobalFlagsSymbol].appLayoutWidget = appLayoutWidget;
window[awsuiGlobalFlagsSymbol].appLayoutToolbar = appLayoutToolbar;
+window[awsuiGlobalFlagsSymbol].appLayoutHideToolbarBreadcrumbs = appLayoutHideToolbarBreadcrumbs;
window[awsuiCustomFlagsSymbol].appLayoutDelayedWidget = appLayoutDelayedWidget;
window[awsuiGlobalFlagsSymbol].oneTheme = oneTheme;
diff --git a/src/app-layout/__tests__/__snapshots__/widget-contract-old.test.tsx.snap b/src/app-layout/__tests__/__snapshots__/widget-contract-old.test.tsx.snap
index 11a4fd5e2c..b87fcab779 100644
--- a/src/app-layout/__tests__/__snapshots__/widget-contract-old.test.tsx.snap
+++ b/src/app-layout/__tests__/__snapshots__/widget-contract-old.test.tsx.snap
@@ -155,11 +155,11 @@ Map {
"toolbar": 0,
},
},
- "breadcrumbsExternallyOwned": false,
"featureNotificationsProps": {
"drawer": null,
"renderLatestFeaturePrompt": [Function],
},
+ "hideBreadcrumbsInToolbar": false,
"reportOwnBreadcrumbsProps": [Function],
"toolbarProps": {
"activeDrawerId": null,
@@ -1017,11 +1017,11 @@ Map {
"toolbar": 0,
},
},
- "breadcrumbsExternallyOwned": false,
"featureNotificationsProps": {
"drawer": null,
"renderLatestFeaturePrompt": [Function],
},
+ "hideBreadcrumbsInToolbar": false,
"reportOwnBreadcrumbsProps": [Function],
"toolbarProps": {
"activeDrawerId": null,
@@ -2081,11 +2081,11 @@ Map {
"toolbar": 0,
},
},
- "breadcrumbsExternallyOwned": false,
"featureNotificationsProps": {
"drawer": null,
"renderLatestFeaturePrompt": [Function],
},
+ "hideBreadcrumbsInToolbar": false,
"reportOwnBreadcrumbsProps": [Function],
"toolbarProps": {
"activeDrawerId": "security",
diff --git a/src/app-layout/__tests__/__snapshots__/widget-contract-split-panel-old.test.tsx.snap b/src/app-layout/__tests__/__snapshots__/widget-contract-split-panel-old.test.tsx.snap
index bf3089b325..774fc09b24 100644
--- a/src/app-layout/__tests__/__snapshots__/widget-contract-split-panel-old.test.tsx.snap
+++ b/src/app-layout/__tests__/__snapshots__/widget-contract-split-panel-old.test.tsx.snap
@@ -155,11 +155,11 @@ Map {
"toolbar": 0,
},
},
- "breadcrumbsExternallyOwned": false,
"featureNotificationsProps": {
"drawer": null,
"renderLatestFeaturePrompt": [Function],
},
+ "hideBreadcrumbsInToolbar": false,
"reportOwnBreadcrumbsProps": [Function],
"toolbarProps": {
"activeDrawerId": null,
@@ -1018,11 +1018,11 @@ Map {
"toolbar": 0,
},
},
- "breadcrumbsExternallyOwned": false,
"featureNotificationsProps": {
"drawer": null,
"renderLatestFeaturePrompt": [Function],
},
+ "hideBreadcrumbsInToolbar": false,
"reportOwnBreadcrumbsProps": [Function],
"toolbarProps": {
"activeDrawerId": null,
diff --git a/src/app-layout/__tests__/runtime-breadcrumbs-widgetized.test.tsx b/src/app-layout/__tests__/runtime-breadcrumbs-widgetized.test.tsx
index e7db26aabd..3e6d50ba44 100644
--- a/src/app-layout/__tests__/runtime-breadcrumbs-widgetized.test.tsx
+++ b/src/app-layout/__tests__/runtime-breadcrumbs-widgetized.test.tsx
@@ -3,6 +3,8 @@
import React from 'react';
import { act, cleanup, render, waitFor } from '@testing-library/react';
+import { setGlobalFlag } from '@cloudscape-design/component-toolkit/internal/testing';
+
import AppLayout from '../../../lib/components/app-layout';
import BreadcrumbGroup, { BreadcrumbGroupProps } from '../../../lib/components/breadcrumb-group';
import { getFunnelNameSelector } from '../../../lib/components/internal/analytics/selectors';
@@ -363,4 +365,33 @@ describeEachAppLayout({ themes: ['refresh-toolbar'], sizes: ['desktop'] }, () =>
second.unregister();
});
+
+ describe('with appLayoutHideToolbarBreadcrumbs flag', () => {
+ const flagName = 'appLayoutHideToolbarBreadcrumbs';
+
+ beforeEach(() => setGlobalFlag(flagName, true));
+ afterEach(() => setGlobalFlag(flagName, undefined));
+
+ test('marks breadcrumbs as externally owned on first render without a consumer', () => {
+ render(