diff --git a/packages/web-app-files/src/components/FilesList/ResourceDetails.vue b/packages/web-app-files/src/components/FilesList/ResourceDetails.vue
index 59043ebfe4a..5b96dfe13ab 100644
--- a/packages/web-app-files/src/components/FilesList/ResourceDetails.vue
+++ b/packages/web-app-files/src/components/FilesList/ResourceDetails.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="oc-flex oc-flex-column oc-flex-middle">
+  <div class="resource-details oc-flex oc-flex-column oc-flex-middle">
     <div class="oc-width-1-3@l oc-width-1-2@m oc-width-3-4">
       <file-info />
       <file-details class="oc-mb" />
diff --git a/packages/web-app-files/src/components/SideBar/Actions/SpaceActions.vue b/packages/web-app-files/src/components/SideBar/Actions/SpaceActions.vue
index f5ba5036b3f..893adbde626 100644
--- a/packages/web-app-files/src/components/SideBar/Actions/SpaceActions.vue
+++ b/packages/web-app-files/src/components/SideBar/Actions/SpaceActions.vue
@@ -4,7 +4,7 @@
       v-if="readmeContentModalIsOpen"
       :cancel="closeReadmeContentModal"
       :space="resources[0]"
-    ></readme-content-modal>
+    />
     <quota-modal v-if="quotaModalIsOpen" :cancel="closeQuotaModal" :spaces="[resources[0]]" />
     <input
       id="space-image-upload-input"
@@ -29,6 +29,8 @@
 </template>
 
 <script lang="ts">
+import { computed, ComputedRef, defineComponent, inject, unref } from 'vue'
+import { Resource, SpaceResource } from 'web-client'
 import ActionMenuItem from 'web-pkg/src/components/ContextActions/ActionMenuItem.vue'
 import Rename from 'web-pkg/src/mixins/spaces/rename'
 import Delete from 'web-pkg/src/mixins/spaces/delete'
@@ -42,8 +44,6 @@ import EditQuota from 'web-pkg/src/mixins/spaces/editQuota'
 import QuotaModal from 'web-pkg/src/components/Spaces/QuotaModal.vue'
 import ReadmeContentModal from 'web-pkg/src/components/Spaces/ReadmeContentModal.vue'
 import { thumbnailService } from '../../../services'
-import { computed, ComputedRef, defineComponent, inject, unref } from 'vue'
-import { Resource, SpaceResource } from 'web-client'
 
 export default defineComponent({
   name: 'SpaceActions',
diff --git a/tests/acceptance/features/webUIPreview/mediaPreview.feature b/tests/acceptance/features/webUIPreview/mediaPreview.feature
index 09d031ac664..7312d622c19 100644
--- a/tests/acceptance/features/webUIPreview/mediaPreview.feature
+++ b/tests/acceptance/features/webUIPreview/mediaPreview.feature
@@ -3,8 +3,8 @@ Feature: display image in preview app on the webUI
   Background:
     Given user "Alice" has been created with default attributes and without skeleton files in the server
 
-@ocisSmokeTest
-Scenario Outline: preview of image files with preview app is possible
+  @ocisSmokeTest
+  Scenario Outline: preview of image files with preview app is possible
     Given user "Alice" has uploaded file "<image-file>" to "<image-file>" in the server
     And user "Alice" has logged in using the webUI
     When the user views the file "<image-file>" in the preview app using the webUI
@@ -38,7 +38,7 @@ Scenario Outline: preview of image files with preview app is possible
     And user "Alice" has created a public link with following settings in the server
       | path | simple-empty-folder |
     When the public uses the webUI to access the last public link created by user "Alice" in a new session
-    And the public views the file "testavatar.jpg" in the preview app using the webUI
+    And the public views the single share file "testavatar.jpg" in the preview app using the webUI
     Then the file "testavatar.jpg" should be displayed in the preview app webUI
 
 
diff --git a/tests/acceptance/pageObjects/FilesPageElement/filesList.js b/tests/acceptance/pageObjects/FilesPageElement/filesList.js
index 1084e9382da..7031ffdf9eb 100644
--- a/tests/acceptance/pageObjects/FilesPageElement/filesList.js
+++ b/tests/acceptance/pageObjects/FilesPageElement/filesList.js
@@ -701,7 +701,7 @@ module.exports = {
     },
     anyAfterLoading: {
       selector:
-        '//*[self::table[contains(@class, "files-table")] or self::div[contains(@class, "files-empty")] or self::div[contains(@class, "files-not-found")]]',
+        '//*[self::table[contains(@class, "files-table")] or self::div[contains(@class, "files-empty")] or self::div[contains(@class, "files-not-found")] or self::div[contains(@class, "resource-details")]]',
       locateStrategy: 'xpath'
     },
     shareButtonInFileRow: {
diff --git a/tests/acceptance/pageObjects/FilesPageElement/previewPage.js b/tests/acceptance/pageObjects/FilesPageElement/previewPage.js
index eb44350c638..7e7327c613c 100644
--- a/tests/acceptance/pageObjects/FilesPageElement/previewPage.js
+++ b/tests/acceptance/pageObjects/FilesPageElement/previewPage.js
@@ -11,6 +11,10 @@ module.exports = {
 
       return this
     },
+    openPreviewFromDetailsView: async function (fileName) {
+      await filesActionsMenu.preview()
+      return this
+    },
     waitForPreviewLoaded: function (fileName) {
       const image = util.format(this.elements.mediaImage.selector, fileName)
       return this.useXpath().waitForElementVisible(image).useCss()
diff --git a/tests/acceptance/stepDefinitions/previewContext.js b/tests/acceptance/stepDefinitions/previewContext.js
index 3749ef776df..3b03c56d52f 100644
--- a/tests/acceptance/stepDefinitions/previewContext.js
+++ b/tests/acceptance/stepDefinitions/previewContext.js
@@ -20,6 +20,14 @@ When(
   }
 )
 
+When(
+  'the user/public views the single share file {string} in the preview app using the webUI',
+  async function (fileName) {
+    await previewPage.openPreviewFromDetailsView(fileName)
+    return previewPage.waitForPreviewLoaded(fileName)
+  }
+)
+
 When('the user navigates to the next media resource using the webUI', function () {
   return previewPage.nextMediaResource()
 })