V16 Added acceptance tests for the regression issue #16985 (#19712)

* Updated tests for adding a thumbnail to a block grid

* Added tests for adding a block thumbnail

* Make tests run in the pipeline

* Reverted npm command

Author: nhudinh0309

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/DataType/BlockGrid/Block/BlockGridBlockAdvanced.spec.ts

@@ -240,27 +240,27 @@ test('can remove a icon color from a block', async ({umbracoApi, umbracoUi}) =>
   expect(await umbracoApi.dataType.doesBlockEditorBlockContainIconColor(blockGridEditorName, contentElementTypeId, '')).toBeTruthy();
 });
 
-// TODO: Remove skip when the code is updated due to UI changes
-test.skip('can add a thumbnail to a block', async ({umbracoApi, umbracoUi}) => {
+test('can add a thumbnail to a block', {tag: '@smoke'}, async ({umbracoApi, umbracoUi}) => {
   // Arrange
   const mediaName = 'TestMedia';
   await umbracoApi.media.ensureNameNotExists(mediaName);
-  await umbracoApi.media.createDefaultMediaWithImage(mediaName);
+  const mediaId = await umbracoApi.media.createDefaultMediaWithImage(mediaName);
   const textStringData = await umbracoApi.dataType.getByName(dataTypeName);
   const contentElementTypeId = await umbracoApi.documentType.createDefaultElementType(elementTypeName, groupName, dataTypeName, textStringData.id);
   await umbracoApi.dataType.createBlockGridWithABlock(blockGridEditorName, contentElementTypeId);
-  const mediaUrl = await umbracoApi.media.getMediaPathByName(mediaName);
+  const mediaUrl = await umbracoApi.media.getMediaUrl(mediaId);
 
   // Act
   await umbracoUi.dataType.goToDataType(blockGridEditorName);
   await umbracoUi.dataType.goToBlockWithName(elementTypeName);
   await umbracoUi.dataType.goToBlockAdvancedTab();
-  await umbracoUi.dataType.chooseBlockThumbnailWithPath(mediaUrl.fileName, mediaUrl.mediaPath);
+  await umbracoUi.dataType.chooseBlockThumbnailWithPath(mediaUrl);
   await umbracoUi.dataType.clickSubmitButton();
   await umbracoUi.dataType.clickSaveButton();
 
   // Assert
   await umbracoUi.dataType.isSuccessStateVisibleForSaveButton();
+  await umbracoUi.dataType.doesBlockHaveThumbnailImage(mediaUrl);
 });
 
 // TODO: Remove skip when the code is updated. Currently it is missing the assertion steps

tests/Umbraco.Tests.AcceptanceTest/tests/DefaultConfig/DataType/BlockListEditor/BlockListBlocks.spec.ts

@@ -414,9 +414,26 @@ test('can disable hide content editor in a block', async ({umbracoApi, umbracoUi
   expect(blockData.values[0].value[0].forceHideContentEditorInOverlay).toEqual(false);
 });
 
-// TODO: Thumbnails are not showing in the UI
-test.skip('can add a thumbnail to a block ', {tag: '@smoke'}, async ({umbracoApi, umbracoUi}) => {
+test('can add a thumbnail to a block', {tag: '@release'}, async ({umbracoApi, umbracoUi}) => {
+  // Arrange
+  const mediaName = 'TestMedia';
+  await umbracoApi.media.ensureNameNotExists(mediaName);
+  const mediaId = await umbracoApi.media.createDefaultMediaWithImage(mediaName);
+  const textStringData = await umbracoApi.dataType.getByName(dataTypeName);
+  const contentElementTypeId = await umbracoApi.documentType.createDefaultElementType(elementTypeName, groupName, dataTypeName, textStringData.id);
+  await umbracoApi.dataType.createBlockListDataTypeWithABlock(blockListEditorName, contentElementTypeId);
+  const mediaUrl = await umbracoApi.media.getMediaUrl(mediaId);
 
+  // Act
+  await umbracoUi.dataType.goToDataType(blockListEditorName);
+  await umbracoUi.dataType.goToBlockWithName(elementTypeName);
+  await umbracoUi.dataType.chooseBlockThumbnailWithPath(mediaUrl);
+  await umbracoUi.dataType.clickSubmitButton();
+  await umbracoUi.dataType.clickSaveButton();
+
+  // Assert
+  await umbracoUi.dataType.isSuccessStateVisibleForSaveButton();
+  await umbracoUi.dataType.doesBlockHaveThumbnailImage(mediaUrl);
 });
 
 // TODO: Thumbnails are not showing in the UI