Skip to content

Commit

Permalink
Merge branch 'enhancement/46/testing-refactor-document-list' of https…
Browse files Browse the repository at this point in the history 
…://github.com/ONSdigital/design-system into enhancement/46/testing-refactor-document-list
  • Loading branch information
@SriHV
SriHV committed Jan 14, 2025
2 parents 3af139f + 79cf5bd commit 64548db
Show file tree
Hide file tree
Showing 12 changed files with 68 additions and 43 deletions.
4 changes: 2 additions & 2 deletions ...nents_description-list_example-inline-description-list_0_document_0_desktop.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions ...onents_description-list_example-inline-description-list_0_document_1_tablet.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions ...onents_description-list_example-inline-description-list_0_document_2_mobile.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/components/description-list/_macro-options.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,4 @@
| ----------- | ------ | -------- | ----------------------------------------------------- |
| id | string | false | The HTML `id` for the description of the related term |
| description | string | true | The value of the description of the related term |
| url | string | false | The url of the description of the related term |
8 changes: 7 additions & 1 deletion src/components/description-list/_macro.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,13 @@
{% if descriptionItem.id %}id="{{ descriptionItem.id }}"{% endif %}
class="ons-description-list__value ons-grid__col ons-col-{{ params.descriptionCol }}@{{ 'xs@l' if params.variant == 'inline' else 'm' }}"
>
{{- descriptionItem.description -}}
{%- if descriptionItem.url -%}
<a class="ons-description-list__link" href="{{ descriptionItem.url }}">
{{- descriptionItem.description -}}
</a>
{%- else -%}
{{- descriptionItem.description -}}
{%- endif -%}
</dd>
{% endif %}
{% endfor %}
Expand Down
5 changes: 4 additions & 1 deletion src/components/description-list/_macro.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ const EXAMPLE_DESCRIPTION_LIST_FULL = {
{
id: 'description-3',
description: '49300005832',
url: '#',
},
],
},
Expand Down Expand Up @@ -142,7 +143,9 @@ describe('macro: description-list', () => {

expect($listElements[4].tagName).toBe('dd');
expect($($listElements[4]).attr('id')).toBe('description-3');
expect($($listElements[4]).text()).toBe('49300005832');
const $link = $($listElements[4]).find('a');
expect($link.attr('href')).toBe('#');
expect($link.text()).toBe('49300005832');
});

it.each([
Expand Down
3 changes: 2 additions & 1 deletion src/components/description-list/example-inline-description-list.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,8 @@
"description": "Jacky Turner"
},
{
"description": "Louise Goodland"
"description": "Louise Goodland",
'url': '#'
}
]
}
Expand Down
4 changes: 2 additions & 2 deletions src/components/document-list/_macro.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ describe('FOR: Macro: Document list', () => {
});

describe('GIVEN: Params: id', () => {
describe('WHEN: id is provied', () => {
describe('WHEN: id is provided', () => {
test('THEN: has the provided id attribute', () => {
const $ = cheerio.load(
renderComponent('document-list', {
Expand Down Expand Up @@ -418,7 +418,7 @@ describe('FOR: Macro: Document list', () => {
expect($('.ons-document-list__item-image').hasClass('ons-document-list__item-image--file')).toBe(true);
});

test('THEN: has the correct document list class', async () => {
test('THEN: the document list object item has the utility class that removes the margin between the object and file list items', async () => {
expect($('.ons-document-list__item-attribute').hasClass('ons-u-mr-no')).toBe(true);
});
});
Expand Down
34 changes: 17 additions & 17 deletions src/components/mutually-exclusive/_macro-options.md
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
| Name | Type | Required | Description |
| -------------------------------- | ------------------------------------ | -------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| id | string | false | The HTML `id` of the fieldset |
| classes | string | false | Classes to apply to the fieldset |
| legend | string | true (unless `legendIsQuestionTitle` is set) | Text for the fieldset’s legend |
| legendClasses | string | false | Classes to apply to the legend element |
| legendIsQuestionTitle | boolean | true (unless `legend` is set) | Creates an `h1` inside the `legend`. Use when there is only a single fieldset on the page |
| description | string | false | Description for the fieldset |
| attributes | object | false | HTML attributes (for example, data attributes) to add to the fieldset |
| exclusiveOptions | `Array<Checkbox>` or `Array<radio>` | true | Configuration for the mutually exclusive options |
| or | string | false | Text for the “Or” label that separates the mutually exclusive checkbox from the answer options, defaults to "Or". |
| deselectMessage | string | true | The text the aria-live alert will announce to warn that selecting the exclusive checkbox will clear or unselect all other answer options. For example, ”Selecting this will uncheck all other checkboxes”. |
| deselectGroupAdjective | string | true | The text the aria-live alert will announce when an answer option is cleared or unselected when the mutually exclusive checkbox is selected |
| deselectExclusiveOptionAdjective | string | true | The text the aria-live alert will announce when an option is cleared or unselected when the mutually exclusive checkbox is selected |
| error | `Error` [_(ref)_](/components/error) | false | Configuration for validation errors |
| dontWrap | boolean | false | Prevents fields,checkboxes,date input,duration,input and Textarea from being wrapped in a [fieldset component](/components/fieldset) |
| autosuggestresults | string | false | Shows suggested options to users as they enter something into an input field |
| Name | Type | Required | Description |
| -------------------------------- | ------------------------------------ | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| id | string | false | The HTML `id` of the fieldset |
| classes | string | false | Classes to apply to the fieldset |
| legend | string | true | Text for the fieldset’s legend |
| legendClasses | string | false | Classes to apply to the legend element |
| legendIsQuestionTitle | boolean | false | When set to true, the text provided within the `legend` is rendered as an `<h1>` tag. Use when there is only a single fieldset on the page |
| description | string | false | Description for the fieldset |
| attributes | object | false | HTML attributes (for example, data attributes) to add to the fieldset |
| exclusiveOptions | `Array<Checkbox>` or `Array<radio>` | true | Configuration for the mutually exclusive options |
| or | string | false | Text for the “Or” label that separates the mutually exclusive checkbox from the answer options, defaults to "Or". |
| deselectMessage | string | true | The text the aria-live alert will announce to warn that selecting the exclusive checkbox will clear or unselect all other answer options. For example, ”Selecting this will uncheck all other checkboxes”. |
| deselectGroupAdjective | string | true | The text the aria-live alert will announce when an answer option is cleared or unselected when the mutually exclusive checkbox is selected |
| deselectExclusiveOptionAdjective | string | true | The text the aria-live alert will announce when an option is cleared or unselected when the mutually exclusive checkbox is selected |
| error | `Error` [_(ref)_](/components/error) | false | Configuration for validation errors |
| dontWrap | boolean | false | Prevents fields,checkboxes,date input,duration,input and Textarea from being wrapped in a [fieldset component](/components/fieldset) |
| autosuggestresults | string | false | Shows suggested options to users as they enter something into an input field |
Loading

0 comments on commit 64548db

Please sign in to comment.