From 83e02d78531f65378a22037e0c898ac830816e12 Mon Sep 17 00:00:00 2001 From: Precious Onyenaucheya Date: Tue, 3 Dec 2024 10:26:49 +0000 Subject: [PATCH] add test --- src/components/hero/_macro.njk | 4 +- src/components/hero/_macro.spec.js | 71 +++++++++++++++++++ src/components/hero/example-hero-analysis.njk | 2 + 3 files changed, 75 insertions(+), 2 deletions(-) diff --git a/src/components/hero/_macro.njk b/src/components/hero/_macro.njk index d15defdc74..d90b16804a 100644 --- a/src/components/hero/_macro.njk +++ b/src/components/hero/_macro.njk @@ -70,8 +70,8 @@ onsDescriptionList({ "classes": "ons-u-mb-no", "variant": 'inline', - "termCol": "4", - "descriptionCol": "8", + "termCol": params.descriptionList.termCol, + "descriptionCol": params.descriptionList.descriptionCol, "itemsList": params.descriptionList.itemsList }) }} diff --git a/src/components/hero/_macro.spec.js b/src/components/hero/_macro.spec.js index 9c9ad42be3..786d36f7a9 100644 --- a/src/components/hero/_macro.spec.js +++ b/src/components/hero/_macro.spec.js @@ -87,4 +87,75 @@ describe('macro: hero', () => { const content = $('.ons-hero__additional-content').text().trim(); expect(content).toEqual(expect.stringContaining('Example content...')); }); + + it('outputs the correct analysis text with `analysis` variant', () => { + const $ = cheerio.load(renderComponent('hero', { ...EXAMPLE_HERO, variants: 'analysis', analysisText: 'Analysis Text' })); + + const content = $('.ons-hero--analysis-text').text().trim(); + expect(content).toEqual(expect.stringContaining('Analysis Text')); + }); + + it('outputs the correct breadcrumbs', () => { + const $ = cheerio.load( + renderComponent('hero', { + ...EXAMPLE_HERO, + variants: 'analysis', + breadcrumbs: { + ariaLabel: 'Breadcrumbs', + itemsList: [ + { + url: '/breadcrumb-1', + text: 'Breadcrumbs 1', + }, + { + url: '/breadcrumb-2', + text: 'Breadcrumbs 2', + }, + ], + }, + }), + ); + + const breadcrumbs = $('.ons-breadcrumbs__item'); + console.log(breadcrumbs); + expect($(breadcrumbs).length).toBe(2); + expect($(breadcrumbs[0]).attr('href')).toBe('/breadcrumb-1'); + expect($(breadcrumbs[0]).text().trim()).toBe('BreadCrumbs 1:'); + expect($(breadcrumbs[1]).attr('href')).toBe('/breadcrumb-2'); + expect($(breadcrumbs[1]).text().trim()).toBe('BreadCrumbs 2:'); + }); + + it('outputs the correct description list with `termCol` and `descriptionCol`', () => { + const $ = cheerio.load( + renderComponent('hero', { + ...EXAMPLE_HERO, + variants: 'analysis', + descriptionList: { + termCol: '4', + descriptionCol: '8', + itemsList: [ + { + term: 'term1:', + descriptions: [ + { + description: 'description1', + }, + ], + }, + { + term: 'term2:', + descriptions: [ + { + description: 'description2', + }, + ], + }, + ], + }, + }), + ); + // console.log($.html()); + expect($('.ons-description-list__term')).hasClass('ons-col-4@xs').toBe(true); + expect($('.ons-description-list__value')).hasClass('ons-col-8@xs').toBe(true); + }); }); diff --git a/src/components/hero/example-hero-analysis.njk b/src/components/hero/example-hero-analysis.njk index 43f9fa6162..cbf5755439 100644 --- a/src/components/hero/example-hero-analysis.njk +++ b/src/components/hero/example-hero-analysis.njk @@ -27,6 +27,8 @@ ] }, "descriptionList": { + "termCol": "5", + "descriptionCol": "7", "itemsList": [ { "term": "Release date:",