From 65cd0b0155cffdeefc7145d9313a40e62e8c1e36 Mon Sep 17 00:00:00 2001 From: James Talton Date: Tue, 12 Mar 2024 09:23:56 -0400 Subject: [PATCH 1/3] Fix crash in menu --- .../react-core/src/components/Menu/Menu.tsx | 26 ++++++++++--------- 1 file changed, 14 insertions(+), 12 deletions(-) diff --git a/packages/react-core/src/components/Menu/Menu.tsx b/packages/react-core/src/components/Menu/Menu.tsx index 18c084449bf..521910ea112 100644 --- a/packages/react-core/src/components/Menu/Menu.tsx +++ b/packages/react-core/src/components/Menu/Menu.tsx @@ -156,20 +156,22 @@ class MenuBase extends React.Component { this.setState({ transitionMoveTarget: null }); } else { const nextMenu = current.querySelector('#' + this.props.activeMenu) || current || null; - const nextMenuChildren = Array.from(nextMenu.getElementsByTagName('UL')[0].children); + const nextMenuLists = nextMenu.getElementsByTagName('UL'); + if (nextMenuLists.length > 0) { + const nextMenuChildren = Array.from(nextMenuLists[0].children); - if (!this.state.currentDrilldownMenuId || nextMenu.id !== this.state.currentDrilldownMenuId) { - this.setState({ currentDrilldownMenuId: nextMenu.id }); - } else { - // if the drilldown transition ends on the same menu, do not focus the first item - return; + if (!this.state.currentDrilldownMenuId || nextMenu.id !== this.state.currentDrilldownMenuId) { + this.setState({ currentDrilldownMenuId: nextMenu.id }); + } else { + // if the drilldown transition ends on the same menu, do not focus the first item + return; + } + const nextTarget = nextMenuChildren.filter( + (el) => !(el.classList.contains('pf-m-disabled') || el.classList.contains(styles.divider)) + )[0].firstChild; + (nextTarget as HTMLElement).focus(); + (nextTarget as HTMLElement).tabIndex = 0; } - const nextTarget = nextMenuChildren.filter( - (el) => !(el.classList.contains('pf-m-disabled') || el.classList.contains(styles.divider)) - )[0].firstChild; - - (nextTarget as HTMLElement).focus(); - (nextTarget as HTMLElement).tabIndex = 0; } }; From a74a0dc24e1babb356f4e06654410b231977ea19 Mon Sep 17 00:00:00 2001 From: James Talton Date: Tue, 12 Mar 2024 13:21:49 -0400 Subject: [PATCH 2/3] Update code best on review feedback --- .../react-core/src/components/Menu/Menu.tsx | 26 +++++++++---------- 1 file changed, 12 insertions(+), 14 deletions(-) diff --git a/packages/react-core/src/components/Menu/Menu.tsx b/packages/react-core/src/components/Menu/Menu.tsx index 521910ea112..8f63be9f741 100644 --- a/packages/react-core/src/components/Menu/Menu.tsx +++ b/packages/react-core/src/components/Menu/Menu.tsx @@ -157,21 +157,19 @@ class MenuBase extends React.Component { } else { const nextMenu = current.querySelector('#' + this.props.activeMenu) || current || null; const nextMenuLists = nextMenu.getElementsByTagName('UL'); - if (nextMenuLists.length > 0) { - const nextMenuChildren = Array.from(nextMenuLists[0].children); - - if (!this.state.currentDrilldownMenuId || nextMenu.id !== this.state.currentDrilldownMenuId) { - this.setState({ currentDrilldownMenuId: nextMenu.id }); - } else { - // if the drilldown transition ends on the same menu, do not focus the first item - return; - } - const nextTarget = nextMenuChildren.filter( - (el) => !(el.classList.contains('pf-m-disabled') || el.classList.contains(styles.divider)) - )[0].firstChild; - (nextTarget as HTMLElement).focus(); - (nextTarget as HTMLElement).tabIndex = 0; + if (nextMenuLists.length == 0) return; + const nextMenuChildren = Array.from(nextMenuLists[0].children); + if (!this.state.currentDrilldownMenuId || nextMenu.id !== this.state.currentDrilldownMenuId) { + this.setState({ currentDrilldownMenuId: nextMenu.id }); + } else { + // if the drilldown transition ends on the same menu, do not focus the first item + return; } + const nextTarget = nextMenuChildren.filter( + (el) => !(el.classList.contains('pf-m-disabled') || el.classList.contains(styles.divider)) + )[0].firstChild; + (nextTarget as HTMLElement).focus(); + (nextTarget as HTMLElement).tabIndex = 0; } }; From 018635c380d085289b2f9367f95688a0e7c4723b Mon Sep 17 00:00:00 2001 From: James Talton Date: Tue, 12 Mar 2024 14:56:17 -0400 Subject: [PATCH 3/3] fix linting --- packages/react-core/src/components/Menu/Menu.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Menu/Menu.tsx b/packages/react-core/src/components/Menu/Menu.tsx index 8f63be9f741..8aa8eda6087 100644 --- a/packages/react-core/src/components/Menu/Menu.tsx +++ b/packages/react-core/src/components/Menu/Menu.tsx @@ -157,7 +157,9 @@ class MenuBase extends React.Component { } else { const nextMenu = current.querySelector('#' + this.props.activeMenu) || current || null; const nextMenuLists = nextMenu.getElementsByTagName('UL'); - if (nextMenuLists.length == 0) return; + if (nextMenuLists.length === 0) { + return; + } const nextMenuChildren = Array.from(nextMenuLists[0].children); if (!this.state.currentDrilldownMenuId || nextMenu.id !== this.state.currentDrilldownMenuId) { this.setState({ currentDrilldownMenuId: nextMenu.id });