From 8509802f489fbff3eafda79523108b6b85b92104 Mon Sep 17 00:00:00 2001
From: "Matthew Riley MacPherson (tofumatt)" <hi@tofumatt.com>
Date: Wed, 26 Sep 2018 02:21:30 +0100
Subject: [PATCH] fix: Show "Publish Immediately"

* Close #7195
* Close #8395
* Close #9030
* Close #9967
* Fix #10182
---
 .../src/components/post-schedule/label.js     | 10 +++-
 test/e2e/specs/datepicker.test.js             | 59 +++++++++++++++++++
 2 files changed, 66 insertions(+), 3 deletions(-)
 create mode 100644 test/e2e/specs/datepicker.test.js

diff --git a/packages/editor/src/components/post-schedule/label.js b/packages/editor/src/components/post-schedule/label.js
index dc4b0cd7233a69..4ee5fd837b8343 100644
--- a/packages/editor/src/components/post-schedule/label.js
+++ b/packages/editor/src/components/post-schedule/label.js
@@ -2,13 +2,17 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { dateI18n, getSettings } from '@wordpress/date';
+import { dateI18n, getSettings, moment } from '@wordpress/date';
 import { withSelect } from '@wordpress/data';
 
 function PostScheduleLabel( { date } ) {
 	const settings = getSettings();
-	return date ?
-		dateI18n( settings.formats.datetime, date ) :
+
+	// If the publishing datetime is after the current datetime, show the date
+	// the post is scheduled to go public.
+	// Otherwise we just display "Immediately".
+	return date && moment().isBefore( date ) ?
+		dateI18n( settings.formats.datetimeAbbreviated, date ) :
 		__( 'Immediately' );
 }
 
diff --git a/test/e2e/specs/datepicker.test.js b/test/e2e/specs/datepicker.test.js
new file mode 100644
index 00000000000000..842b8a6f06cf36
--- /dev/null
+++ b/test/e2e/specs/datepicker.test.js
@@ -0,0 +1,59 @@
+/**
+ * Internal dependencies
+ */
+import { newPost } from '../support/utils';
+
+describe( 'Datepicker', () => {
+	beforeEach( async () => {
+		await newPost();
+	} );
+
+	it( 'should show the publishing date as "Immediately" if the date is not altered', async () => {
+		const publishingDate = await page.$eval(
+			'#edit-post-post-schedule__toggle',
+			( dateLabel ) => dateLabel.textContent
+		);
+
+		expect( publishingDate ).toEqual( 'Immediately' );
+	} );
+
+	it( 'should show the publishing date as "Immediately" if the date is in the past', async () => {
+		// Open the datepicker.
+		await page.click( '#edit-post-post-schedule__toggle' );
+
+		// Change the publishing date to a year in the past.
+		await page.click( '.components-datetime__time__form__container--year' );
+		await page.keyboard.press( 'ArrowDown' );
+
+		// Close the datepicker.
+		await page.click( '#edit-post-post-schedule__toggle' );
+
+		const publishingDate = await page.$eval(
+			'#edit-post-post-schedule__toggle',
+			( dateLabel ) => dateLabel.textContent
+		);
+
+		expect( publishingDate ).toEqual( 'Immediately' );
+	} );
+
+	it( 'should show the publishing date if the date is in the future', async () => {
+		// Open the datepicker.
+		await page.click( '#edit-post-post-schedule__toggle' );
+
+		// Change the publishing date to a year in the future.
+		await page.click( '.components-datetime__time__form__container--year' );
+		await page.keyboard.press( 'ArrowUp' );
+
+		// Close the datepicker.
+		await page.click( '#edit-post-post-schedule__toggle' );
+
+		const publishingDate = await page.$eval(
+			'#edit-post-post-schedule__toggle',
+			( dateLabel ) => dateLabel.textContent
+		);
+
+		expect( publishingDate ).not.toEqual( 'Immediately' );
+		// The expected date format will be "Sep 26, 2018 11:52 pm".
+		expect( publishingDate ).toMatch( /[A-Za-z]{3} \d{1,2}, \d{4} \d{1,2}:\d{2} [ap]m/ );
+	} );
+} );