Don't render hook steps with no content (#361)

cucumber · Jan 22, 2025 · 075a33b · 075a33b
1 parent f440962
commit 075a33b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Unreleased]
+### Fixed
+- Don't render hook steps with no content ([#361](https://github.com/cucumber/react-components/pull/361))
 
 ## [22.3.0] - 2024-08-02
 ### Added

diff --git a/src/components/gherkin/HookSteps.tsx b/src/components/gherkin/HookSteps.tsx
@@ -10,11 +10,12 @@ interface IProps {
 export const HookSteps: React.FunctionComponent<IProps> = ({ hookSteps }) => {
   return (
     <>
-      {hookSteps.map((step, index) => (
-        <li key={index}>
-          <HookStep key={index} step={step} />
-        </li>
-      ))}
+      {hookSteps
+        .map((step, index) => <HookStep key={index} step={step} />)
+        .filter((el) => !!el.props.children?.length)
+        .map((el, index) => (
+          <li key={index}>{el}</li>
+        ))}
     </>
   )
 }