From 3c65314644055f0160040953f40d3a61a6efac16 Mon Sep 17 00:00:00 2001 From: David Goss Date: Tue, 11 Nov 2025 10:16:26 +0000 Subject: [PATCH 1/5] add headings in report --- src/components/app/Report.module.scss | 5 +++++ src/components/app/Report.tsx | 2 ++ 2 files changed, 7 insertions(+) diff --git a/src/components/app/Report.module.scss b/src/components/app/Report.module.scss index d414738c..604d9a48 100644 --- a/src/components/app/Report.module.scss +++ b/src/components/app/Report.module.scss @@ -3,3 +3,8 @@ margin-bottom: 1.5em; } } + +.heading { + font-size: 1.25em; + margin: 1em 0; +} \ No newline at end of file diff --git a/src/components/app/Report.tsx b/src/components/app/Report.tsx index 7cf3efec..2468e797 100644 --- a/src/components/app/Report.tsx +++ b/src/components/app/Report.tsx @@ -14,9 +14,11 @@ export const Report: FC = () => {
+

Scenarios

+

Hooks

From ab4d150ab2fa95d2b15eac84532025982c12d091 Mon Sep 17 00:00:00 2001 From: David Goss Date: Tue, 11 Nov 2025 10:29:34 +0000 Subject: [PATCH 2/5] make empty messaging consistent --- src/components/app/FilteredDocuments.module.scss | 3 +++ src/components/app/FilteredDocuments.tsx | 4 ++-- 2 files changed, 5 insertions(+), 2 deletions(-) create mode 100644 src/components/app/FilteredDocuments.module.scss diff --git a/src/components/app/FilteredDocuments.module.scss b/src/components/app/FilteredDocuments.module.scss new file mode 100644 index 00000000..01610acf --- /dev/null +++ b/src/components/app/FilteredDocuments.module.scss @@ -0,0 +1,3 @@ +.empty { + font-style: italic; +} \ No newline at end of file diff --git a/src/components/app/FilteredDocuments.tsx b/src/components/app/FilteredDocuments.tsx index f26ee49b..5a781b67 100644 --- a/src/components/app/FilteredDocuments.tsx +++ b/src/components/app/FilteredDocuments.tsx @@ -1,8 +1,8 @@ import React, { FC } from 'react' import { useFilteredDocuments } from '../../hooks/useFilteredDocuments.js' +import styles from './FilteredDocuments.module.scss' import { GherkinDocumentList } from './GherkinDocumentList.js' -import { NoMatchResult } from './NoMatchResult.js' export const FilteredDocuments: FC = () => { const filtered = useFilteredDocuments() @@ -10,7 +10,7 @@ export const FilteredDocuments: FC = () => { if (!filtered) { return null } else if (!filtered.length) { - return + return

No scenarios were executed that match your query and/or filters.

} return } From e08f1b6d430013ef44cb6f026b27f6087f6c9b5f Mon Sep 17 00:00:00 2001 From: David Goss Date: Tue, 11 Nov 2025 10:30:28 +0000 Subject: [PATCH 3/5] remove defunct NoMatchResult component --- src/components/app/NoMatchResult.module.scss | 13 ------------- src/components/app/NoMatchResult.tsx | 14 -------------- src/components/app/index.ts | 1 - 3 files changed, 28 deletions(-) delete mode 100644 src/components/app/NoMatchResult.module.scss delete mode 100644 src/components/app/NoMatchResult.tsx diff --git a/src/components/app/NoMatchResult.module.scss b/src/components/app/NoMatchResult.module.scss deleted file mode 100644 index 6b0044b9..00000000 --- a/src/components/app/NoMatchResult.module.scss +++ /dev/null @@ -1,13 +0,0 @@ -.message { - display: flex; - flex-direction: column; - align-items: center; - gap: 0.5em; - padding-bottom: 1.5em; - text-align: center; -} - -.icon { - font-size: 3em; - opacity: 0.125; -} diff --git a/src/components/app/NoMatchResult.tsx b/src/components/app/NoMatchResult.tsx deleted file mode 100644 index 821dcd1a..00000000 --- a/src/components/app/NoMatchResult.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { faGrimace } from '@fortawesome/free-solid-svg-icons' -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' -import React, { FC } from 'react' - -import styles from './NoMatchResult.module.scss' - -export const NoMatchResult: FC = () => { - return ( -

-

- ) -} diff --git a/src/components/app/index.ts b/src/components/app/index.ts index f73e703d..890c590d 100644 --- a/src/components/app/index.ts +++ b/src/components/app/index.ts @@ -6,7 +6,6 @@ export * from './FilteredDocuments.js' export * from './GherkinDocumentList.js' export * from './HighLight.js' export * from './InMemorySearchProvider.js' -export * from './NoMatchResult.js' export * from './QueriesProvider.js' export * from './Report.js' export * from './SearchBar.js' From ffc8f5c27e8e64f3f93f54ae2324c91b6f9a9031 Mon Sep 17 00:00:00 2001 From: David Goss Date: Tue, 11 Nov 2025 10:38:45 +0000 Subject: [PATCH 4/5] different messages for nothing ran vs filtered out --- src/SearchContext.ts | 2 ++ src/components/app/ControlledSearchProvider.tsx | 2 ++ src/components/app/FilteredDocuments.module.scss | 2 +- src/components/app/FilteredDocuments.spec.tsx | 4 ++-- src/components/app/FilteredDocuments.tsx | 14 +++++++++----- src/components/app/Report.module.scss | 2 +- src/hooks/useFilteredDocuments.ts | 12 +++++++++--- 7 files changed, 26 insertions(+), 12 deletions(-) diff --git a/src/SearchContext.ts b/src/SearchContext.ts index 380dc042..4078a165 100644 --- a/src/SearchContext.ts +++ b/src/SearchContext.ts @@ -7,11 +7,13 @@ export interface SearchState { } export interface SearchContextValue extends SearchState { + unchanged: boolean update: (changes: Partial) => void } export default React.createContext({ query: '', hideStatuses: [], + unchanged: true, update: () => {}, }) diff --git a/src/components/app/ControlledSearchProvider.tsx b/src/components/app/ControlledSearchProvider.tsx index d52c353d..e0ee3b61 100644 --- a/src/components/app/ControlledSearchProvider.tsx +++ b/src/components/app/ControlledSearchProvider.tsx @@ -13,9 +13,11 @@ export const ControlledSearchProvider: FC> = ({ children, }) => { const contextValue: SearchContextValue = useMemo(() => { + const unchanged = !value.query && !value.hideStatuses.length return { query: value.query, hideStatuses: value.hideStatuses, + unchanged, update: (newValues: Partial) => { onChange({ ...value, ...newValues }) }, diff --git a/src/components/app/FilteredDocuments.module.scss b/src/components/app/FilteredDocuments.module.scss index 01610acf..e1d607c7 100644 --- a/src/components/app/FilteredDocuments.module.scss +++ b/src/components/app/FilteredDocuments.module.scss @@ -1,3 +1,3 @@ .empty { font-style: italic; -} \ No newline at end of file +} diff --git a/src/components/app/FilteredDocuments.spec.tsx b/src/components/app/FilteredDocuments.spec.tsx index 14599a41..bccfb389 100644 --- a/src/components/app/FilteredDocuments.spec.tsx +++ b/src/components/app/FilteredDocuments.spec.tsx @@ -74,7 +74,7 @@ describe('FilteredDocuments', () => { ) await waitFor(() => { - expect(getByText('No matches found for your query and/or filters')).to.be.visible + expect(getByText('No scenarios match your query and/or filters.')).to.be.visible }) }) @@ -119,7 +119,7 @@ describe('FilteredDocuments', () => { name: 'samples/examples-tables/examples-tables.feature', }) ).not.to.exist - expect(getByText('No matches found for your query and/or filters')).to.be.visible + expect(getByText('No scenarios match your query and/or filters.')).to.be.visible }) }) }) diff --git a/src/components/app/FilteredDocuments.tsx b/src/components/app/FilteredDocuments.tsx index 5a781b67..3cd787d9 100644 --- a/src/components/app/FilteredDocuments.tsx +++ b/src/components/app/FilteredDocuments.tsx @@ -5,12 +5,16 @@ import styles from './FilteredDocuments.module.scss' import { GherkinDocumentList } from './GherkinDocumentList.js' export const FilteredDocuments: FC = () => { - const filtered = useFilteredDocuments() + const { results, filtered } = useFilteredDocuments() - if (!filtered) { + if (!results) { return null - } else if (!filtered.length) { - return

No scenarios were executed that match your query and/or filters.

+ } else if (!results.length) { + return filtered ? ( +

No scenarios match your query and/or filters.

+ ) : ( +

No scenarios were executed.

+ ) } - return + return } diff --git a/src/components/app/Report.module.scss b/src/components/app/Report.module.scss index 604d9a48..b8d3c8f4 100644 --- a/src/components/app/Report.module.scss +++ b/src/components/app/Report.module.scss @@ -7,4 +7,4 @@ .heading { font-size: 1.25em; margin: 1em 0; -} \ No newline at end of file +} diff --git a/src/hooks/useFilteredDocuments.ts b/src/hooks/useFilteredDocuments.ts index 9240e2f3..fcceadb2 100644 --- a/src/hooks/useFilteredDocuments.ts +++ b/src/hooks/useFilteredDocuments.ts @@ -7,8 +7,11 @@ import statuses from '../statuses.js' import { useQueries } from './useQueries.js' import { useSearch } from './useSearch.js' -export function useFilteredDocuments(): GherkinDocument[] | undefined { - const { query, hideStatuses } = useSearch() +export function useFilteredDocuments(): { + results: GherkinDocument[] | undefined + filtered: boolean +} { + const { query, hideStatuses, unchanged } = useSearch() const { gherkinQuery, cucumberQuery } = useQueries() const [searchable, setSearchable] = useState() const [results, setResults] = useState() @@ -36,5 +39,8 @@ export function useFilteredDocuments(): GherkinDocument[] | undefined { } ) }, [query, hideStatuses, gherkinQuery, cucumberQuery, searchable]) - return results + return { + results, + filtered: !unchanged, + } } From 28dec562916f2d1bf0257d0ab94be3cf5fc71a9f Mon Sep 17 00:00:00 2001 From: David Goss Date: Tue, 11 Nov 2025 10:45:41 +0000 Subject: [PATCH 5/5] update CHANGELOG.md --- CHANGELOG.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 11df3001..3e43d40c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,7 +9,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/). ### Added - 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 ([#410](https://github.com/cucumber/react-components/pull/410)) ([#411](https://github.com/cucumber/react-components/pull/411)) - Add new `` component and include in report ([#408](https://github.com/cucumber/react-components/pull/408)) ### Changed @@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/). ### Removed - BREAKING CHANGE: Remove defunct scenario/step components ``, ``, ``, ``, ``, `` and their corresponding `CustomRenderingSupport` properties ([#396](https://github.com/cucumber/react-components/pull/396)) +- BREAKING CHANGE: Remove defunct `` component ([#411](https://github.com/cucumber/react-components/pull/411)) - BREAKING CHANGE: Remove defunct `` component and underlying context ([#396](https://github.com/cucumber/react-components/pull/396)) - BREAKING CHANGE: Remove `` component in favour of using standard Gherkin components for Markdown documents ([#396](https://github.com/cucumber/react-components/pull/396))