@financial-times/x-teaser 18.2.0 → 18.2.1

package/__tests__/Status.test.jsx

@@ -17,9 +17,8 @@ const ScoopLabelSpy = jest
 const PremiumLabelSpy = jest
 	.spyOn(PremiumLabel, 'default')
 	.mockReturnValue(<div className="premium-label">PremiumLabel</div>)
-const AlwaysShowTimestampSpy = jest
-	.spyOn(AlwaysShowTimestamp, 'default')
-	.mockReturnValue(<div className="always-show-timestamp">AlwaysShowTimestamp</div>)
+// don't mock this component as we want to test its logic
+const AlwaysShowTimestampSpy = jest.spyOn(AlwaysShowTimestamp, 'default')
 const RelativeTimeSpy = jest
 	.spyOn(RelativeTime, 'default')
 	.mockReturnValue(<div className="relative-time">RelativeTimeSpy</div>)
@@ -128,8 +127,6 @@ describe('Status - Display Logic', () => {
 			expect(LiveBlogStatusSpy).not.toHaveBeenCalled()
 			expect(ScoopLabelSpy).not.toHaveBeenCalled()
 			expect(AlwaysShowTimestampSpy).not.toHaveBeenCalled()
-			expect(RelativeTimeSpy).not.toHaveBeenCalled()
-			expect(TimeStampSpy).not.toHaveBeenCalled()
 		})
 
 		it('should not render PremiumLabel when showPremiumLabel = false', () => {
@@ -155,6 +152,9 @@ describe('Status - Display Logic', () => {
 		})
 
 		it('renders only AlwaysShowTimestamp when higher-level render props are absent and AlwaysShowTimestamp props are present', () => {
+			AlwaysShowTimestampSpy.mockReturnValueOnce(
+				<div className="always-show-timestamp">AlwaysShowTimestamp</div>
+			)
 			mount(<Status {...props} />)
 
 			expect(AlwaysShowTimestampSpy).toHaveBeenCalledTimes(1)
@@ -179,6 +179,27 @@ describe('Status - Display Logic', () => {
 			expect(AlwaysShowTimestampSpy).not.toHaveBeenCalled()
 		})
 
+		it('should select RelativeTime when publishedDate is same as today in AlwaysShowTimestamp', () => {
+			props.publishedDate = new Date().toISOString()
+			mount(<Status {...props} />)
+
+			expect(AlwaysShowTimestampSpy).toHaveBeenCalledTimes(1)
+			expect(RelativeTimeSpy).toHaveBeenCalledTimes(1)
+			expect(TimeStampSpy).not.toHaveBeenCalled()
+		})
+
+		it('should select TimeStamp when publishedDate is not the same as today in AlwaysShowTimestamp', () => {
+			const yesterday = new Date()
+			// yes this works on the first of the month too
+			yesterday.setDate(yesterday.getDate() - 1)
+			props.publishedDate = yesterday.toISOString()
+			mount(<Status {...props} />)
+
+			expect(AlwaysShowTimestampSpy).toHaveBeenCalledTimes(1)
+			expect(TimeStampSpy).toHaveBeenCalledTimes(1)
+			expect(RelativeTimeSpy).not.toHaveBeenCalled()
+		})
+
 		it('should not render AlwaysShowTimestamp when useRelativeTimeIfToday = false', () => {
 			props.useRelativeTimeIfToday = false
 			mount(<Status {...props} />)

package/dist/Teaser.cjs.js

@@ -6,7 +6,6 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var xEngine = require('@financial-times/x-engine');
 var dateformat = _interopDefault(require('dateformat'));
-var dateFns = require('date-fns');
 
 /**
  * Rules are sets of exclusive properties.
@@ -476,7 +475,7 @@ var LiveBlogStatus = ({
 var AlwaysShowTimestamp = props => {
   const localTodayDate = new Date().toISOString().substr(0, 10); // keep only the date bit
   const dateToCompare = new Date(props.publishedDate).toISOString().substr(0, 10);
-  if (dateFns.differenceInCalendarDays(localTodayDate, dateToCompare) >= 1) {
+  if (localTodayDate !== dateToCompare) {
     return xEngine.h(TimeStamp, props);
   } else {
     return xEngine.h(RelativeTime, Object.assign({}, props, {

package/dist/Teaser.es5.js

@@ -6,7 +6,6 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var xEngine = require('@financial-times/x-engine');
 var dateformat = _interopDefault(require('dateformat'));
-var dateFns = require('date-fns');
 
 /**
  * Rules are sets of exclusive properties.
@@ -561,7 +560,7 @@ var LiveBlogStatus = (function (_ref) {
 var AlwaysShowTimestamp = (function (props) {
   var localTodayDate = new Date().toISOString().substr(0, 10); // keep only the date bit
   var dateToCompare = new Date(props.publishedDate).toISOString().substr(0, 10);
-  if (dateFns.differenceInCalendarDays(localTodayDate, dateToCompare) >= 1) {
+  if (localTodayDate !== dateToCompare) {
     return xEngine.h(TimeStamp, props);
   } else {
     return xEngine.h(RelativeTime, Object.assign({}, props, {

package/dist/Teaser.esm.js

@@ -1,6 +1,5 @@
 import { h } from '@financial-times/x-engine';
 import dateformat from 'dateformat';
-import { differenceInCalendarDays } from 'date-fns';
 
 /**
  * Rules are sets of exclusive properties.
@@ -470,7 +469,7 @@ var LiveBlogStatus = ({
 var AlwaysShowTimestamp = props => {
   const localTodayDate = new Date().toISOString().substr(0, 10); // keep only the date bit
   const dateToCompare = new Date(props.publishedDate).toISOString().substr(0, 10);
-  if (differenceInCalendarDays(localTodayDate, dateToCompare) >= 1) {
+  if (localTodayDate !== dateToCompare) {
     return h(TimeStamp, props);
   } else {
     return h(RelativeTime, Object.assign({}, props, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@financial-times/x-teaser",
-  "version": "18.2.0",
+  "version": "18.2.1",
   "description": "This module provides templates for use with o-teaser. Teasers are used to present content.",
   "source": "src/Teaser.jsx",
   "main": "dist/Teaser.cjs.js",
@@ -18,8 +18,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@financial-times/x-engine": "^18.2.0",
-    "date-fns": "^2.30.0",
+    "@financial-times/x-engine": "^18.2.1",
     "dateformat": "^3.0.3"
   },
   "devDependencies": {

package/src/AlwaysShowTimestamp.jsx

@@ -1,7 +1,6 @@
 import { h } from '@financial-times/x-engine'
 import TimeStamp from './TimeStamp'
 import RelativeTime from './RelativeTime'
-import { differenceInCalendarDays } from 'date-fns'
 
 /**
  * Timestamp shown always, the default 4h limit does not apply here
@@ -12,7 +11,7 @@ export default (props) => {
 	const localTodayDate = new Date().toISOString().substr(0, 10) // keep only the date bit
 	const dateToCompare = new Date(props.publishedDate).toISOString().substr(0, 10)
 
-	if (differenceInCalendarDays(localTodayDate, dateToCompare) >= 1) {
+	if (localTodayDate !== dateToCompare) {
 		return <TimeStamp {...props} />
 	} else {
 		return <RelativeTime {...props} showAlways={true} />