From 183773e746dcb8ff892d175b262455d9bceae047 Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 22 Sep 2025 14:21:25 +0200 Subject: [PATCH 01/16] Add preliminary support for rendering run hooks --- src/components/app/TestRunHooks.stories.tsx | 41 +++++++++++++++++++ src/components/app/TestRunHooks.tsx | 29 +++++++++++++ src/components/app/index.ts | 1 + .../gherkin/TestRunHooksList.module.scss | 13 ++++++ src/components/gherkin/TestRunHooksList.tsx | 11 +++++ .../results/TestRunHookOutcome.module.scss | 36 ++++++++++++++++ src/components/results/TestRunHookOutcome.tsx | 35 ++++++++++++++++ .../results/TestStepAttachments.tsx | 8 ++-- src/components/results/TestStepOutcome.tsx | 2 +- 9 files changed, 171 insertions(+), 5 deletions(-) create mode 100644 src/components/app/TestRunHooks.stories.tsx create mode 100644 src/components/app/TestRunHooks.tsx create mode 100644 src/components/gherkin/TestRunHooksList.module.scss create mode 100644 src/components/gherkin/TestRunHooksList.tsx create mode 100644 src/components/results/TestRunHookOutcome.module.scss create mode 100644 src/components/results/TestRunHookOutcome.tsx diff --git a/src/components/app/TestRunHooks.stories.tsx b/src/components/app/TestRunHooks.stories.tsx new file mode 100644 index 00000000..7d9a177c --- /dev/null +++ b/src/components/app/TestRunHooks.stories.tsx @@ -0,0 +1,41 @@ +import * as messages from '@cucumber/messages' +import { Story } from '@ladle/react' +import React from 'react' + +import globalHooksAttachments from '../../../acceptance/global-hooks-attachments/global-hooks-attachments.js' +import globalHooksBeforeAllError from '../../../acceptance/global-hooks-beforeall-error/global-hooks-beforeall-error.js' +import globalHooksAfterAllError from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' +import { EnvelopesProvider, FilteredDocuments } from './index.js' +import { TestRunHooks } from './TestRunHooks.js' + +type TemplateArgs = { + envelopes: readonly messages.Envelope[] +} + +const Template: Story = ({ envelopes }) => { + return ( + + + + + ) +} + +export default { + title: 'Gherkin/RunHooksList', +} + +export const GlobalHooksWithAttachments = Template.bind({}) +GlobalHooksWithAttachments.args = { + envelopes: globalHooksAttachments, +} + +export const GlobalHooksBeforeAllError = Template.bind({}) +GlobalHooksBeforeAllError.args = { + envelopes: globalHooksBeforeAllError, +} + +export const GlobalHooksAfterAllError = Template.bind({}) +GlobalHooksAfterAllError.args = { + envelopes: globalHooksAfterAllError, +} \ No newline at end of file diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx new file mode 100644 index 00000000..9055d704 --- /dev/null +++ b/src/components/app/TestRunHooks.tsx @@ -0,0 +1,29 @@ +import { TestRunHookFinished } from '@cucumber/messages' +import React, { FC } from 'react' + +import { useQueries } from '../../hooks/useQueries.js' +import { RunHooksList } from '../gherkin/TestRunHooksList.js' +import { RunHookOutcome } from '../results/TestRunHookOutcome.js' + +export const TestRunHooks: FC = () => { + const { cucumberQuery } = useQueries() + const testRunHooksFinished: ReadonlyArray = + cucumberQuery.findAllTestRunHookFinished() + return ( + + {testRunHooksFinished.map((testRunHookFinished) => { + const testRunHook = cucumberQuery.findHookBy(testRunHookFinished) + + return ( + + ) + })} + + ) +} diff --git a/src/components/app/index.ts b/src/components/app/index.ts index 69014e14..f73e703d 100644 --- a/src/components/app/index.ts +++ b/src/components/app/index.ts @@ -11,4 +11,5 @@ export * from './QueriesProvider.js' export * from './Report.js' export * from './SearchBar.js' export * from './StatusesSummary.js' +export * from './TestRunHooks.js' export * from './UrlSearchProvider.js' diff --git a/src/components/gherkin/TestRunHooksList.module.scss b/src/components/gherkin/TestRunHooksList.module.scss new file mode 100644 index 00000000..64d24877 --- /dev/null +++ b/src/components/gherkin/TestRunHooksList.module.scss @@ -0,0 +1,13 @@ +.hooks { + padding: 0; + margin: 0.875em 1em; + list-style: none; + + > li { + list-style: none; + + &:not(:empty) { + padding: 0.125em 0; + } + } +} diff --git a/src/components/gherkin/TestRunHooksList.tsx b/src/components/gherkin/TestRunHooksList.tsx new file mode 100644 index 00000000..722b425f --- /dev/null +++ b/src/components/gherkin/TestRunHooksList.tsx @@ -0,0 +1,11 @@ +import React, { FunctionComponent, ReactNode } from 'react' + +import styles from './TestRunHooksList.module.scss' + +export const RunHooksList: FunctionComponent<{ children: ReactNode }> = ({ children }) => { + return ( +
    + {children} +
