Merge pull request #168 from xwp/fix/add-media-library-tests

Add e2e to for media library.

php/class-plugin.php

@@ -735,15 +735,15 @@ public function add_media_templates() { ?>
 				<div class="details">
 					<h2 class="screen-reader-text"><?php esc_html_e( 'Details' ); ?></h2>
 					<# if ( data.unsplashAuthorLink ) { #>
-						<div class="author"><strong><?php esc_html_e( 'Photo by', 'unsplash' ); ?>:</strong> <a href="{{ data.unsplashAuthorLink }}" target="_blank" rel="noopener noreferrer">{{ data.unsplashAuthor || data.author }}</a></div>
+						<div class="author unsplash-author-link"><strong><?php esc_html_e( 'Photo by', 'unsplash' ); ?>:</strong> <a href="{{ data.unsplashAuthorLink }}" target="_blank" rel="noopener noreferrer">{{ data.unsplashAuthor || data.author }}</a></div>
 					<# } #>
 
 					<div class="filename"><strong><?php esc_html_e( 'File name:' ); ?></strong> {{ data.filename }}</div>
 					<# if ( ! data.unsplashAuthorLink ) { #>
 					<div class="filename"><strong><?php esc_html_e( 'File type:' ); ?></strong> {{ data.mime }}</div>
 					<# } #>
 					<# if ( data.unsplashCreatedAt ) { #>
-					<div class="uploaded"><strong><?php esc_html_e( 'Date:' ); ?></strong> {{ data.unsplashCreatedAt }}</div>
+					<div class="uploaded unsplash-created-at"><strong><?php esc_html_e( 'Date:' ); ?></strong> {{ data.unsplashCreatedAt }}</div>
 					<# } #>
 					<div class="uploaded"><strong><?php esc_html_e( 'Uploaded on:' ); ?></strong> {{ data.dateFormatted }}</div>
 

tests/e2e/specs/media-library/media-library.spec.js

@@ -0,0 +1,36 @@
+/**
+ * WordPress dependencies
+ */
+import { visitAdminPage } from '@wordpress/e2e-test-utils';
+/**
+ * Internal dependencies
+ */
+import { UNSPLASH_MODAL } from '../../constants';
+
+const CONTAINER = '.attachments';
+
+describe( 'Media Library', () => {
+	beforeEach( async () => {
+		await visitAdminPage( 'upload.php', 'mode=grid' );
+		await page.waitForSelector( CONTAINER, {
+			visible: true,
+		} );
+	} );
+
+	it( 'attachment details has unsplash link', async () => {
+		const btnSelector =
+			CONTAINER + ' .attachment-preview.type-image:first-of-type';
+		await page.waitForSelector( btnSelector );
+		await page.evaluate( selector => {
+			document.querySelector( selector ).click();
+		}, btnSelector );
+
+		await page.waitForSelector( UNSPLASH_MODAL, {
+			visible: true,
+		} );
+
+		const blockClass = '.unsplash-author-link';
+		await page.waitForSelector( blockClass );
+		await expect( page ).toMatchElement( blockClass );
+	} );
+} );