diff --git a/packages/react/src/components/UIShell/HeaderMenu.js b/packages/react/src/components/UIShell/HeaderMenu.js
index 9f82399a2200..02736368b5cf 100644
--- a/packages/react/src/components/UIShell/HeaderMenu.js
+++ b/packages/react/src/components/UIShell/HeaderMenu.js
@@ -212,10 +212,12 @@ class HeaderMenu extends React.Component {
    * sequence when they might not want to go through all the items.
    */
   _renderMenuItem = (item, index) => {
-    return React.cloneElement(item, {
-      ref: this.handleItemRef(index),
-      role: 'none',
-    });
+    if (React.isValidElement(item)) {
+      return React.cloneElement(item, {
+        ref: this.handleItemRef(index),
+        role: 'none',
+      });
+    }
   };
 }
 
diff --git a/packages/react/src/components/UIShell/HeaderNavigation.js b/packages/react/src/components/UIShell/HeaderNavigation.js
index bddcbb3b2c7f..84e9293b8fd6 100644
--- a/packages/react/src/components/UIShell/HeaderNavigation.js
+++ b/packages/react/src/components/UIShell/HeaderNavigation.js
@@ -81,8 +81,10 @@ export default class HeaderNavigation extends React.Component {
    * `this.items` to properly manage focus.
    */
   _renderNavItem = (child, index) => {
-    return React.cloneElement(child, {
-      ref: this.handleItemRef(index),
-    });
+    if (React.isValidElement(child)) {
+      return React.cloneElement(child, {
+        ref: this.handleItemRef(index),
+      });
+    }
   };
 }