diff --git a/packages/jaeger-ui/src/components/App/TopNav.js b/packages/jaeger-ui/src/components/App/TopNav.js index d414395836..fe4f0d5d40 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.js +++ b/packages/jaeger-ui/src/components/App/TopNav.js @@ -52,21 +52,19 @@ if (getConfigValue('dependencies.menuEnabled')) { }); } -function CustomNavDropdown({ label, items }: ConfigMenuGroup) { - const menuItems = ( - - {items.map(item => { - const { label: itemLabel, url } = item; - return ( - - - {itemLabel} - - - ); - })} - +function getItemLink(item: ConfigMenuItem) { + const { label, anchorTarget, url } = item; + return ( + + + {label} + + ); +} + +function CustomNavDropdown({ label, items }: ConfigMenuGroup) { + const menuItems = {items.map(getItemLink)}; return ( @@ -84,20 +82,13 @@ export function TopNavImpl(props: Props) {
{menuItems.map(m => { - if (m.items != null) { - const group = ((m: any): ConfigMenuGroup); - return ( - - - - ); + if (!m.items) { + return getItemLink(m); } - const item = ((m: any): ConfigMenuItem); + const group = ((m: any): ConfigMenuGroup); return ( - - - {item.label} - + + ); })} diff --git a/packages/jaeger-ui/src/components/App/TopNav.test.js b/packages/jaeger-ui/src/components/App/TopNav.test.js index e38254d003..b95d516494 100644 --- a/packages/jaeger-ui/src/components/App/TopNav.test.js +++ b/packages/jaeger-ui/src/components/App/TopNav.test.js @@ -21,6 +21,7 @@ import { TopNavImpl as TopNav } from './TopNav'; describe('', () => { const labelGitHub = 'GitHub'; const githubUrl = 'https://github.com/uber/jaeger'; + const blogUrl = 'https://medium.com/jaegertracing/'; const labelAbout = 'About Jaeger'; const dropdownItems = [ { @@ -30,20 +31,28 @@ describe('', () => { { label: 'Twitter', url: 'https://twitter.com/JaegerTracing', + anchorTarget: '_self', }, ]; + const configMenuGroup = { + label: labelAbout, + items: dropdownItems, + }; + const defaultProps = { config: { menu: [ { label: labelGitHub, url: githubUrl, + anchorTarget: '_self', }, { - label: labelAbout, - items: dropdownItems, + label: 'Blog', + url: blogUrl, }, + configMenuGroup, ], }, router: { @@ -87,5 +96,32 @@ describe('', () => { expect(item.prop('label')).toBe(labelAbout); expect(item.prop('items')).toBe(dropdownItems); }); + + it('adds target=_self to top-level item', () => { + const item = wrapper.find(`[href="${githubUrl}"]`); + expect(item.length).toBe(1); + expect(item.find(`[target="_self"]`).length).toBe(1); + }); + + it('sets target=_blank by default', () => { + const item = wrapper.find(`[href="${blogUrl}"]`); + expect(item.length).toBe(1); + expect(item.find(`[target="_blank"]`).length).toBe(1); + }); + + describe('', () => { + beforeEach(() => { + wrapper = shallow(); + }); + + it('renders sub-menu items', () => { + const subMenu = shallow(wrapper.find('Dropdown').props().overlay); + dropdownItems.forEach(itemConfig => { + const item = subMenu.find(`[href="${itemConfig.url}"]`); + expect(item.length).toBe(1); + expect(item.prop('target')).toBe(itemConfig.anchorTarget || '_blank'); + }); + }); + }); }); }); diff --git a/packages/jaeger-ui/src/types/config.js b/packages/jaeger-ui/src/types/config.js index e6e6d6a978..95aded2ce7 100644 --- a/packages/jaeger-ui/src/types/config.js +++ b/packages/jaeger-ui/src/types/config.js @@ -17,6 +17,7 @@ export type ConfigMenuItem = { label: string, url: string, + anchorTarget?: '_self' | '_blank' | '_parent' | '_top', }; export type ConfigMenuGroup = {