@newskit-render/core 1.2.3 → 1.5.2

package/components/article/__tests__/index.test.tsx

@@ -1,18 +1,9 @@
-import React from 'react'
 import { within } from '@testing-library/react'
 
 import Article, { ArticleProps } from '..'
 import { Slug, URL, Image } from '../../../helpers/global-types'
 import { renderWithTheme } from '../../../helpers/test-utils'
 
-jest.mock('@newskit-render/shared-components', () => ({
-  NextLink: (props) => (
-    <a href={props.href} aria-label={props['aria-label']}>
-      {props.children}
-    </a>
-  ),
-}))
-
 const articleData: ArticleProps = {
   id: 'demo-1',
   url: 'https://mock-site-url/some-location' as URL,

package/components/footer/__snapshots__/index.test.tsx.snap

@@ -145,7 +145,88 @@ exports[`Footer tests should render footer 1`] = `
   }
 }
 
-.emotion-17 {
+.emotion-10 {
+  display: inline-block;
+  transition-property: color;
+  transition-duration: 200ms;
+  transition-timing-function: cubic-bezier(0, 0, .5, 1);
+  color: #FFFFFF;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-10 svg {
+  fill: #FFFFFF;
+}
+
+.emotion-10:hover:not(:disabled) {
+  color: #FFFFFF;
+  -webkit-text-decoration: underline;
+  text-decoration: underline;
+}
+
+.emotion-10:hover:not(:disabled) svg {
+  fill: #FFFFFF;
+}
+
+.emotion-10:active:not(:disabled) {
+  color: #FFFFFF;
+  -webkit-text-decoration: underline;
+  text-decoration: underline;
+}
+
+.emotion-10:active:not(:disabled) svg {
+  fill: #FFFFFF;
+}
+
+.emotion-11 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  height: 100%;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+}
+
+.emotion-12 {
+  margin: 0;
+  padding: 1px 0;
+  font-family: "DM Sans",sans-serif;
+  font-size: 14px;
+  line-height: 1.4285714285714286;
+  font-weight: 500;
+  letter-spacing: -0.5px;
+  display: inline-block;
+  display: block;
+}
+
+.emotion-12::before {
+  content: '';
+  display: block;
+  height: 0;
+  width: 0;
+  margin-bottom: -0.3955357142857143em;
+}
+
+.emotion-12::after {
+  content: '';
+  display: block;
+  height: 0;
+  width: 0;
+  margin-top: -0.3955357142857143em;
+}
+
+.emotion-35 {
   margin: 0;
   color: #535353;
   font-family: "DM Sans",sans-serif;
@@ -155,7 +236,7 @@ exports[`Footer tests should render footer 1`] = `
   letter-spacing: -0.5px;
 }
 
