diff --git a/src/integration/pages/topicPage/canonicalTests.js b/ws-nextjs-app/integration/pages/topicPage/canonicalTests.ts similarity index 100% rename from src/integration/pages/topicPage/canonicalTests.js rename to ws-nextjs-app/integration/pages/topicPage/canonicalTests.ts diff --git a/src/integration/pages/topicPage/crossPlatformTests.js b/ws-nextjs-app/integration/pages/topicPage/crossPlatformTests.ts similarity index 64% rename from src/integration/pages/topicPage/crossPlatformTests.js rename to ws-nextjs-app/integration/pages/topicPage/crossPlatformTests.ts index 7dbd3456368..f8ea5e3b3e5 100644 --- a/src/integration/pages/topicPage/crossPlatformTests.js +++ b/ws-nextjs-app/integration/pages/topicPage/crossPlatformTests.ts @@ -1,5 +1,7 @@ import { runCommonCrossPlatformTests } from '../../common'; +import pageContentTests from './pageContentTests'; export default service => { runCommonCrossPlatformTests(service); + pageContentTests(); }; diff --git a/ws-nextjs-app/integration/pages/topicPage/mundo/__snapshots__/canonical.test.ts.snap b/ws-nextjs-app/integration/pages/topicPage/mundo/__snapshots__/canonical.test.ts.snap new file mode 100644 index 00000000000..f41a3fdb14a --- /dev/null +++ b/ws-nextjs-app/integration/pages/topicPage/mundo/__snapshots__/canonical.test.ts.snap @@ -0,0 +1,27 @@ +// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing + +exports[`Topic page with badge image, description and multiple curations with h2 headings Page content First item in the first curation is the correct headline 1`] = `"Edited New 1226 El conflictivo pasado con Venezuela de Rex Tillerson, nuevo secretario de Estado de EEUU"`; + +exports[`Topic page with badge image, description and multiple curations with h2 headings Page content First item in the first curation is the correct image 1`] = ` +ExxonMobil Chairman and CEO Rex Tillerson speaks during the IHS CERAWeek 2015 energy conference in Houston, Texas April 21, 2015 +`; + +exports[`Topic page with badge image, description and multiple curations with h2 headings should display the topic badge image 1`] = ` + +`; + +exports[`Topic page with badge image, description and multiple curations with h2 headings should display the topic description under the title 1`] = `"Peace agreement between the Colombian government and FARC"`; diff --git a/ws-nextjs-app/integration/pages/topicPage/mundo/canonical.test.ts b/ws-nextjs-app/integration/pages/topicPage/mundo/canonical.test.ts new file mode 100644 index 00000000000..570f36d94c2 --- /dev/null +++ b/ws-nextjs-app/integration/pages/topicPage/mundo/canonical.test.ts @@ -0,0 +1,48 @@ +/** + * @service mundo + * @pathname /mundo/topics/c1en6xwmpkvt + */ + +import pageContentTests from '../../homePage/pageContentTests'; + +describe('Topic page with badge image, description and multiple curations with h2 headings', () => { + pageContentTests(); + it('should display the topic badge image', () => { + const topicBadge = document.querySelector('img[data-testid="topic-badge"]'); + expect(topicBadge).toBeInTheDocument(); + expect(topicBadge).toMatchSnapshot(); + }); + it('should display the topic description under the title', () => { + const title = document.querySelector('h1#content'); + expect(title).toBeInTheDocument(); + + const parent = title?.parentElement; + const description = parent?.nextElementSibling; + expect(description).toBeInTheDocument(); + expect(description?.textContent).toMatchSnapshot(); + }); + + it('should display multiple curations each with a curation title', () => { + const curationTitles = Array.from(document.querySelectorAll('h2')); + const curationGrids = Array.from( + document.querySelectorAll( + '[data-testid="curation-grid-normal"], [data-testid="hierarchical-grid"]', + ), + ); + + // There should be at least two curations with titles + expect(curationTitles.length).toBeGreaterThan(1); + expect(curationGrids.length).toBeGreaterThan(1); + + // Each curation grid should be preceded by a curation title (h2) + curationGrids.forEach(grid => { + let previous = grid.previousElementSibling; + // Traverse back to find the h2 (skip over any non-h2 elements) + while (previous && previous.tagName !== 'H2') { + previous = previous.previousElementSibling; + } + expect(previous).not.toBeNull(); + expect(previous?.tagName).toBe('H2'); + }); + }); +}); diff --git a/ws-nextjs-app/integration/pages/topicPage/pageContentTests.ts b/ws-nextjs-app/integration/pages/topicPage/pageContentTests.ts new file mode 100644 index 00000000000..e981fe4ff80 --- /dev/null +++ b/ws-nextjs-app/integration/pages/topicPage/pageContentTests.ts @@ -0,0 +1,37 @@ +export default () => { + describe('Page content', () => { + describe('First item in the first curation', () => { + it('is the correct headline', () => { + const firstItemHeadline = document.querySelector( + '[data-testid="topic-promos"] > li h2 a', + ); + expect(firstItemHeadline).toBeInTheDocument(); + + if (firstItemHeadline) { + expect(firstItemHeadline.textContent).toMatchSnapshot(); + } + }); + + it('is the correct image', () => { + const firstImage = document.querySelector( + '[data-testid="topic-promos"] > li img, amp-img', + ); + expect(firstImage).toBeInTheDocument(); + expect(firstImage).toMatchSnapshot(); + }); + }); + + it('should display a simple curation grid', () => { + const simpleCurationGrid = document.querySelector( + '[data-testid="curation-grid-normal"]', + ); + + expect(simpleCurationGrid).toBeInTheDocument(); + }); + + it('should render the main html tag with an attribute of role with the value of main', () => { + const mainTag = document.querySelector("main[role='main']"); + expect(mainTag).toBeInTheDocument(); + }); + }); +}; diff --git a/src/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.js.snap b/ws-nextjs-app/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.ts.snap similarity index 88% rename from src/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.js.snap rename to ws-nextjs-app/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.ts.snap index 4ca4c67b8cd..724b8c401eb 100644 --- a/src/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.js.snap +++ b/ws-nextjs-app/integration/pages/topicPage/pidgin/__snapshots__/canonical.test.ts.snap @@ -175,10 +175,24 @@ exports[`Canonical Topic Page Header Navigation link should match text and url 8 exports[`Canonical Topic Page Main heading should match text 1`] = `"Donald Trump"`; +exports[`Canonical Topic Page Page content First item in the first curation is the correct headline 1`] = `"Di 34 criminal charges against former US President Donald Trump and di likely punishment"`; + +exports[`Canonical Topic Page Page content First item in the first curation is the correct image 1`] = ` +Donald Trump in court wit im lawyers, including Todd Blanche (far left) and Susan Necheles (second from left) +`; + exports[`Canonical Topic Page SEO Apple Touch Icon should match attributes 1`] = ` { "sizes": null, - "url": "http://localhost:7080/pidgin/images/icons/icon-192x192.png", + "url": "http://localhost:7081/pidgin/images/icons/icon-192x192.png", } `; @@ -210,7 +224,7 @@ exports[`Canonical Topic Page SEO Apple Touch Icon should match attributes 5`] = } `; -exports[`Canonical Topic Page SEO Canonical link 1`] = `"http://localhost:7080/pidgin/topics/c95y35941vrt"`; +exports[`Canonical Topic Page SEO Canonical link 1`] = `"http://localhost:7081/pidgin/topics/c95y35941vrt"`; exports[`Canonical Topic Page SEO Dir attribute 1`] = `"ltr"`; @@ -239,7 +253,7 @@ exports[`Canonical Topic Page SEO Linked data should match text 1`] = ` "name": "Nigerian Pidgin", }, "mainEntityOfPage": { - "@id": "http://localhost:7080/pidgin/topics/c95y35941vrt", + "@id": "http://localhost:7081/pidgin/topics/c95y35941vrt", "@type": "WebPage", "name": "Donald Trump", }, @@ -255,7 +269,7 @@ exports[`Canonical Topic Page SEO Linked data should match text 1`] = ` "publishingPrinciples": "https://www.bbc.com/pidgin/institutional-48528766", }, "thumbnailUrl": "https://static.files.bbci.co.uk/ws/simorgh-assets/public/pidgin/images/metadata/poster-1024x576.png", - "url": "http://localhost:7080/pidgin/topics/c95y35941vrt", + "url": "http://localhost:7081/pidgin/topics/c95y35941vrt", }, { "@type": "ItemList", @@ -432,7 +446,7 @@ exports[`Canonical Topic Page SEO OG title 1`] = `"Donald Trump - BBC News Pidgi exports[`Canonical Topic Page SEO OG type 1`] = `"website"`; -exports[`Canonical Topic Page SEO OG url 1`] = `"http://localhost:7080/pidgin/topics/c95y35941vrt"`; +exports[`Canonical Topic Page SEO OG url 1`] = `"http://localhost:7081/pidgin/topics/c95y35941vrt"`; exports[`Canonical Topic Page SEO Page title 1`] = `"Donald Trump - BBC News Pidgin"`; diff --git a/src/integration/pages/topicPage/pidgin/canonical.test.js b/ws-nextjs-app/integration/pages/topicPage/pidgin/canonical.test.ts similarity index 100% rename from src/integration/pages/topicPage/pidgin/canonical.test.js rename to ws-nextjs-app/integration/pages/topicPage/pidgin/canonical.test.ts