Include pass rate in execution summary

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]
+### Added
+- Include pass rate in execution summary ([#397](https://github.com/cucumber/react-components/pull/397))
 
 ## [23.2.0] - 2025-08-07
 ### Changed

src/components/app/ExecutionSummary.spec.tsx

@@ -79,7 +79,7 @@ Platform: [email protected]`)
         </EnvelopesProvider>
       )
 
-      expect(screen.getByText('55.5% passed')).to.be.visible
+      expect(screen.getByText('55.5% (5 / 9) passed')).to.be.visible
     })
 
     it('should include the job link', () => {

src/components/app/ExecutionSummary.tsx

@@ -5,6 +5,7 @@ import React, { FC } from 'react'
 
 import { formatExecutionDistance } from '../../formatExecutionDistance.js'
 import { formatExecutionDuration } from '../../formatExecutionDuration.js'
+import { formatPassedQuantity } from '../../formatPassedQuantity.js'
 import { formatStatusRate } from '../../formatStatusRate.js'
 import { useQueries } from '../../hooks/index.js'
 import { useResultStatistics } from '../../hooks/useResultStatistics.js'
@@ -62,6 +63,10 @@ export const ExecutionSummary: FC = () => {
               {formatStatusRate(
                 scenarioCountByStatus[TestStepResultStatus.PASSED],
                 totalScenarioCount
+              )}{' '}
+              {formatPassedQuantity(
+                scenarioCountByStatus[TestStepResultStatus.PASSED],
+                totalScenarioCount
               )}
               {' passed'}
             </span>

src/formatPassedQuantity.spec.ts

@@ -0,0 +1,22 @@
+import { expect } from 'chai'
+
+import { formatPassedQuantity } from './formatPassedQuantity.js'
+
+describe('formatPassedQuantity', () => {
+  const examples: [passed: number, total: number, proportion: string][] = [
+    [13, 45, '(13 / 45)'],
+    [5, 45, '(5 / 45)'],
+    [45, 45, '(45 / 45)'],
+    [0, 45, '(0 / 45)'],
+    [0, 0, '(0 / 0)'],
+    [999, 1000, '(999 / 1000)'],
+    [99999, 100000, '(99999 / 100000)'],
+    [9999999, 10000000, '(9999999 / 10000000)'],
+  ]
+
+  for (const [passed, total, proportion] of examples) {
+    it(`should render correctly for ${proportion}`, () => {
+      expect(formatPassedQuantity(passed, total)).to.eq(proportion)
+    })
+  }
+})

src/formatPassedQuantity.ts

@@ -0,0 +1,3 @@
+export function formatPassedQuantity(passed: number, total: number) {
+  return `(${passed} / ${total})`
+}