From b3a2f64e1dcd326b6e8640a4d4926356d7682b7f Mon Sep 17 00:00:00 2001 From: SriHV Date: Tue, 3 Dec 2024 12:34:10 +0000 Subject: [PATCH] refactored tests for document list --- src/components/document-list/_macro.spec.js | 797 ++++++++---------- .../document-list/_test-examples.js | 74 ++ 2 files changed, 448 insertions(+), 423 deletions(-) create mode 100644 src/components/document-list/_test-examples.js diff --git a/src/components/document-list/_macro.spec.js b/src/components/document-list/_macro.spec.js index 1af96d5c57..1fade4323b 100644 --- a/src/components/document-list/_macro.spec.js +++ b/src/components/document-list/_macro.spec.js @@ -4,472 +4,423 @@ import * as cheerio from 'cheerio'; import axe from '../../tests/helpers/axe'; import { renderComponent } from '../../tests/helpers/rendering'; - -const EXAMPLE_DOCUMENT_LIST_BASIC = { - title: { - text: 'Crime and justice', - url: '#0', - }, - description: 'Some description', -}; - -const EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL = { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - thumbnail: { - smallSrc: '/example-small.png', - largeSrc: '/example-large.png', - }, -}; - -const EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE = { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - file: { - fileType: 'PDF', - fileSize: '499KB', - filePages: '1 page', - }, - }, -}; - -const EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT = { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - object: { - text: 'Poster', - url: '#0', - ref: 'some ref', - }, - }, -}; - -const EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE = { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - id: 'some-id', - thumbnail: { - smallSrc: '/example-small.png', - largeSrc: '/example-large.png', - }, - metadata: { - object: { - text: 'Poster', - url: '#0', - ref: 'some ref', - }, - file: { - fileType: 'PDF', - fileSize: '499KB', - filePages: '1 page', - }, - date: { - iso: '2022-01-01', - short: '1 January 2022', - showPrefix: true, - prefix: 'Released', - }, - }, -}; - -describe('macro: document list', () => { - describe('global configuration', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - id: 'some-id', - documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], - }), - ); - - const results = await axe($.html()); - expect(results).toHaveNoViolations(); - }); - - it('has the provided `id` attribute', () => { - const $ = cheerio.load( - renderComponent('document-list', { - id: 'some-id', - documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], - }), - ); - - expect($('#some-id').length).toBe(1); - }); - - it('has custom classes applied', () => { - const $ = cheerio.load( - renderComponent('document-list', { - classes: 'custom-class', - documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], - }), - ); - - expect($('.ons-document-list').hasClass('custom-class')).toBe(true); - }); - - it('outputs the correct number of document items', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], - }), - ); - - expect($('.ons-document-list__item').length).toBe(3); - }); - - it('has the correct container if `fullWidth`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true, fullWidth: true }], - }), - ); - - expect($('.ons-container').length).toBe(1); - }); - - it('has the correct container class if `fullWidth` and `wide`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true, fullWidth: true, wide: true }], - }), - ); - - expect($('.ons-container--wide').length).toBe(1); - }); - - it('has the correct container class if `featured`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true }], - }), - ); - - expect($('.ons-document-list__item--featured').length).toBe(1); - }); - - it('has the correct class for `showMetadataFirst`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, showMetadataFirst: true }], - }), - ); - - expect($('.ons-document-list__item-header--reverse').length).toBe(1); - }); - - it('overrides the heading title tag when `headingLevel` is provided', () => { - const $ = cheerio.load( - renderComponent('document-list', { - headingLevel: 1, - documents: [EXAMPLE_DOCUMENT_LIST_BASIC], - }), - ); - const headingLevel = $('.ons-document-list__item-title')[0].tagName; - expect(headingLevel).toBe('h1'); - }); - - it('has expected `title`', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_BASIC] })); - const title = $('.ons-document-list__item-title a').html().trim(); - expect(title).toBe('Crime and justice'); - }); - - it('has expected `url` for the title', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_BASIC] })); - expect($('.ons-document-list__item-title a').attr('href')).toBe('#0'); - }); - - it('has expected `description`', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_BASIC] })); - const title = $('.ons-document-list__item-description').html().trim(); - expect(title).toBe('Some description'); +import { + EXAMPLE_DOCUMENT_LIST_BASIC, + EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL, + EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE, + EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT, + EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE, + EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE, +} from './_test-examples'; + +describe('FOR: Macro: document list', () => { + describe('GIVEN: Params: basic', () => { + describe('WHEN: basic parameters are provided within a document', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('outputs the correct number of document items', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], + }), + ); + + expect($('.ons-document-list__item').length).toBe(3); + }); + test('has expected url for the title', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_BASIC] })); + expect($('.ons-document-list__item-title a').attr('href')).toBe('#0'); + }); + + test('has expected description', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_BASIC] })); + const title = $('.ons-document-list__item-description').html().trim(); + expect(title).toBe('Some description'); + }); }); }); - describe('mode: with thumbnail', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - id: 'some-id', - documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL], - }), - ); - - const results = await axe($.html()); - expect(results).toHaveNoViolations(); - }); - - it('has expected `srcset` attribute', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL] })); - - const srcset = $('.ons-document-list__image-link img').attr('srcset'); - expect(srcset).toBe('/example-small.png 1x, /example-large.png 2x'); - }); - - it('has expected `src` attribute', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL] })); - - const src = $('.ons-document-list__image-link img').attr('src'); - expect(src).toBe('/example-small.png'); - }); - - it('has the placeholder class if `thumbnail` is true', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, thumbnail: true }], - }), - ); - - expect($('.ons-document-list__image-link').hasClass('ons-document-list__image-link--placeholder')).toBe(true); + describe('GIVEN: Params: id', () => { + describe('WHEN: id is provied', () => { + test('has the provided `id` attribute', () => { + const $ = cheerio.load( + renderComponent('document-list', { + id: 'some-id', + documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], + }), + ); + expect($('#some-id').length).toBe(1); + }); }); }); - describe('mode: with metadata `file` configuration', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], - }), - ); - - const results = await axe($.html()); - expect(results).toHaveNoViolations(); - }); - - it('has visually hidden `file` information after the title', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], - }), - ); - - const hiddenText = $('.ons-document-list__item-title a .ons-u-vh').text().trim(); - expect(hiddenText).toBe(', PDF document download, 499KB, 1 page'); + describe('GIVEN: Params: custom-class', () => { + describe('WHEN: custom class is provided', () => { + test('applies the right custom classes', () => { + const $ = cheerio.load( + renderComponent('document-list', { + classes: 'custom-class', + documents: [EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC, EXAMPLE_DOCUMENT_LIST_BASIC], + }), + ); + expect($('.ons-document-list').hasClass('custom-class')).toBe(true); + }); }); + }); - it('has `file` information displayed', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], - }), - ); + describe('GIVEN: Params: featured', () => { + describe('WHEN: featured is set for a document', () => { + test('has the correct container class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true }], + }), + ); - const hiddenText = $('.ons-document-list__item-attribute').text().trim(); - expect(hiddenText).toBe('PDF, 499KB, 1 page'); + expect($('.ons-document-list__item--featured').length).toBe(1); + }); }); }); - describe('mode: with metadata `object` configuration', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT], - }), - ); + describe('GIVEN: Params: fullWidth', () => { + describe('WHEN: fullWidth is set for a document with basic parameters', () => { + test('does not apply container class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, fullWidth: true }], + }), + ); - const results = await axe($.html()); - expect(results).toHaveNoViolations(); + expect($('.ons-container').length).toBe(0); + }); }); - it('has the provided `url`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT], - }), - ); + describe('WHEN: fullWidth is set for a featured document', () => { + test('has the correct containers class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true, fullWidth: true }], + }), + ); - const url = $('.ons-document-list__attribute-link').attr('href'); - expect(url).toBe('#0'); + expect($('.ons-container').length).toBe(1); + }); }); + }); - it('has expected `text`', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT] })); - const text = $('.ons-document-list__attribute-link > span').text().trim(); - expect(text).toBe('Poster:'); + describe('GIVEN: Params: wide', () => { + describe('WHEN: wide is set for a document with basic parameters', () => { + test('does not apply container class ', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, wide: true }], + }), + ); + + expect($('.ons-container--wide').length).toBe(0); + }); + }); + describe('WHEN: wide is set for a featured document with fullWidth', () => { + test('has the correct container class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, featured: true, fullWidth: true, wide: true }], + }), + ); + + expect($('.ons-container--wide').length).toBe(1); + }); }); + }); - it('has expected `ref`', () => { - const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT] })); - const text = $('.ons-document-list__attribute-link + span').text().trim(); - expect(text).toBe('some ref'); + describe('GIVEN: Params: showMetadataFirst', () => { + describe('WHEN: showMetadataFirst is set for a document', () => { + test('has the correct class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, showMetadataFirst: true }], + }), + ); + expect($('.ons-document-list__item-header--reverse').length).toBe(1); + }); }); }); - describe('mode: with metadata `date` configuration', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - iso: '2022-01-01', - short: '1 January 2022', - }, - }, - }, - ], - }), - ); - - const results = await axe($.html()); - expect(results).toHaveNoViolations(); + describe('GIVEN: Params: headingLevel', () => { + describe('WHEN: headingLevel is provided', () => { + test('overrides the heading title tag', () => { + const $ = cheerio.load( + renderComponent('document-list', { + headingLevel: 1, + documents: [EXAMPLE_DOCUMENT_LIST_BASIC], + }), + ); + const headingLevel = $('.ons-document-list__item-title')[0].tagName; + expect(headingLevel).toBe('h1'); + }); }); + }); - it('has the default `prefix` text', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - iso: '2022-01-01', - short: '1 January 2022', - }, - }, - }, - ], - }), - ); - - const text = $('.ons-document-list__item-attribute > span').text().trim(); - expect(text).toBe('Published:'); + describe('GIVEN: Params: thumbnail', () => { + describe('WHEN: thumbnail is provided for a document', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + id: 'some-id', + documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('has expected srcset attribute', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL] })); + + const srcset = $('.ons-document-list__image-link img').attr('srcset'); + expect(srcset).toBe('/example-small.png 1x, /example-large.png 2x'); + }); + + test('has expected src attribute', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL] })); + + const src = $('.ons-document-list__image-link img').attr('src'); + expect(src).toBe('/example-small.png'); + }); + + test('has the right placeholder class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [{ ...EXAMPLE_DOCUMENT_LIST_BASIC, thumbnail: true }], + }), + ); + expect($('.ons-document-list__image-link').hasClass('ons-document-list__image-link--placeholder')).toBe(true); + }); }); + }); - it('has the visually hidden class for `prefix` text', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - iso: '2022-01-01', - short: '1 January 2022', - }, - }, - }, - ], - }), - ); - expect($('.ons-document-list__item-attribute > span').hasClass('ons-u-vh')).toBe(true); + describe('GIVEN: Params: file', () => { + describe('WHEN: file configuration is provided within a document metadata', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('has visually hidden file information after the title', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], + }), + ); + + const hiddenText = $('.ons-document-list__item-title a .ons-u-vh').text().trim(); + expect(hiddenText).toBe(', PDF document download, 499KB, 1 page'); + }); + + test('has file information displayed', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE], + }), + ); + + const hiddenText = $('.ons-document-list__item-attribute').text().trim(); + expect(hiddenText).toBe('PDF, 499KB, 1 page'); + }); }); + }); - it('has the provided `prefix` text', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - prefix: 'Released', - iso: '2022-01-01', - short: '1 January 2022', - }, - }, - }, - ], - }), - ); - - const text = $('.ons-document-list__item-attribute > span').text().trim(); - expect(text).toBe('Released:'); + describe('GIVEN: Params: object', () => { + describe('WHEN: object configuration is provided within a document metadata', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('has the provided url', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT], + }), + ); + + const url = $('.ons-document-list__attribute-link').attr('href'); + expect(url).toBe('#0'); + }); + + test('has expected text', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT] })); + const text = $('.ons-document-list__attribute-link > span').text().trim(); + expect(text).toBe('Poster:'); + }); + + test('has expected ref', () => { + const $ = cheerio.load(renderComponent('document-list', { documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT] })); + const text = $('.ons-document-list__attribute-link + span').text().trim(); + expect(text).toBe('some ref'); + }); }); + }); - it('has the correct class for `showPrefix`', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - showPrefix: true, - iso: '2022-01-01', - short: '1 January 2022', - }, - }, - }, - ], - }), - ); - - expect($('.ons-document-list__item-attribute > span').hasClass('ons-u-fw-b')).toBe(true); + describe('GIVEN: Params: date', () => { + describe('WHEN: date configuration is provided within a document metadata', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('has the default prefix text', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE], + }), + ); + + const text = $('.ons-document-list__item-attribute > span').text().trim(); + expect(text).toBe('Published:'); + }); + + test('has the visually hidden class for prefix text', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE], + }), + ); + expect($('.ons-document-list__item-attribute > span').hasClass('ons-u-vh')).toBe(true); + }); + + test('has the correct datetime attribute value', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE], + }), + ); + expect($('time').attr('datetime')).toBe('2022-01-01'); + }); + + test('has the correct time value', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE], + }), + ); + + const time = $('.ons-document-list__item-attribute time').text().trim(); + expect(time).toBe('1 January 2022'); + }); }); + }); - it('has the correct datetime attribute value', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - iso: '2022-01-01', - short: '1 January 2022', + describe('GIVEN: Params: prefix', () => { + describe('WHEN: prefix is provided in the date metadata configuration for a document', () => { + test('has the provided prefix text', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [ + { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + metadata: { + date: { + prefix: 'Released', + iso: '2022-01-01', + short: '1 January 2022', + }, }, }, - }, - ], - }), - ); - expect($('time').attr('datetime')).toBe('2022-01-01'); + ], + }), + ); + const text = $('.ons-document-list__item-attribute > span').text().trim(); + expect(text).toBe('Released:'); + }); }); + }); - it('has the correct `time` value', () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [ - { - ...EXAMPLE_DOCUMENT_LIST_BASIC, - metadata: { - date: { - iso: '2022-01-01', - short: '1 January 2022', + describe('GIVEN: Params: showprefix', () => { + describe('WHEN: showprefix is set in the date metadata configuration for a document', () => { + test('has the correct class', () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [ + { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + metadata: { + date: { + showPrefix: true, + iso: '2022-01-01', + short: '1 January 2022', + }, }, }, - }, - ], - }), - ); + ], + }), + ); - const time = $('.ons-document-list__item-attribute time').text().trim(); - expect(time).toBe('1 January 2022'); + expect($('.ons-document-list__item-attribute > span').hasClass('ons-u-fw-b')).toBe(true); + }); }); }); - describe('mode: with all parameters', () => { - it('passes jest-axe checks', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], - }), - ); - - const results = await axe($.html()); - expect(results).toHaveNoViolations(); - }); - - it('has the correct document thumbnail class', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], - }), - ); - - expect($('.ons-document-list__item-image').hasClass('ons-document-list__item-image--file')).toBe(true); - }); - - it('has the correct document list class', async () => { - const $ = cheerio.load( - renderComponent('document-list', { - documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], - }), - ); - - expect($('.ons-document-list__item-attribute').hasClass('ons-u-mr-no')).toBe(true); + describe('GIVEN: Params: multiple', () => { + describe('WHEN: when multiple configurations are provided in the document metadata', () => { + test('passes jest-axe checks', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], + }), + ); + + const results = await axe($.html()); + expect(results).toHaveNoViolations(); + }); + + test('has the correct document thumbnail class', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], + }), + ); + + expect($('.ons-document-list__item-image').hasClass('ons-document-list__item-image--file')).toBe(true); + }); + + test('has the correct document list class', async () => { + const $ = cheerio.load( + renderComponent('document-list', { + documents: [EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE], + }), + ); + + expect($('.ons-document-list__item-attribute').hasClass('ons-u-mr-no')).toBe(true); + }); }); }); }); diff --git a/src/components/document-list/_test-examples.js b/src/components/document-list/_test-examples.js new file mode 100644 index 0000000000..b559d24731 --- /dev/null +++ b/src/components/document-list/_test-examples.js @@ -0,0 +1,74 @@ +export const EXAMPLE_DOCUMENT_LIST_BASIC = { + title: { + text: 'Crime and justice', + url: '#0', + }, + description: 'Some description', +}; + +export const EXAMPLE_DOCUMENT_LIST_WITH_THUMBNAIL = { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + thumbnail: { + smallSrc: '/example-small.png', + largeSrc: '/example-large.png', + }, +}; + +export const EXAMPLE_DOCUMENT_LIST_WITH_METADATA_FILE = { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + metadata: { + file: { + fileType: 'PDF', + fileSize: '499KB', + filePages: '1 page', + }, + }, +}; + +export const EXAMPLE_DOCUMENT_LIST_WITH_METADATA_OBJECT = { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + metadata: { + object: { + text: 'Poster', + url: '#0', + ref: 'some ref', + }, + }, +}; + +export const EXAMPLE_DOCUMENT_LIST_WITH_METADATA_DATE = { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + metadata: { + date: { + iso: '2022-01-01', + short: '1 January 2022', + }, + }, +}; + +export const EXAMPLE_DOCUMENT_LIST_WITH_MULTIPLE = { + ...EXAMPLE_DOCUMENT_LIST_BASIC, + id: 'some-id', + thumbnail: { + smallSrc: '/example-small.png', + largeSrc: '/example-large.png', + }, + metadata: { + object: { + text: 'Poster', + url: '#0', + ref: 'some ref', + }, + file: { + fileType: 'PDF', + fileSize: '499KB', + filePages: '1 page', + }, + date: { + iso: '2022-01-01', + short: '1 January 2022', + showPrefix: true, + prefix: 'Released', + }, + }, +};