-.emotion-17 svg {
+.emotion-35 svg {
   fill: #535353;
 }
 
@@ -215,9 +296,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink One"
+                class="emotion-10"
                 href="/link-one"
               >
-                NavLink One
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink One
+                  </span>
+                </span>
               </a>
             </span>
             <span
@@ -225,9 +315,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink Two"
+                class="emotion-10"
                 href="/link-two"
               >
-                NavLink Two
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink Two
+                  </span>
+                </span>
               </a>
             </span>
             <span
@@ -235,9 +334,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink Three"
+                class="emotion-10"
                 href="/link-three"
               >
-                NavLink Three
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink Three
+                  </span>
+                </span>
               </a>
             </span>
             <span
@@ -245,9 +353,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink Four"
+                class="emotion-10"
                 href="/link-four"
               >
-                NavLink Four
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink Four
+                  </span>
+                </span>
               </a>
             </span>
             <span
@@ -255,9 +372,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink Five"
+                class="emotion-10"
                 href="/link-five"
               >
-                NavLink Five
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink Five
+                  </span>
+                </span>
               </a>
             </span>
             <span
@@ -265,9 +391,18 @@ exports[`Footer tests should render footer 1`] = `
             >
               <a
                 aria-label="NavLink Six"
+                class="emotion-10"
                 href="/link-six"
               >
-                NavLink Six
+                <span
+                  class="emotion-11"
+                >
+                  <span
+                    class="emotion-12"
+                  >
+                    NavLink Six
+                  </span>
+                </span>
               </a>
             </span>
           </div>
@@ -281,7 +416,7 @@ exports[`Footer tests should render footer 1`] = `
             />
           </div>
           <p
-            class="emotion-17"
+            class="emotion-35"
           >
             Copyright © 2020 News Corp. All rights reserved.
           </p>

package/components/footer/index.test.tsx

@@ -1,15 +1,6 @@
-import React from 'react'
 import { renderWithTheme } from '../../helpers/test-utils'
 import Footer from '.'
 
-jest.mock('@newskit-render/shared-components', () => ({
-  NextLink: (props) => (
-    <a href={props.href} aria-label={props['aria-label']}>
-      {props.children}
-    </a>
-  ),
-}))
-
 describe('Footer tests', () => {
   test('should render footer', () => {
     const { asFragment } = renderWithTheme(Footer)

package/components/header/index.test.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { fireEvent } from '@testing-library/react'
 import { renderWithTheme } from '../../helpers/test-utils'
 import Header from '.'
@@ -9,14 +8,6 @@ jest.mock('@newskit-render/my-account', () => {
   }
 })
 
-jest.mock('@newskit-render/shared-components', () => ({
-  NextLink: (props) => (
-    <a href={props.href} aria-label={props['aria-label']}>
-      {props.children}
-    </a>
-  ),
-}))
-
 describe('Header tests', () => {
   test('should open and close mobile menu', () => {
     const { getByTestId, queryByTestId } = renderWithTheme(Header)

package/components/header/index.tsx

@@ -68,7 +68,7 @@ const pastDueBanner = {
   },
   cancelled: {
     title: 'Your subscription has been cancelled.',
-    text: 'You will lose access to all benefits on ##DATE##. To re-activate your subscription call 0800 555 1234.',
+    text: 'You’ll no longer have access to subscription benefits. To re-activate call 0800 555 1234.',
   },
   treshold: {
     firstNotice: 26,

package/components/section/__tests__/ArticleSlice.test.tsx

@@ -4,14 +4,6 @@ import ArticleSlice from '../ArticleSlice'
 import { getPageMock } from '../../../helpers/mocks'
 import { SectionContext } from '../SectionContext'
 
-jest.mock('@newskit-render/shared-components', () => ({
-  NextLink: (props) => (
-    <a href={props.href} aria-label={props['aria-label']}>
-      {props.children}
-    </a>
-  ),
-}))
-
 describe('ArticleSlice', () => {
   test('Handled LEAD_1_AND_2 article-block', () => {
     const { getByTestId, getAllByTestId, getAllByRole } = renderWithTheme(
@@ -102,11 +94,11 @@ describe('ArticleSlice', () => {
     expect(getByText('Layout: LEAD_1_AND_1')).toBeInTheDocument()
     expect(getByText('test headline').closest('a')).toHaveAttribute(
       'href',
-      'catagory-one/demo-1/test-headline'
+      '/catagory-one/demo-1/test-headline'
     )
     expect(getByText('test headline 2').closest('a')).toHaveAttribute(
       'href',
-      'catagory-two/demo-2/test-headline-2'
+      '/catagory-two/demo-2/test-headline-2'
     )
   })
 

package/components/section/layouts/__tests__/SectionRow.test.tsx

@@ -1,16 +1,7 @@
-import React from 'react'
 import { renderWithTheme } from '../../../../helpers/test-utils'
 import { SectionRow } from '../SectionRow'
 import { getPageMock } from '../../../../helpers/mocks'
 
-jest.mock('@newskit-render/shared-components', () => ({
-  NextLink: (props) => (
-    <a href={props.href} aria-label={props['aria-label']}>
-      {props.children}
-    </a>
-  ),
-}))
-
 describe('SectionRow', () => {
   test('SectionRow with title', () => {
     const { asFragment } = renderWithTheme(SectionRow, {