+ ) +} diff --git a/src/components/results/TestRunHookOutcome.module.scss b/src/components/results/TestRunHookOutcome.module.scss new file mode 100644 index 00000000..be318e50 --- /dev/null +++ b/src/components/results/TestRunHookOutcome.module.scss @@ -0,0 +1,36 @@ +.header { + display: flex; + width: 100%; + gap: 0.25rem; +} + +.status { + padding-top: 0.1em; +} + +.title { + > * { + vertical-align: middle; + + & + * { + margin-left: 0.5em; + } + } +} + +.name { + font-size: 1em; + display: inline; + font-weight: normal; + padding: 0; + margin: 0; +} + +.content { + margin-left: 1.125rem; + + // bits of detail (doc string, data table, error, attachments) get consistent spacing between them + > * { + margin-top: 0.25rem !important; + } +} diff --git a/src/components/results/TestRunHookOutcome.tsx b/src/components/results/TestRunHookOutcome.tsx new file mode 100644 index 00000000..664f571e --- /dev/null +++ b/src/components/results/TestRunHookOutcome.tsx @@ -0,0 +1,35 @@ +import { Hook, HookType, TestRunHookFinished } from '@cucumber/messages' +import React, { FC } from 'react' + +import { StatusIcon } from '../gherkin/index.js' +import styles from './TestRunHookOutcome.module.scss' +import { TestStepAttachments } from './TestStepAttachments.js' +import { TestStepDuration } from './TestStepDuration.js' +import { TestStepResultDetails } from './TestStepResultDetails.js' + +interface Props { + hook: Hook + testRunHookFinished: TestRunHookFinished +} + +export const RunHookOutcome: FC = ({ hook, testRunHookFinished }) => { + return ( +
  • +
    +
    + +
    +
    +

    + {hook.type === HookType.BEFORE_TEST_RUN ? 'BeforeAll' : 'AfterAll'} +

    + +
    +
    +
    + + +
    +
  • + ) +} diff --git a/src/components/results/TestStepAttachments.tsx b/src/components/results/TestStepAttachments.tsx index 6da6a371..6003718f 100644 --- a/src/components/results/TestStepAttachments.tsx +++ b/src/components/results/TestStepAttachments.tsx @@ -1,4 +1,4 @@ -import { TestStepFinished } from '@cucumber/messages' +import { TestRunHookFinished, TestStepFinished } from '@cucumber/messages' import React from 'react' import { FC } from 'react' @@ -7,12 +7,12 @@ import { Attachment } from '../gherkin/index.js' import styles from './TestStepAttachments.module.scss' interface Props { - testStepFinished: TestStepFinished + testStepOrHookFinished: TestStepFinished | TestRunHookFinished } -export const TestStepAttachments: FC = ({ testStepFinished }) => { +export const TestStepAttachments: FC = ({ testStepOrHookFinished }) => { const { cucumberQuery } = useQueries() - const attachments = cucumberQuery.findAttachmentsBy(testStepFinished) + const attachments = cucumberQuery.findAttachmentsBy(testStepOrHookFinished) return (
      {attachments.map((attachment, index) => { diff --git a/src/components/results/TestStepOutcome.tsx b/src/components/results/TestStepOutcome.tsx index dfbf487e..b8b2c60e 100644 --- a/src/components/results/TestStepOutcome.tsx +++ b/src/components/results/TestStepOutcome.tsx @@ -33,7 +33,7 @@ export const TestStepOutcome: FC = ({ testStep, testStepFinished }) => {
      {testStep.pickleStepId && } - +
      ) From fbff8d0cb3b90d0c6c9a11811ce258f33a69b473 Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 22 Sep 2025 14:59:13 +0200 Subject: [PATCH 02/16] fmt --- src/components/app/TestRunHooks.stories.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/app/TestRunHooks.stories.tsx b/src/components/app/TestRunHooks.stories.tsx index 7d9a177c..454c4386 100644 --- a/src/components/app/TestRunHooks.stories.tsx +++ b/src/components/app/TestRunHooks.stories.tsx @@ -2,9 +2,9 @@ import * as messages from '@cucumber/messages' import { Story } from '@ladle/react' import React from 'react' +import globalHooksAfterAllError from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' import globalHooksAttachments from '../../../acceptance/global-hooks-attachments/global-hooks-attachments.js' import globalHooksBeforeAllError from '../../../acceptance/global-hooks-beforeall-error/global-hooks-beforeall-error.js' -import globalHooksAfterAllError from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' import { EnvelopesProvider, FilteredDocuments } from './index.js' import { TestRunHooks } from './TestRunHooks.js' @@ -38,4 +38,4 @@ GlobalHooksBeforeAllError.args = { export const GlobalHooksAfterAllError = Template.bind({}) GlobalHooksAfterAllError.args = { envelopes: globalHooksAfterAllError, -} \ No newline at end of file +} From 392f0b0679c3195ea32d0f9caa12f5cc7b0e52fb Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Sat, 27 Sep 2025 13:04:19 +0200 Subject: [PATCH 03/16] Display run hook names --- src/components/results/TestRunHookOutcome.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/results/TestRunHookOutcome.tsx b/src/components/results/TestRunHookOutcome.tsx index 664f571e..c64e203f 100644 --- a/src/components/results/TestRunHookOutcome.tsx +++ b/src/components/results/TestRunHookOutcome.tsx @@ -21,7 +21,7 @@ export const RunHookOutcome: FC = ({ hook, testRunHookFinished }) => {

      - {hook.type === HookType.BEFORE_TEST_RUN ? 'BeforeAll' : 'AfterAll'} + {hook.name ?? (hook.type === HookType.BEFORE_TEST_RUN ? 'BeforeAll' : 'AfterAll')}

      From a1b31fe2fd12d54c4539e99c0a57328cd070f16d Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 29 Sep 2025 18:33:39 +0200 Subject: [PATCH 04/16] Correct ladle title --- src/components/app/TestRunHooks.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/app/TestRunHooks.stories.tsx b/src/components/app/TestRunHooks.stories.tsx index 454c4386..eaa04aa1 100644 --- a/src/components/app/TestRunHooks.stories.tsx +++ b/src/components/app/TestRunHooks.stories.tsx @@ -22,7 +22,7 @@ const Template: Story = ({ envelopes }) => { } export default { - title: 'Gherkin/RunHooksList', + title: 'App/TestRunHooksList', } export const GlobalHooksWithAttachments = Template.bind({}) From ded0f8e60df661c27d693afc27b4ac5b9c4b0d96 Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 29 Sep 2025 18:34:32 +0200 Subject: [PATCH 05/16] Correct exported member's name --- src/components/app/TestRunHooks.tsx | 4 ++-- src/components/results/TestRunHookOutcome.tsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index 9055d704..d6f9c755 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -3,7 +3,7 @@ import React, { FC } from 'react' import { useQueries } from '../../hooks/useQueries.js' import { RunHooksList } from '../gherkin/TestRunHooksList.js' -import { RunHookOutcome } from '../results/TestRunHookOutcome.js' +import { TestRunHookOutcome } from '../results/TestRunHookOutcome.js' export const TestRunHooks: FC = () => { const { cucumberQuery } = useQueries() @@ -15,7 +15,7 @@ export const TestRunHooks: FC = () => { const testRunHook = cucumberQuery.findHookBy(testRunHookFinished) return ( - = ({ hook, testRunHookFinished }) => { +export const TestRunHookOutcome: FC = ({ hook, testRunHookFinished }) => { return (
    1. From c320c97b2609999564c2a9ded1ecd3bd4011bfdb Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 29 Sep 2025 16:40:31 +0200 Subject: [PATCH 06/16] Remove TestRunHooksList This served little to no purpose. --- .../TestRunHooks.module.scss} | 0 src/components/app/TestRunHooks.tsx | 6 +++--- src/components/gherkin/TestRunHooksList.tsx | 11 ----------- 3 files changed, 3 insertions(+), 14 deletions(-) rename src/components/{gherkin/TestRunHooksList.module.scss => app/TestRunHooks.module.scss} (100%) delete mode 100644 src/components/gherkin/TestRunHooksList.tsx diff --git a/src/components/gherkin/TestRunHooksList.module.scss b/src/components/app/TestRunHooks.module.scss similarity index 100% rename from src/components/gherkin/TestRunHooksList.module.scss rename to src/components/app/TestRunHooks.module.scss diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index d6f9c755..341a1125 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -2,15 +2,15 @@ import { TestRunHookFinished } from '@cucumber/messages' import React, { FC } from 'react' import { useQueries } from '../../hooks/useQueries.js' -import { RunHooksList } from '../gherkin/TestRunHooksList.js' import { TestRunHookOutcome } from '../results/TestRunHookOutcome.js' +import styles from './TestRunHooks.module.scss' export const TestRunHooks: FC = () => { const { cucumberQuery } = useQueries() const testRunHooksFinished: ReadonlyArray = cucumberQuery.findAllTestRunHookFinished() return ( - +
        {testRunHooksFinished.map((testRunHookFinished) => { const testRunHook = cucumberQuery.findHookBy(testRunHookFinished) @@ -24,6 +24,6 @@ export const TestRunHooks: FC = () => { /> ) })} - +
      ) } diff --git a/src/components/gherkin/TestRunHooksList.tsx b/src/components/gherkin/TestRunHooksList.tsx deleted file mode 100644 index 722b425f..00000000 --- a/src/components/gherkin/TestRunHooksList.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React, { FunctionComponent, ReactNode } from 'react' - -import styles from './TestRunHooksList.module.scss' - -export const RunHooksList: FunctionComponent<{ children: ReactNode }> = ({ children }) => { - return ( -
        - {children} -
      - ) -} From 384d8177edaae9fa4835805d69f0827552d622ac Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Mon, 29 Sep 2025 16:43:08 +0200 Subject: [PATCH 07/16] Remove TestRunHooks margin Leave this to the consumer. --- src/components/app/TestRunHooks.module.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/app/TestRunHooks.module.scss b/src/components/app/TestRunHooks.module.scss index 64d24877..32fdd134 100644 --- a/src/components/app/TestRunHooks.module.scss +++ b/src/components/app/TestRunHooks.module.scss @@ -1,6 +1,5 @@ .hooks { padding: 0; - margin: 0.875em 1em; list-style: none; > li { From ba0834cca285620e9bdfffe757b7a5d8400e53b7 Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Sun, 19 Oct 2025 12:15:19 +0200 Subject: [PATCH 08/16] Extract hook logic to useTestRunHooks This may be used by consumers of to eg. conditionally render a heading. --- src/components/app/TestRunHooks.tsx | 17 ++++++----------- src/hooks/helpers.ts | 6 ++++++ src/hooks/useTestRunHooks.ts | 24 ++++++++++++++++++++++++ 3 files changed, 36 insertions(+), 11 deletions(-) create mode 100644 src/hooks/helpers.ts create mode 100644 src/hooks/useTestRunHooks.ts diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index 341a1125..e8db6c98 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -1,25 +1,20 @@ -import { TestRunHookFinished } from '@cucumber/messages' import React, { FC } from 'react' -import { useQueries } from '../../hooks/useQueries.js' +import { useTestRunHooks } from '../../hooks/useTestRunHooks.js' import { TestRunHookOutcome } from '../results/TestRunHookOutcome.js' import styles from './TestRunHooks.module.scss' export const TestRunHooks: FC = () => { - const { cucumberQuery } = useQueries() - const testRunHooksFinished: ReadonlyArray = - cucumberQuery.findAllTestRunHookFinished() + const hooks = useTestRunHooks() + return (
        - {testRunHooksFinished.map((testRunHookFinished) => { - const testRunHook = cucumberQuery.findHookBy(testRunHookFinished) - + {hooks.map(({ testRunHookFinished, hook }) => { return ( ) diff --git a/src/hooks/helpers.ts b/src/hooks/helpers.ts new file mode 100644 index 00000000..721b9149 --- /dev/null +++ b/src/hooks/helpers.ts @@ -0,0 +1,6 @@ +export function ensure(value: T | undefined, message: string): T { + if (!value) { + throw new Error(message) + } + return value +} diff --git a/src/hooks/useTestRunHooks.ts b/src/hooks/useTestRunHooks.ts new file mode 100644 index 00000000..4b8a298b --- /dev/null +++ b/src/hooks/useTestRunHooks.ts @@ -0,0 +1,24 @@ +import { Hook, TestRunHookFinished } from '@cucumber/messages' + +import { ensure } from './helpers.js' +import { useQueries } from './useQueries.js' + +type RunHooksList = { testRunHookFinished: TestRunHookFinished; hook: Hook }[] + +export function useTestRunHooks(): RunHooksList { + const { cucumberQuery } = useQueries() + const testRunHooksFinished: ReadonlyArray = + cucumberQuery.findAllTestRunHookFinished() + + return testRunHooksFinished.map((testRunHookFinished) => { + const hook = ensure( + cucumberQuery.findHookBy(testRunHookFinished), + 'Expected testRunHookFinished to resolve with a hook' + ) + + return { + testRunHookFinished, + hook, + } + }) +} From 0a15e6aeea6cf78f9cefe4d0f820058fe0044e61 Mon Sep 17 00:00:00 2001 From: Jonas Amundsen Date: Wed, 5 Nov 2025 14:31:16 +0100 Subject: [PATCH 09/16] Render "No hooks found" upon finding no hooks --- src/components/app/TestRunHooks.module.scss | 4 ++++ src/components/app/TestRunHooks.stories.tsx | 7 +++++++ src/components/app/TestRunHooks.tsx | 4 ++++ 3 files changed, 15 insertions(+) diff --git a/src/components/app/TestRunHooks.module.scss b/src/components/app/TestRunHooks.module.scss index 32fdd134..bc9d5b1c 100644 --- a/src/components/app/TestRunHooks.module.scss +++ b/src/components/app/TestRunHooks.module.scss @@ -1,3 +1,7 @@ +.empty { + font-style: italic; +} + .hooks { padding: 0; list-style: none; diff --git a/src/components/app/TestRunHooks.stories.tsx b/src/components/app/TestRunHooks.stories.tsx index eaa04aa1..6c3c4fe4 100644 --- a/src/components/app/TestRunHooks.stories.tsx +++ b/src/components/app/TestRunHooks.stories.tsx @@ -2,6 +2,7 @@ import * as messages from '@cucumber/messages' import { Story } from '@ladle/react' import React from 'react' +import empty from '../../../acceptance/empty/empty.js' import globalHooksAfterAllError from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' import globalHooksAttachments from '../../../acceptance/global-hooks-attachments/global-hooks-attachments.js' import globalHooksBeforeAllError from '../../../acceptance/global-hooks-beforeall-error/global-hooks-beforeall-error.js' @@ -16,6 +17,7 @@ const Template: Story = ({ envelopes }) => { return ( +

        BeforeAll/AfterAll

        ) @@ -25,6 +27,11 @@ export default { title: 'App/TestRunHooksList', } +export const EmptyGlobalHooks = Template.bind({}) +EmptyGlobalHooks.args = { + envelopes: empty, +} + export const GlobalHooksWithAttachments = Template.bind({}) GlobalHooksWithAttachments.args = { envelopes: globalHooksAttachments, diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index e8db6c98..e1579f7f 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -7,6 +7,10 @@ import styles from './TestRunHooks.module.scss' export const TestRunHooks: FC = () => { const hooks = useTestRunHooks() + if (hooks.length === 0) { + return

        No hooks found.

        + } + return (
          {hooks.map(({ testRunHookFinished, hook }) => { From ca534aa48f073a2c5ce0ffa4d0fd8511dd0220a5 Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 12:39:29 +0000 Subject: [PATCH 10/16] remove unnecessary ! --- src/components/app/TestRunHooks.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index e1579f7f..1c42bb14 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -17,8 +17,7 @@ export const TestRunHooks: FC = () => { return ( ) From b3b59bcffaa729c8002beb3f5c02562b8b95fa4f Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 12:39:42 +0000 Subject: [PATCH 11/16] remove aria-label --- src/components/app/TestRunHooks.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index 1c42bb14..acf2d1df 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -12,7 +12,7 @@ export const TestRunHooks: FC = () => { } return ( -
            +
              {hooks.map(({ testRunHookFinished, hook }) => { return ( Date: Mon, 10 Nov 2025 12:40:07 +0000 Subject: [PATCH 12/16] tweak empty wording --- src/components/app/TestRunHooks.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index acf2d1df..2067ca71 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -8,7 +8,7 @@ export const TestRunHooks: FC = () => { const hooks = useTestRunHooks() if (hooks.length === 0) { - return

              No hooks found.

              + return

              No test run hooks were executed.

              } return ( From dacf538cf40020972538ed7587ea420a87f649ce Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 13:49:31 +0000 Subject: [PATCH 13/16] tweak TestRunHooks stories --- src/components/app/TestRunHooks.stories.tsx | 48 +++++++++++---------- 1 file changed, 26 insertions(+), 22 deletions(-) diff --git a/src/components/app/TestRunHooks.stories.tsx b/src/components/app/TestRunHooks.stories.tsx index 6c3c4fe4..ad6e478b 100644 --- a/src/components/app/TestRunHooks.stories.tsx +++ b/src/components/app/TestRunHooks.stories.tsx @@ -1,48 +1,52 @@ -import * as messages from '@cucumber/messages' +import { Envelope } from '@cucumber/messages' import { Story } from '@ladle/react' import React from 'react' -import empty from '../../../acceptance/empty/empty.js' -import globalHooksAfterAllError from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' -import globalHooksAttachments from '../../../acceptance/global-hooks-attachments/global-hooks-attachments.js' -import globalHooksBeforeAllError from '../../../acceptance/global-hooks-beforeall-error/global-hooks-beforeall-error.js' -import { EnvelopesProvider, FilteredDocuments } from './index.js' +import emptySample from '../../../acceptance/empty/empty.js' +import globalHooksSample from '../../../acceptance/global-hooks/global-hooks.js' +import globalHooksAfterAllErrorSample from '../../../acceptance/global-hooks-afterall-error/global-hooks-afterall-error.js' +import globalHooksAttachmentsSample from '../../../acceptance/global-hooks-attachments/global-hooks-attachments.js' +import globalHooksBeforeAllErrorSample from '../../../acceptance/global-hooks-beforeall-error/global-hooks-beforeall-error.js' +import { EnvelopesProvider } from './index.js' import { TestRunHooks } from './TestRunHooks.js' type TemplateArgs = { - envelopes: readonly messages.Envelope[] + envelopes: readonly Envelope[] } const Template: Story = ({ envelopes }) => { return ( - -

              BeforeAll/AfterAll

              ) } export default { - title: 'App/TestRunHooksList', + title: 'App/TestRunHooks', } -export const EmptyGlobalHooks = Template.bind({}) -EmptyGlobalHooks.args = { - envelopes: empty, +export const Empty = Template.bind({}) +Empty.args = { + envelopes: emptySample, } -export const GlobalHooksWithAttachments = Template.bind({}) -GlobalHooksWithAttachments.args = { - envelopes: globalHooksAttachments, +export const Default = Template.bind({}) +Default.args = { + envelopes: globalHooksSample, } -export const GlobalHooksBeforeAllError = Template.bind({}) -GlobalHooksBeforeAllError.args = { - envelopes: globalHooksBeforeAllError, +export const WithAttachments = Template.bind({}) +WithAttachments.args = { + envelopes: globalHooksAttachmentsSample, } -export const GlobalHooksAfterAllError = Template.bind({}) -GlobalHooksAfterAllError.args = { - envelopes: globalHooksAfterAllError, +export const BeforeAllError = Template.bind({}) +BeforeAllError.args = { + envelopes: globalHooksBeforeAllErrorSample, +} + +export const AfterAllError = Template.bind({}) +AfterAllError.args = { + envelopes: globalHooksAfterAllErrorSample, } From f4ee854542b8edfa374680075569f6c85d0be1c0 Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 14:22:35 +0000 Subject: [PATCH 14/16] add to Report component --- src/components/app/Report.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/components/app/Report.tsx b/src/components/app/Report.tsx index f7f5d7d4..87141543 100644 --- a/src/components/app/Report.tsx +++ b/src/components/app/Report.tsx @@ -4,6 +4,7 @@ import { ExecutionSummary } from './ExecutionSummary.js' import { FilteredDocuments } from './FilteredDocuments.js' import styles from './Report.module.scss' import { SearchBar } from './SearchBar.js' +import { TestRunHooks } from './TestRunHooks.js' export const Report: FC = () => { return ( @@ -15,6 +16,9 @@ export const Report: FC = () => {
              +
              + +
              ) } From 8f825bc428bad99e6fdcddd1ce8c2494cbe313f1 Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 14:23:21 +0000 Subject: [PATCH 15/16] update CHANGELOG.md --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 131c82a4..11df3001 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/). - Include duration for each test step ([#396](https://github.com/cucumber/react-components/pull/396)) - Include pass rate in execution summary ([#397](https://github.com/cucumber/react-components/pull/397)) - Add new `` component ([#410](https://github.com/cucumber/react-components/pull/410)) +- Add new `` component and include in report ([#408](https://github.com/cucumber/react-components/pull/408)) ### Changed - Render a more test case-centric report ([#396](https://github.com/cucumber/react-components/pull/396)) From bea0e4b7cfa18be2ecb92b0f843767583759a804 Mon Sep 17 00:00:00 2001 From: David Goss Date: Mon, 10 Nov 2025 14:28:48 +0000 Subject: [PATCH 16/16] fix lint and formatting --- src/components/app/Report.tsx | 2 +- src/components/app/TestRunHooks.tsx | 6 +----- 2 files changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/app/Report.tsx b/src/components/app/Report.tsx index 87141543..7cf3efec 100644 --- a/src/components/app/Report.tsx +++ b/src/components/app/Report.tsx @@ -17,7 +17,7 @@ export const Report: FC = () => {
              - +
              ) diff --git a/src/components/app/TestRunHooks.tsx b/src/components/app/TestRunHooks.tsx index 2067ca71..65d0f002 100644 --- a/src/components/app/TestRunHooks.tsx +++ b/src/components/app/TestRunHooks.tsx @@ -15,11 +15,7 @@ export const TestRunHooks: FC = () => {
                {hooks.map(({ testRunHookFinished, hook }) => { return ( - + ) })}