From a40b27f682c5d7af833be1285c60b8cd3eb6486e Mon Sep 17 00:00:00 2001 From: nicola-d-bbc Date: Wed, 1 Dec 2021 12:37:37 +0000 Subject: [PATCH 1/3] refactor utility function, added tests and new unique id identifier --- .../__snapshots__/index.test.jsx.snap | 72 +++++++++---------- .../__snapshots__/index.test.jsx.snap | 48 ++++++------- .../StoryPromo/helpers/fixtureData.js | 23 ++++++ src/app/containers/StoryPromo/index.jsx | 16 +---- src/app/containers/StoryPromo/index.test.jsx | 13 +--- .../containers/StoryPromo/utilities/index.js | 10 +++ .../StoryPromo/utilities/index.test.js | 35 ++++++++- .../__snapshots__/index.test.jsx.snap | 4 +- 8 files changed, 135 insertions(+), 86 deletions(-) diff --git a/src/app/containers/FrontPageStoryRows/__snapshots__/index.test.jsx.snap b/src/app/containers/FrontPageStoryRows/__snapshots__/index.test.jsx.snap index 276629d2e4b..00163ba63e1 100644 --- a/src/app/containers/FrontPageStoryRows/__snapshots__/index.test.jsx.snap +++ b/src/app/containers/FrontPageStoryRows/__snapshots__/index.test.jsx.snap @@ -880,12 +880,12 @@ exports[`FrontPageStoryRows Container - snapshots LeadingRow - rtl 1`] = ` class="emotion-46 emotion-47" > سیربین ٹی وی پروگرام آن ڈیمانڈ @@ -1550,12 +1550,12 @@ exports[`FrontPageStoryRows Container - snapshots LeadingRow 1`] = ` class="emotion-7 emotion-8" > Take dis predictor choose who go reach World Cup final @@ -1663,12 +1663,12 @@ exports[`FrontPageStoryRows Container - snapshots LeadingRow 1`] = ` class="emotion-42 emotion-8" > Audio promo @@ -2481,12 +2481,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images - rtl 1 class="emotion-46 emotion-47" > سیربین ٹی وی پروگرام آن ڈیمانڈ @@ -2547,12 +2547,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images - rtl 1 class="emotion-46 emotion-47" > رمضان، عید اور سپیشل پکوان @@ -2613,12 +2613,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images - rtl 1 class="emotion-46 emotion-47" > کرکٹ ورلڈ کپ پر بی بی سی اردو کا خصوصی ضمیمہ @@ -3071,12 +3071,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images 1`] = ` class="emotion-15 emotion-16" > Take dis predictor choose who go reach World Cup final @@ -3159,12 +3159,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images 1`] = ` class="emotion-15 emotion-16" > Audio promo @@ -3225,12 +3225,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images 1`] = ` class="emotion-15 emotion-16" > World Cup 2018 Quiz: You fit name all di players wey don score Super Eagles goal for World Cup? @@ -3286,12 +3286,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow with images 1`] = ` class="emotion-15 emotion-16" > Select your best ever African 11 players for World Cup @@ -4092,12 +4092,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images - rt class="emotion-38 emotion-39" > سیربین ٹی وی پروگرام آن ڈیمانڈ @@ -4128,12 +4128,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images - rt class="emotion-38 emotion-39" > رمضان، عید اور سپیشل پکوان @@ -4164,12 +4164,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images - rt class="emotion-38 emotion-39" > کرکٹ ورلڈ کپ پر بی بی سی اردو کا خصوصی ضمیمہ @@ -4583,12 +4583,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images 1`] class="emotion-7 emotion-8" > Take dis predictor choose who go reach World Cup final @@ -4645,12 +4645,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images 1`] class="emotion-7 emotion-8" > Audio promo @@ -4681,12 +4681,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images 1`] class="emotion-7 emotion-8" > World Cup 2018 Quiz: You fit name all di players wey don score Super Eagles goal for World Cup? @@ -4717,12 +4717,12 @@ exports[`FrontPageStoryRows Container - snapshots RegularRow without images 1`] class="emotion-7 emotion-8" > Select your best ever African 11 players for World Cup @@ -5551,12 +5551,12 @@ exports[`FrontPageStoryRows Container - snapshots TopRow 1`] = ` class="emotion-15 emotion-16" > Take dis predictor choose who go reach World Cup final diff --git a/src/app/containers/StoryPromo/__snapshots__/index.test.jsx.snap b/src/app/containers/StoryPromo/__snapshots__/index.test.jsx.snap index c8f26d7afdb..b33c407dcbd 100644 --- a/src/app/containers/StoryPromo/__snapshots__/index.test.jsx.snap +++ b/src/app/containers/StoryPromo/__snapshots__/index.test.jsx.snap @@ -3680,12 +3680,12 @@ exports[`StoryPromo Container should render featureLink correctly for amp 1`] = class="emotion-12 emotion-13" > Feature promo with summary @@ -3997,12 +3997,12 @@ exports[`StoryPromo Container should render featureLink correctly for canonical class="emotion-12 emotion-13" > Feature promo with summary @@ -4311,12 +4311,12 @@ exports[`StoryPromo Container should render featureLink promoType leading on amp class="emotion-4 emotion-5" > Feature promo with summary @@ -4657,12 +4657,12 @@ exports[`StoryPromo Container should render featureLink promoType top on amp 1`] class="emotion-12 emotion-13" > Feature promo with summary @@ -8616,12 +8616,12 @@ exports[`StoryPromo Container should render podcastLink correctly for amp 1`] = class="emotion-12 emotion-13" > Test indonesian podcast @@ -8895,12 +8895,12 @@ exports[`StoryPromo Container should render podcastLink correctly for canonical class="emotion-12 emotion-13" > Test indonesian podcast @@ -9179,12 +9179,12 @@ exports[`StoryPromo Container should render podcastLink promoType leading on amp class="emotion-4 emotion-5" > Test indonesian podcast @@ -9475,12 +9475,12 @@ exports[`StoryPromo Container should render podcastLink promoType top on amp 1`] class="emotion-12 emotion-13" > Test indonesian podcast @@ -11084,12 +11084,12 @@ exports[`StoryPromo Container should render standardLink correctly for amp 1`] = class="emotion-12 emotion-13" > Standard promo with summary @@ -11401,12 +11401,12 @@ exports[`StoryPromo Container should render standardLink correctly for canonical class="emotion-12 emotion-13" > Standard promo with summary @@ -11715,12 +11715,12 @@ exports[`StoryPromo Container should render standardLink promoType leading on am class="emotion-4 emotion-5" > Standard promo with summary @@ -12061,12 +12061,12 @@ exports[`StoryPromo Container should render standardLink promoType top on amp 1` class="emotion-12 emotion-13" > Standard promo with summary diff --git a/src/app/containers/StoryPromo/helpers/fixtureData.js b/src/app/containers/StoryPromo/helpers/fixtureData.js index e45147675d0..ae93550d8b4 100644 --- a/src/app/containers/StoryPromo/helpers/fixtureData.js +++ b/src/app/containers/StoryPromo/helpers/fixtureData.js @@ -343,3 +343,26 @@ export const mapWithoutMediaError = { timestamp: 1588517817000, type: 'cps', }; + +export const secondaryColumnNoURI = { + name: 'Test Radio Bul promo Live', + summary: 'Test Radio summary', + indexImage: { + id: '63711781', + subType: 'index', + href: 'http://b.files.bbci.co.uk/4917/test/_63711781_clinton.jpg', + path: '/cpsdevpb/4917/test/_63711781_clinton.jpg', + height: 371, + width: 660, + altText: 'Clinton', + caption: 'Clinton', + copyrightHolder: 'BBC', + type: 'image', + }, + uri: 'https://www.bbc.co.uk/news', + contentType: 'RadioBulletin', + assetTypeCode: 'PRO', + timestamp: 1571655919000, + isLive: true, + type: 'link', +}; diff --git a/src/app/containers/StoryPromo/index.jsx b/src/app/containers/StoryPromo/index.jsx index 5927e6ca682..46be841fe2e 100644 --- a/src/app/containers/StoryPromo/index.jsx +++ b/src/app/containers/StoryPromo/index.jsx @@ -24,7 +24,7 @@ import MediaIndicatorContainer from './MediaIndicator'; import IndexAlsosContainer from './IndexAlsos'; import loggerNode from '#lib/logger.node'; import { MEDIA_MISSING } from '#lib/logger.const'; -import { getHeadingTagOverride } from './utilities'; +import { getHeadingTagOverride, getUniqueLinkId } from './utilities'; import { MEDIA_ASSET_PAGE } from '#app/routes/utils/pageTypes'; import useCombinedClickTrackerHandler from './useCombinedClickTrackerHandler'; import PromoTimestamp from './Timestamp'; @@ -39,12 +39,6 @@ const SingleColumnStoryPromo = styled(StoryPromo)` } `; -const getLinkId = (assetUri, labelId) => { - const assetId = assetUri.split('/').pop(); - const sanitisedId = assetId.replace(/\W/g, ''); - return `promo-link-${labelId}${sanitisedId || ''}`; -}; - const StoryPromoImage = ({ useLargeImages, imageValues, lazyLoad }) => { if (!imageValues) { const landscapeRatio = (9 / 16) * 100; @@ -110,12 +104,8 @@ const StoryPromoContainer = ({ const { script, service, translations } = useContext(ServiceContext); const { pageType } = useContext(RequestContext); const handleClickTracking = useCombinedClickTrackerHandler(eventTrackingData); - const assetUri = pathOr( - pathOr('', ['uri'], item), - ['locators', 'assetUri'], - item, - ); - const linkId = getLinkId(assetUri, labelId); + + const linkId = getUniqueLinkId(item, labelId); const liveLabel = pathOr('LIVE', ['media', 'liveLabel'], translations); diff --git a/src/app/containers/StoryPromo/index.test.jsx b/src/app/containers/StoryPromo/index.test.jsx index 195ed7c4942..de57274c0b0 100644 --- a/src/app/containers/StoryPromo/index.test.jsx +++ b/src/app/containers/StoryPromo/index.test.jsx @@ -29,6 +29,7 @@ import { } from './helpers/fixtureData'; import StoryPromoContainer from '.'; import { ARTICLE_PAGE } from '#app/routes/utils/pageTypes'; +import { getUniqueLinkId } from './utilities'; const onlyOneRelatedItem = { ...indexAlsosItem, @@ -156,17 +157,9 @@ describe('StoryPromo Container', () => { it('should render h3, a, p, time', () => { const labelId = `unlabelled`; - const assetUri = pathOr('', ['locators', 'assetUri'], cpsItem); - const uri = pathOr('', ['uri'], assetTypeItem); - const getLinkId = uriId => { - const splitUri = uriId.split('/').pop(); - const sanitisedId = splitUri.replace(/\W/g, ''); - return `promo-link-${labelId}${sanitisedId || ''}`; - }; - - const uriLabelId = getLinkId(uri); - const assetUriId = getLinkId(assetUri); + const uriLabelId = getUniqueLinkId(assetTypeItem, labelId); + const assetUriId = getUniqueLinkId(cpsItem, labelId); expect(cpsContainer.querySelectorAll('h3 a')[0].innerHTML).toEqual( `${cpsItem.headlines.headline}`, diff --git a/src/app/containers/StoryPromo/utilities/index.js b/src/app/containers/StoryPromo/utilities/index.js index 2b699ce44de..126c38c961b 100644 --- a/src/app/containers/StoryPromo/utilities/index.js +++ b/src/app/containers/StoryPromo/utilities/index.js @@ -24,3 +24,13 @@ export const getHeadingTagOverride = ({ pageType, isContentTypeGuide }) => { }; export const isPgl = item => pathOr(null, ['cpsType'], item) === 'PGL'; + +export const getUniqueLinkId = (item, labelId) => { + const assetUri = pathOr('', ['locators', 'assetUri'], item); + const contentType = pathOr('', ['contentType'], item); + const uri = pathOr('', ['uri'], item); + const uniqueId = assetUri || uri; + const assetId = uniqueId.split('/').pop(); + const sanitisedId = assetId.replace(/\W/g, ''); + return `promo-link-${labelId}${sanitisedId || ''}${contentType}`; +}; diff --git a/src/app/containers/StoryPromo/utilities/index.test.js b/src/app/containers/StoryPromo/utilities/index.test.js index 9e06403e760..2f61d0f95a8 100644 --- a/src/app/containers/StoryPromo/utilities/index.test.js +++ b/src/app/containers/StoryPromo/utilities/index.test.js @@ -1,9 +1,15 @@ -import { isMap, isPgl, getHeadingTagOverride } from '.'; +import pathOr from 'ramda/src/pathOr'; +import { isMap, isPgl, getHeadingTagOverride, getUniqueLinkId } from '.'; import { MOST_WATCHED_PAGE, PHOTO_GALLERY_PAGE, MEDIA_ASSET_PAGE, } from '#app/routes/utils/pageTypes'; +import { + completeItem, + standardLinkItem, + secondaryColumnNoURI, +} from '../helpers/fixtureData'; describe('isMap', () => { it('should return true if cpsType is MAP', () => { @@ -70,3 +76,30 @@ describe('getHeadingTagOverride', () => { expect(getHeadingTagOverride({ pageType, isContentTypeGuide })).toBe(null); }); }); + +describe('getUniqueLinkId', () => { + const labelId = 'unlabelled'; + it('should return id of promo-link with contentType if contentType exists', () => { + expect(getUniqueLinkId(secondaryColumnNoURI, labelId)).toEqual( + 'promo-link-unlabellednewsRadioBulletin', + ); + }); + + it('should return id using URI if assetURI does not exist', () => { + expect(getUniqueLinkId(standardLinkItem, labelId)).toEqual( + 'promo-link-unlabelledazeriText', + ); + }); + + it('should return id using assetURI does not exist', () => { + expect(getUniqueLinkId(completeItem, labelId)).toEqual( + 'promo-link-unlabelledwwwbbccouk', + ); + }); + + it('should sanitise link from item and split from last forward slash', () => { + expect( + getUniqueLinkId({ locators: { assetUri: 'a/a/ab.b.b@c@c@c' } }, labelId), + ).toEqual('promo-link-unlabelledabbbccc'); + }); +}); diff --git a/src/app/pages/StoryPage/__snapshots__/index.test.jsx.snap b/src/app/pages/StoryPage/__snapshots__/index.test.jsx.snap index 9c2ffadbd13..8459e6bfbe2 100644 --- a/src/app/pages/StoryPage/__snapshots__/index.test.jsx.snap +++ b/src/app/pages/StoryPage/__snapshots__/index.test.jsx.snap @@ -9724,12 +9724,12 @@ exports[`Story Page snapshots should match snapshot for STY 1`] = ` class="emotion-212 emotion-213" > Feature promo From c59d5f56314f6cc183a744a546f72e3230478817 Mon Sep 17 00:00:00 2001 From: nicola-d-bbc Date: Wed, 1 Dec 2021 12:42:45 +0000 Subject: [PATCH 2/3] removed unused pathor --- src/app/containers/StoryPromo/index.test.jsx | 1 - src/app/containers/StoryPromo/utilities/index.test.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/app/containers/StoryPromo/index.test.jsx b/src/app/containers/StoryPromo/index.test.jsx index de57274c0b0..2e9d44b6eba 100644 --- a/src/app/containers/StoryPromo/index.test.jsx +++ b/src/app/containers/StoryPromo/index.test.jsx @@ -5,7 +5,6 @@ import { shouldMatchSnapshot, suppressPropWarnings, } from '@bbc/psammead-test-helpers'; -import pathOr from 'ramda/src/pathOr'; import loggerMock from '#testHelpers/loggerMock'; import { MEDIA_MISSING } from '#lib/logger.const'; import { RequestContextProvider } from '#contexts/RequestContext'; diff --git a/src/app/containers/StoryPromo/utilities/index.test.js b/src/app/containers/StoryPromo/utilities/index.test.js index 2f61d0f95a8..e4f97a4143d 100644 --- a/src/app/containers/StoryPromo/utilities/index.test.js +++ b/src/app/containers/StoryPromo/utilities/index.test.js @@ -1,4 +1,3 @@ -import pathOr from 'ramda/src/pathOr'; import { isMap, isPgl, getHeadingTagOverride, getUniqueLinkId } from '.'; import { MOST_WATCHED_PAGE, From 2ee66ef3c9faea09141f3e6f0444ac0ef758bfc5 Mon Sep 17 00:00:00 2001 From: nicola-d-bbc Date: Wed, 1 Dec 2021 12:51:38 +0000 Subject: [PATCH 3/3] add another test --- .../StoryPromo/helpers/fixtureData.js | 24 ++++++++++++++++++- .../StoryPromo/utilities/index.test.js | 15 ++++++++---- 2 files changed, 34 insertions(+), 5 deletions(-) diff --git a/src/app/containers/StoryPromo/helpers/fixtureData.js b/src/app/containers/StoryPromo/helpers/fixtureData.js index ae93550d8b4..954eb2fddcf 100644 --- a/src/app/containers/StoryPromo/helpers/fixtureData.js +++ b/src/app/containers/StoryPromo/helpers/fixtureData.js @@ -344,7 +344,7 @@ export const mapWithoutMediaError = { type: 'cps', }; -export const secondaryColumnNoURI = { +export const secondaryColumnNoAssetURI = { name: 'Test Radio Bul promo Live', summary: 'Test Radio summary', indexImage: { @@ -366,3 +366,25 @@ export const secondaryColumnNoURI = { isLive: true, type: 'link', }; + +export const secondaryColumnContentType = { + name: 'Test Radio Bul promo Live', + summary: 'Test Radio summary', + indexImage: { + id: '63711781', + subType: 'index', + href: 'http://b.files.bbci.co.uk/4917/test/_63711781_clinton.jpg', + path: '/cpsdevpb/4917/test/_63711781_clinton.jpg', + height: 371, + width: 660, + altText: 'Clinton', + caption: 'Clinton', + copyrightHolder: 'BBC', + type: 'image', + }, + contentType: 'RadioBulletin', + assetTypeCode: 'PRO', + timestamp: 1571655919000, + isLive: true, + type: 'link', +}; diff --git a/src/app/containers/StoryPromo/utilities/index.test.js b/src/app/containers/StoryPromo/utilities/index.test.js index e4f97a4143d..a7c54096553 100644 --- a/src/app/containers/StoryPromo/utilities/index.test.js +++ b/src/app/containers/StoryPromo/utilities/index.test.js @@ -7,7 +7,8 @@ import { import { completeItem, standardLinkItem, - secondaryColumnNoURI, + secondaryColumnNoAssetURI, + secondaryColumnContentType, } from '../helpers/fixtureData'; describe('isMap', () => { @@ -78,8 +79,8 @@ describe('getHeadingTagOverride', () => { describe('getUniqueLinkId', () => { const labelId = 'unlabelled'; - it('should return id of promo-link with contentType if contentType exists', () => { - expect(getUniqueLinkId(secondaryColumnNoURI, labelId)).toEqual( + it('should return id of promo-link with contentType and URI if contentType exists', () => { + expect(getUniqueLinkId(secondaryColumnNoAssetURI, labelId)).toEqual( 'promo-link-unlabellednewsRadioBulletin', ); }); @@ -90,12 +91,18 @@ describe('getUniqueLinkId', () => { ); }); - it('should return id using assetURI does not exist', () => { + it('should return id using assetURI does not exist and contentType does not exist', () => { expect(getUniqueLinkId(completeItem, labelId)).toEqual( 'promo-link-unlabelledwwwbbccouk', ); }); + it('should return id with contentType only if assetURI and URI do not exist', () => { + expect(getUniqueLinkId(secondaryColumnContentType, labelId)).toEqual( + 'promo-link-unlabelledRadioBulletin', + ); + }); + it('should sanitise link from item and split from last forward slash', () => { expect( getUniqueLinkId({ locators: { assetUri: 'a/a/ab.b.b@c@c@c' } }, labelId),