VideoPress: improve buildVideoPressURL(). Add tests. (#28465)

* [not verified] handle files.URLs

* [not verified] add tests for URL lib

* [not verified] buildVideoPressURL() return empty object

* change buildVideoPressURL() return value

* changelog

* escape . in the RegExp

* escape the second dot 🤦

projects/packages/videopress/changelog/update-videopress-add-url-tests

@@ -0,0 +1,4 @@
+Significance: patch
+Type: added
+
+VideoPress: improve buildVideoPressURL(). Add tests.

projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js

@@ -101,16 +101,15 @@ const VideoPressUploader = ( {
 	 */
 	function onSelectURL( videoSource, id ) {
 		// If the video source is a VideoPress URL, we can use it directly.
-		const videoUrlData = buildVideoPressURL( videoSource );
-		if ( ! videoUrlData ) {
+		const { guid: guidFromSource, url: srcFromSource } = buildVideoPressURL( videoSource );
+		if ( ! guidFromSource ) {
 			setUploadErrorDataState( {
 				data: { message: __( 'Invalid VideoPress URL', 'jetpack-videopress-pkg' ) },
 			} );
 			return;
 		}
 
-		setAttributes( { guid: videoUrlData.guid, src: videoUrlData.url, id } );
-		handleDoneUpload();
+		handleDoneUpload( { guid: guidFromSource, src: srcFromSource, id } );
 	}
 
 	const startUpload = file => {
@@ -185,8 +184,7 @@ const VideoPressUploader = ( {
 				? media.videopress_guid[ 0 ] // <- pick the first item when it's an array
 				: media.videopress_guid;
 
-			const videoUrl = `https://videopress.com/v/${ videoGuid }`;
-			onSelectURL( videoUrl, media?.id );
+			onSelectURL( videoGuid, media?.id );
 			return;
 		}
 
@@ -207,8 +205,7 @@ const VideoPressUploader = ( {
 						setIsUploadingInProgress( true );
 						startUploadFromLibrary( media.id );
 					} else if ( 'uploaded' === result.status ) {
-						const videoUrl = `https://videopress.com/v/${ result.uploaded_video_guid }`;
-						onSelectURL( videoUrl );
+						onSelectURL( result.uploaded_video_guid );
 					} else {
 						setUploadErrorDataState( {
 							data: {

projects/packages/videopress/src/client/block-editor/blocks/video/edit.tsx

@@ -527,14 +527,14 @@ export default function VideoPressEdit( {
 						} );
 					} }
 					onSelectURL={ videoSource => {
-						const videoUrlData = buildVideoPressURL( videoSource );
-						if ( ! videoUrlData ) {
+						const { guid: guidFromSource, url: srcFromSource } = buildVideoPressURL( videoSource );
+						if ( ! guidFromSource ) {
 							debug( 'Invalid URL. No video GUID  provided' );
 							return;
 						}
 
 						// Update guid based on the URL.
-						setAttributes( { guid: videoUrlData.guid, src: videoUrlData.url } );
+						setAttributes( { guid: guidFromSource, src: srcFromSource } );
 					} }
 				/>
 			</BlockControls>

projects/packages/videopress/src/client/lib/url/index.ts

@@ -71,8 +71,15 @@ export const pickGUIDFromUrl: ( url: string ) => null | string = url => {
 		return null;
 	}
 
+	/*
+	 * http://videopress.com/v/<guid>
+	 * http://videopress.com/embed/<guid>
+	 * http://video.videopress.com/v/<guid>
+	 * http://video.videopress.com/embed/<guid>
+	 * http://videos.files.wordpress.com/<guid>/<filename>.<extension>
+	 */
 	const urlParts = url.match(
-		/^https?:\/\/(?<host>video(?:\.word)?press\.com)\/(?:v|embed)\/(?<guid>[a-zA-Z\d]{8})/
+		/^https?:\/\/(?<host>video(?:\.word|s\.files\.word)?press\.com)(?:\/v|\/embed)?\/(?<guid>[a-zA-Z\d]{8})/
 	);
 
 	if ( ! urlParts?.groups?.guid ) {
@@ -97,6 +104,11 @@ export function isVideoPressGuid( value: string ): boolean | VideoGUID {
 	return guid[ 0 ];
 }
 
+type BuildVideoPressURLProps = {
+	url?: string;
+	guid?: VideoGUID;
+};
+
 /**
  * Build a VideoPress URL from a VideoPress GUID or a VideoPress URL.
  * The function returns an { url, guid } object, or false.
@@ -108,7 +120,7 @@ export function isVideoPressGuid( value: string ): boolean | VideoGUID {
 export function buildVideoPressURL(
 	value: string | VideoGUID,
 	attributes?: VideoPressUrlOptions
-): false | { url: string; guid: VideoGUID } {
+): BuildVideoPressURLProps {
 	const isGuidValue = isVideoPressGuid( value );
 	if ( isGuidValue ) {
 		if ( ! attributes ) {
@@ -123,7 +135,7 @@ export function buildVideoPressURL(
 		return { url: value, guid: isGuidFromUrl };
 	}
 
-	return false;
+	return {};
 }
 
 export const removeFileNameExtension = ( name: string ) => {

projects/packages/videopress/src/client/lib/url/test/index.ts

@@ -0,0 +1,64 @@
+/**
+ * Internal dependencies
+ */
+import { buildVideoPressURL } from '..';
+
+describe( 'buildVideoPressURL', () => {
+	it( 'should return empty object when invalid URL', () => {
+		const result = buildVideoPressURL( 'https://custom-domain.com/v/xyrdcYF4' );
+		expect( result ).toStrictEqual( {} );
+	} );
+
+	it( 'should return undefined GUID', () => {
+		const { guid } = buildVideoPressURL( 'https://custom-domain.com/v/xyrdcYF4' );
+		expect( guid ).toBeUndefined();
+	} );
+
+	it( 'should return undefined URL', () => {
+		const { url } = buildVideoPressURL( 'https://custom-domain.com/v/xyrdcYF4' );
+		expect( url ).toBeUndefined();
+	} );
+
+	it( 'should return for videopress.com/v/guid', () => {
+		const result = buildVideoPressURL( 'https://videopress.com/v/xyrdcYF4' );
+		expect( result ).toStrictEqual( {
+			url: 'https://videopress.com/v/xyrdcYF4',
+			guid: 'xyrdcYF4',
+		} );
+	} );
+
+	it( 'should return for videopress.com/embed/guid', () => {
+		const result = buildVideoPressURL( 'https://videopress.com/embed/xyrdcYF4' );
+		expect( result ).toStrictEqual( {
+			url: 'https://videopress.com/embed/xyrdcYF4',
+			guid: 'xyrdcYF4',
+		} );
+	} );
+
+	it( 'should return for video.wordpress.com/v/guid', () => {
+		const result = buildVideoPressURL( 'https://video.wordpress.com/v/xyrdcYF4' );
+		expect( result ).toStrictEqual( {
+			url: 'https://video.wordpress.com/v/xyrdcYF4',
+			guid: 'xyrdcYF4',
+		} );
+	} );
+
+	it( 'should return for video.wordpress.com/embed/guid', () => {
+		const result = buildVideoPressURL( 'https://video.wordpress.com/embed/xyrdcYF4' );
+		expect( result ).toStrictEqual( {
+			url: 'https://video.wordpress.com/embed/xyrdcYF4',
+			guid: 'xyrdcYF4',
+		} );
+	} );
+
+	it( 'should return for video.files.wordpress.com/guid/filename.ext', () => {
+		const result = buildVideoPressURL(
+			'https://videos.files.wordpress.com/xyrdcYF4/screen-recording-2023-01-13-at-08.21.53-1.mov'
+		);
+		expect( result ).toStrictEqual( {
+			url:
+				'https://videos.files.wordpress.com/xyrdcYF4/screen-recording-2023-01-13-at-08.21.53-1.mov',
+			guid: 'xyrdcYF4',
+		} );
+	} );
+} );