Editor: Fix move to trash redirect save race conditions. (#18275)

* Editor: Fix move to trash redirect save race conditions.

* Editor: Add e2e test.

* Editor: Expand comment.

* Fix BrowserURL capitalization

* Revert "Editor: Add e2e test."

This reverts commit 4d58c79.

Author: epiqueras

packages/edit-post/src/components/browser-url/index.js

@@ -42,10 +42,12 @@ export class BrowserURL extends Component {
 	}
 
 	componentDidUpdate( prevProps ) {
-		const { postId, postStatus, postType } = this.props;
+		const { postId, postStatus, postType, isSavingPost } = this.props;
 		const { historyId } = this.state;
 
-		if ( postStatus === 'trash' ) {
+		// Posts are still dirty while saving so wait for saving to finish
+		// to avoid the unsaved changes warning when trashing posts.
+		if ( postStatus === 'trash' && ! isSavingPost ) {
 			this.setTrashURL( postId, postType );
 			return;
 		}
@@ -92,12 +94,13 @@ export class BrowserURL extends Component {
 }
 
 export default withSelect( ( select ) => {
-	const { getCurrentPost } = select( 'core/editor' );
+	const { getCurrentPost, isSavingPost } = select( 'core/editor' );
 	const { id, status, type } = getCurrentPost();
 
 	return {
 		postId: id,
 		postStatus: status,
 		postType: type,
+		isSavingPost: isSavingPost(),
 	};
 } )( BrowserURL );

packages/editor/src/components/unsaved-changes-warning/index.js

@@ -27,9 +27,9 @@ class UnsavedChangesWarning extends Component {
 	 * @return {?string} Warning prompt message, if unsaved changes exist.
 	 */
 	warnIfUnsavedChanges( event ) {
-		const { isDirty } = this.props;
+		const { isEditedPostDirty } = this.props;
 
-		if ( isDirty ) {
+		if ( isEditedPostDirty() ) {
 			event.returnValue = __( 'You have unsaved changes. If you proceed, they will be lost.' );
 			return event.returnValue;
 		}
@@ -41,5 +41,9 @@ class UnsavedChangesWarning extends Component {
 }
 
 export default withSelect( ( select ) => ( {
-	isDirty: select( 'core/editor' ).isEditedPostDirty(),
+	// We need to call the selector directly in the listener to avoid race
+	// conditions with `BrowserURL` where `componentDidUpdate` gets the
+	// new value of `isEditedPostDirty` before this component does,
+	// causing this component to incorrectly think a trashed post is still dirty.
+	isEditedPostDirty: select( 'core/editor' ).isEditedPostDirty,
 } ) )( UnsavedChangesWarning );