Skip to content

fix DF-73: correct section titles and summary list ordering in SummaryView… #282

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mokhld merged 1 commit into from
Dec 18, 2025
Merged

fix DF-73: correct section titles and summary list ordering in SummaryView… #282

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 45 additions & 37 deletions src/server/plugins/engine/models/SummaryViewModel.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,13 +140,13 @@ describe('SummaryViewModel', () => {
it('should add title for each section', () => {
const [checkAnswers1, checkAnswers2] = summaryViewModel.checkAnswers

// 1st summary list has no title
expect(checkAnswers1).toHaveProperty('title', undefined)

// 2nd summary list has section title
expect(checkAnswers2).toHaveProperty('title', {
// 1st summary list has section title
expect(checkAnswers1).toHaveProperty('title', {
text: 'Food'
})

// 2nd summary list has no title (unsectioned questions at bottom)
expect(checkAnswers2).toHaveProperty('title', undefined)
})

it('should add summary list for each section', () => {
Expand All @@ -157,44 +157,46 @@ describe('SummaryViewModel', () => {
const { summaryList: summaryList1 } = checkAnswers1
const { summaryList: summaryList2 } = checkAnswers2

// 1st summary list contains sectioned questions (Food section)
expect(summaryList1).toHaveProperty('rows', [
{
key: {
text: keys[2]
text: keys[1]
},
value: {
classes: 'app-prose-scope',
html: values[0]
html: values[1]
},
actions: {
items: [
{
classes: 'govuk-link--no-visited-state',
href: `${basePath}/delivery-or-collection?returnUrl=${encodeURIComponent(`${basePath}/summary`)}`,
href: `${basePath}/pizza-order/summary?returnUrl=${encodeURIComponent(`${basePath}/summary`)}`,
text: 'Change',
visuallyHiddenText: keys[0]
visuallyHiddenText: 'Pizza'
}
]
}
}
])

// 2nd summary list contains unsectioned questions (at bottom)
expect(summaryList2).toHaveProperty('rows', [
{
key: {
text: keys[1]
text: keys[2]
},
value: {
classes: 'app-prose-scope',
html: values[1]
html: values[0]
},
actions: {
items: [
{
classes: 'govuk-link--no-visited-state',
href: `${basePath}/pizza-order/summary?returnUrl=${encodeURIComponent(`${basePath}/summary`)}`,
href: `${basePath}/delivery-or-collection?returnUrl=${encodeURIComponent(`${basePath}/summary`)}`,
text: 'Change',
visuallyHiddenText: 'Pizza'
visuallyHiddenText: keys[0]
}
]
}
Expand All @@ -214,29 +216,31 @@ describe('SummaryViewModel', () => {
const { summaryList: summaryList1 } = checkAnswers1
const { summaryList: summaryList2 } = checkAnswers2

// 1st summary list contains sectioned questions (Food section)
expect(summaryList1).toHaveProperty('rows', [
{
key: {
text: keys[2]
text: keys[1]
},
value: {
classes: 'app-prose-scope',
html: values[0]
html: values[1]
},
actions: {
items: []
}
}
])

// 2nd summary list contains unsectioned questions (at bottom)
expect(summaryList2).toHaveProperty('rows', [
{
key: {
text: keys[1]
text: keys[2]
},
value: {
classes: 'app-prose-scope',
html: values[1]
html: values[0]
},
actions: {
items: []
Expand All @@ -254,32 +258,34 @@ describe('SummaryViewModel', () => {

const [details1, details2] = summaryViewModel.details

// 1st details contains sectioned questions (Food section)
expect(details1.items[0]).toMatchObject({
name: names[0],
value: answers[0],
title: keys[2],
label: keys[0]
})

expect(details2.items[0]).toMatchObject({
name: names[1],
value: answers[1],
title: keys[1],
label: keys[4]
})

// 2nd details contains unsectioned questions (at bottom)
expect(details2.items[0]).toMatchObject({
name: names[0],
value: answers[0],
title: keys[2],
label: keys[0]
})

const snapshot = [
{
name: names[0],
value: answers[0],
title: keys[2],
label: keys[0]
},
{
name: names[1],
value: answers[1],
title: keys[1],
label: keys[4]
},
{
name: names[0],
value: answers[0],
title: keys[2],
label: keys[0]
}
]

Expand Down Expand Up @@ -316,19 +322,21 @@ describe('SummaryViewModel', () => {

const [details1, details2] = summaryViewModel.details

// 1st details contains sectioned questions (Food section)
expect(details1.items[0]).toMatchObject({
name: 'orderType',
value: 'Collection',
title: 'How you would like to receive your pizza (optional)',
label: 'How would you like to receive your pizza?'
})

expect(details2.items[0]).toMatchObject({
name: 'pizza',
value: '',
title: 'Pizzas',
label: 'Pizza'
})

// 2nd details contains unsectioned questions (at bottom)
expect(details2.items[0]).toMatchObject({
name: 'orderType',
value: 'Collection',
title: 'How you would like to receive your pizza (optional)',
label: 'How would you like to receive your pizza?'
})
})
})

Expand Down
2 changes: 1 addition & 1 deletion src/server/plugins/engine/models/SummaryViewModel.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ export class SummaryViewModel {

const details: Detail[] = []

;[undefined, ...sections].forEach((section) => {
;[...sections, undefined].forEach((section) => {
const items: DetailItem[] = []

const sectionPages = relevantPages.filter(
Expand Down
34 changes: 17 additions & 17 deletions src/server/plugins/engine/models/__snapshots__/SummaryViewModel.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,51 +2,51 @@

exports[`SummaryViewModel Check answers (0 items) should use correct summary labels 1`] = `
[
{
"label": "How would you like to receive your pizza?",
"name": "orderType",
"title": "How you would like to receive your pizza",
"value": "Collection",
},
{
"label": "Pizza",
"name": "pizza",
"title": "Pizzas",
"value": "",
},
]
`;

exports[`SummaryViewModel Check answers (1 item) should use correct summary labels 1`] = `
[
{
"label": "How would you like to receive your pizza?",
"name": "orderType",
"title": "How you would like to receive your pizza",
"value": "Delivery",
"value": "Collection",
},
]
`;

exports[`SummaryViewModel Check answers (1 item) should use correct summary labels 1`] = `
[
{
"label": "Pizza",
"name": "pizza",
"title": "Pizza added",
"value": "You added 1 Pizza",
},
]
`;

exports[`SummaryViewModel Check answers (2 items) should use correct summary labels 1`] = `
[
{
"label": "How would you like to receive your pizza?",
"name": "orderType",
"title": "How you would like to receive your pizza",
"value": "Delivery",
},
]
`;

exports[`SummaryViewModel Check answers (2 items) should use correct summary labels 1`] = `
[
{
"label": "Pizza",
"name": "pizza",
"title": "Pizzas added",
"value": "You added 2 Pizzas",
},
{
"label": "How would you like to receive your pizza?",
"name": "orderType",
"title": "How you would like to receive your pizza",
"value": "Delivery",
},
]
`;
7 changes: 5 additions & 2 deletions src/server/plugins/engine/views/summary.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,12 @@ <h1 class="govuk-heading-l">
<h2 class="govuk-heading-m">
{{ section.title.text }}
</h2>
{{ govukSummaryList(section.summaryList) }}
{% else %}
<div class="{% if not loop.first %}govuk-!-margin-top-9 govuk-!-padding-top-4{% endif %}">
{{ govukSummaryList(section.summaryList) }}
</div>
{% endif %}

{{ govukSummaryList(section.summaryList) }}
{% endfor %}

<form method="post" novalidate>
Expand Down
Loading