From a5788e43acc8e604f720c228b8a7ecdd7c9865e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Thu, 23 Sep 2021 14:46:33 +0300
Subject: [PATCH] Add e2e test

---
 .../specs/editor/blocks/image.test.js         | 33 +++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/packages/e2e-tests/specs/editor/blocks/image.test.js b/packages/e2e-tests/specs/editor/blocks/image.test.js
index 3aed0fcb3310e3..a9cdfb89b13141 100644
--- a/packages/e2e-tests/specs/editor/blocks/image.test.js
+++ b/packages/e2e-tests/specs/editor/blocks/image.test.js
@@ -361,4 +361,37 @@ describe( 'Image', () => {
 		// broken temporary URL.
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
+
+	it( 'should align right and have visible toolbar', async () => {
+		await insertBlock( 'Image' );
+		const filename1 = await upload( '.wp-block-image input[type="file"]' );
+		await waitForImage( filename1 );
+
+		const regex1 = new RegExp(
+			`<!-- wp:image {"id":\\d+,"sizeSlug":"full","linkDestination":"none"} -->\\s*<figure class="wp-block-image size-full"><img src="[^"]+\\/${ filename1 }\\.png" alt="" class="wp-image-\\d+"/></figure>\\s*<!-- \\/wp:image -->`
+		);
+		expect( await getEditedPostContent() ).toMatch( regex1 );
+
+		await clickBlockToolbarButton( 'Align' );
+		await clickButton( 'Align right' );
+
+		const regex2 = new RegExp(
+			`<!-- wp:image {"align":"right","id":\\d+,"sizeSlug":"full","linkDestination":"none"} -->\\s*<div class="wp-block-image"><figure class="alignright size-full"><img src="[^"]+\\/${ filename1 }\\.png" alt="" class="wp-image-\\d+"/></figure></div>\\s*<!-- \\/wp:image -->`
+		);
+
+		expect( await getEditedPostContent() ).toMatch( regex2 );
+
+		// Ensure that the end of the toolbar is not hidden.
+		// The page should not have to scroll horizontall to access the toolbar.
+		// See: https://github.com/WordPress/gutenberg/pull/35082.
+		await clickBlockToolbarButton( 'Options' );
+
+		const scrollLeft = await page.evaluate( () => {
+			return wp.dom.getScrollContainer(
+				document.querySelector( '.wp-block' )
+			).scrollLeft;
+		} );
+
+		expect( scrollLeft ).toBe( 0 );
+	} );
 } );