Merge branch 'feature/info-panel-history-update' of github.com:ONLYOFFICE/AppServer into feature/info-panel-history-update

2022-11-30 13:07:40 +03:00 · 2022-11-30 13:07:40 +03:00 · b96059c041
commit b96059c041
parent c6b4a076b6 e1e39de101
55 changed files with 388 additions and 67 deletions
--- a/.github/workflows/4testing-multi-build.yml
+++ b/.github/workflows/4testing-multi-build.yml
@ -2,7 +2,7 @@ name: 4testing multiarch-build

 on:
  push:
-    branches: [ "develop" ]
+    branches: [ "release/rc-v1.2.0" ]

 jobs:
  build:
@ -33,10 +33,10 @@ jobs:
          cd ./build/install/docker
          REPO="onlyoffice" \
          DOCKER_IMAGE_PREFIX="4testing-docspace" \
-          DOCKER_TAG="develop" \
+          DOCKER_TAG="rc-v1.2.0" \
          DOCKERFILE="Dockerfile.app" \
          docker buildx bake -f build.yml \
-          --set *.args.GIT_BRANCH="develop" \
+          --set *.args.GIT_BRANCH="release/rc-v1.2.0" \
          --set *.platform=linux/amd64 \
          --push
        shell: bash
--- a/build/build.document.server.docker.bat
+++ b/build/build.document.server.docker.bat
@ -0,0 +1,7 @@
+@echo off
+
+pwsh  %~dp0/build.document.server.docker.ps1 %1
+
+echo.
+
+pause
--- a/build/build.document.server.docker.ps1
+++ b/build/build.document.server.docker.ps1
@ -0,0 +1,15 @@
+$PSversionMajor = $PSVersionTable.PSVersion | sort-object major | ForEach-Object { $_.major }
+$PSversionMinor = $PSVersionTable.PSVersion | sort-object minor | ForEach-Object { $_.minor }
+  
+if ($PSversionMajor -lt 7 -or $PSversionMinor -lt 2) {
+  Write-Error "Powershell version must be greater than or equal to 7.2."
+  exit
+}
+
+$RootDir = Split-Path -Parent $PSScriptRoot
+
+Write-Host "Run Document server" -ForegroundColor Green
+$DOCUMENT_SERVER_IMAGE_NAME = "onlyoffice/documentserver-de:latest"
+
+
+docker run -i -t -d -p 8085:80 -e JWT_ENABLED=false -e JWT_IN_BODY=false --restart=always -v $RootDir/Data:/var/www/onlyoffice/Data $DOCUMENT_SERVER_IMAGE_NAME
--- a/common/ASC.Core.Common/Context/SecurityContext.cs
+++ b/common/ASC.Core.Common/Context/SecurityContext.cs
@ -161,8 +161,9 @@ public class SecurityContext
                return false;
            }

-            var settingLoginEvents = await _dbLoginEventsManager.GetLoginEventIds(tenant, userid); 
-            if (loginEventId != 0 && !settingLoginEvents.Contains(loginEventId))
+            var loginEventById = await _dbLoginEventsManager.GetById(loginEventId); 
+           
+            if (loginEventById == null)
            {
                return false;
            }
--- a/common/ASC.Core.Common/Data/DbLoginEventsManager.cs
+++ b/common/ASC.Core.Common/Data/DbLoginEventsManager.cs
@ -24,6 +24,8 @@
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode

+using System.ComponentModel;
+
 namespace ASC.Core.Data;

 [Scope]
@ -61,26 +63,22 @@ public class DbLoginEventsManager
        _dbContextFactory = dbContextFactory;
        _mapper = mapper;
    }
-
-    public async Task<List<int>> GetLoginEventIds(int tenantId, Guid userId)
+
+    public async Task<LoginEvent> GetById(int id)
    {
-        var date = DateTime.UtcNow.AddYears(-1);
+        if (id < 0) return null;

-        using var loginEventContext = _dbContextFactory.CreateDbContext();
-
-        var resultList = await loginEventContext.LoginEvents
-            .Where(r => r.TenantId == tenantId && r.UserId == userId && _loginActions.Contains(r.Action ?? 0) && r.Date >= date && r.Active)
-            .Select(r => r.Id)
-            .ToListAsync();
-
-        return resultList;
-    }
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+            
+        return await loginEventContext.LoginEvents.FindAsync(id);
+    }

    public async Task<List<BaseEvent>> GetLoginEvents(int tenantId, Guid userId)
    {
        var date = DateTime.UtcNow.AddYears(-1);

-        using var loginEventContext = _dbContextFactory.CreateDbContext();
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+
        var loginInfo = await loginEventContext.LoginEvents
            .Where(r => r.TenantId == tenantId && r.UserId == userId && _loginActions.Contains(r.Action ?? 0) && r.Date >= date && r.Active)
            .OrderByDescending(r => r.Id)
@ -91,7 +89,8 @@ public class DbLoginEventsManager

    public async Task LogOutEvent(int loginEventId)
    {
-        using var loginEventContext = _dbContextFactory.CreateDbContext();
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+
        var events = await loginEventContext.LoginEvents
           .Where(r => r.Id == loginEventId)
           .ToListAsync();
@ -108,7 +107,8 @@ public class DbLoginEventsManager

    public async Task LogOutAllActiveConnections(int tenantId, Guid userId)
    {
-        using var loginEventContext = _dbContextFactory.CreateDbContext();
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+
        var events = await loginEventContext.LoginEvents
              .Where(r => r.TenantId == tenantId && r.UserId == userId && r.Active)
              .ToListAsync();
@ -125,7 +125,8 @@ public class DbLoginEventsManager

    public async Task LogOutAllActiveConnectionsForTenant(int tenantId)
    {
-        using var loginEventContext = _dbContextFactory.CreateDbContext();
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+        
        var events = await loginEventContext.LoginEvents
              .Where(r => r.TenantId == tenantId && r.Active)
              .ToListAsync();
@ -140,7 +141,8 @@ public class DbLoginEventsManager

    public async Task LogOutAllActiveConnectionsExceptThis(int loginEventId, int tenantId, Guid userId)
    {
-        using var loginEventContext = _dbContextFactory.CreateDbContext();
+        using var loginEventContext = await _dbContextFactory.CreateDbContextAsync();
+        
        var events = await loginEventContext.LoginEvents
            .Where(r => r.TenantId == tenantId && r.UserId == userId && r.Id != loginEventId && r.Active)
            .ToListAsync();
--- a/common/ASC.Data.Backup.Core/ASC.Data.Backup.Core.csproj
+++ b/common/ASC.Data.Backup.Core/ASC.Data.Backup.Core.csproj
@ -19,7 +19,7 @@
      <PrivateAssets>all</PrivateAssets>
      <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
    </PackageReference>
-    <PackageReference Include="MySql.Data" Version="8.0.30" />
+    <PackageReference Include="MySql.Data" Version="8.0.31" />
    <PackageReference Include="protobuf-net" Version="3.1.17" />
  </ItemGroup>
  <ItemGroup>
--- a/config/appsettings.json
+++ b/config/appsettings.json
@ -125,7 +125,7 @@
    "ConnectionStrings": {
        "default": {
            "name": "default",
-            "connectionString": "Server=localhost;Database=onlyoffice;User ID=dev;Password=dev;Pooling=true;Character Set=utf8;AutoEnlist=false;SSL Mode=none;AllowPublicKeyRetrieval=True;ConnectionReset=false",
+            "connectionString": "Server=localhost;Database=onlyoffice;User ID=dev;Password=dev;Pooling=true;Character Set=utf8;AutoEnlist=false;SSL Mode=none;AllowPublicKeyRetrieval=True;Connection Timeout=30;Maximum Pool Size=300;ConnectionReset=false",
            "providerName": "MySql.Data.MySqlClient"
        },
        "postgre": {
@ -135,7 +135,7 @@
        },
        "mysql": {
            "name": "mysql",
-            "connectionString": "Server=localhost;Database=onlyoffice;User ID=dev;Password=dev;Pooling=true;Character Set=utf8;AutoEnlist=false;SSL Mode=none;AllowPublicKeyRetrieval=True;ConnectionReset=false",
+            "connectionString": "Server=localhost;Database=onlyoffice;User ID=dev;Password=dev;Pooling=true;Character Set=utf8;AutoEnlist=false;SSL Mode=none;AllowPublicKeyRetrieval=True;Connection Timeout=30;Maximum Pool Size=300;ConnectionReset=false",
            "providerName": "MySql.Data.MySqlClient"
        }
    },
--- a/packages/client/src/components/dialogs/ArchiveDialog/index.js
+++ b/packages/client/src/components/dialogs/ArchiveDialog/index.js
@ -89,6 +89,14 @@ const ArchiveDialogComponent = (props) => {
  const acceptButton =
    action === "archive" ? t("Common:OKButton") : t("Common:Restore");

+  const isArchive = action === "archive";
+  const idButtonSubmit = isArchive
+    ? "shared_move-to-archived-modal_submit"
+    : "restore-all_submit";
+  const idButtonCancel = isArchive
+    ? "shared_move-to-archived-modal_cancel"
+    : "restore-all_cancel";
+
  return (
    <StyledModal
      isLoading={!tReady}
@ -102,6 +110,7 @@ const ArchiveDialogComponent = (props) => {
      </ModalDialog.Body>
      <ModalDialog.Footer>
        <Button
+          id={idButtonSubmit}
          key="OkButton"
          label={acceptButton}
          size="normal"
@ -111,6 +120,7 @@ const ArchiveDialogComponent = (props) => {
          scale
        />
        <Button
+          id={idButtonCancel}
          key="CancelButton"
          label={t("Common:CancelButton")}
          size="normal"
--- a/packages/client/src/components/dialogs/ChangeUserStatusDialog/index.js
+++ b/packages/client/src/components/dialogs/ChangeUserStatusDialog/index.js
@ -98,6 +98,7 @@ class ChangeUserStatusDialogComponent extends React.Component {
        </ModalDialog.Body>
        <ModalDialog.Footer>
          <Button
+            id="change-user-status-modal_submit"
            label={t("ChangeUsersStatusButton")}
            size="normal"
            primary
@ -107,6 +108,7 @@ class ChangeUserStatusDialogComponent extends React.Component {
            isDisabled={userIDs.length === 0}
          />
          <Button
+            id="change-user-status-modal_cancel"
            label={t("Common:CancelButton")}
            size="normal"
            scale
--- a/packages/client/src/components/dialogs/ChangeUserTypeDialog/index.js
+++ b/packages/client/src/components/dialogs/ChangeUserTypeDialog/index.js
@ -109,6 +109,7 @@ class ChangeUserTypeDialogComponent extends React.Component {
        </ModalDialog.Body>
        <ModalDialog.Footer>
          <Button
+            id="change-user-type-modal_submit"
            label={t("ChangeUserTypeButton")}
            size="normal"
            scale
@ -118,6 +119,7 @@ class ChangeUserTypeDialogComponent extends React.Component {
            isDisabled={!userIDs.length}
          />
          <Button
+            id="change-user-type-modal_cancel"
            label={t("Common:CancelButton")}
            size="normal"
            scale
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/CreateRoomDialog.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/CreateRoomDialog.js
@ -149,6 +149,7 @@ const CreateRoomDialog = ({
      {!!roomParams.type && (
        <ModalDialog.Footer>
          <Button
+            id="shared_create-room-modal_submit"
            tabIndex={5}
            label={t("Common:Create")}
            size="normal"
@ -158,6 +159,7 @@ const CreateRoomDialog = ({
            isLoading={isLoading}
          />
          <Button
+            id="shared_create-room-modal_cancel"
            tabIndex={5}
            label={t("Common:CancelButton")}
            size="normal"
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/data/index.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/data/index.js
@ -2,6 +2,7 @@ import { RoomsType } from "@docspace/common/constants";

 export const roomTypes = [
  {
+    id: "shared_filling-forms-room",
    type: RoomsType.FillingFormsRoom,
    title: "FillingFormsRoomTitle",
    description: "FillingFormsRoomDescription",
@ -10,6 +11,7 @@ export const roomTypes = [
    secondaryInfo: "FillingFormsRoomSecondaryInfo",
  },
  {
+    id: "shared_collaboration-room",
    type: RoomsType.EditingRoom,
    title: "CollaborationRoomTitle",
    description: "CollaborationRoomDescription",
@ -18,6 +20,7 @@ export const roomTypes = [
    secondaryInfo: "CollaborationRoomSecondaryInfo",
  },
  {
+    id: "shared_review-room",
    type: RoomsType.ReviewRoom,
    title: "ReviewRoomTitle",
    description: "ReviewRoomDescription",
@ -26,6 +29,7 @@ export const roomTypes = [
    secondaryInfo: "ReviewRoomSecondaryInfo",
  },
  {
+    id: "shared_read-only-room",
    type: RoomsType.ReadOnlyRoom,
    title: "ViewOnlyRoomTitle",
    description: "ViewOnlyRoomDescription",
@ -34,6 +38,7 @@ export const roomTypes = [
    secondaryInfo: "ViewOnlyRoomSecondaryInfo",
  },
  {
+    id: "shared_custom-room",
    type: RoomsType.CustomRoom,
    title: "CustomRoomTitle",
    description: "CustomRoomDescription",
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/Params/ToggleParam.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/Params/ToggleParam.js
@ -21,7 +21,13 @@ const StyledToggleParam = styled(StyledParam)`
  }
 `;

-const ToggleParam = ({ title, description, isChecked, onCheckedChange }) => {
+const ToggleParam = ({
+  id,
+  title,
+  description,
+  isChecked,
+  onCheckedChange,
+}) => {
  return (
    <StyledToggleParam isPrivate>
      <div className="set_room_params-info">
@ -31,6 +37,7 @@ const ToggleParam = ({ title, description, isChecked, onCheckedChange }) => {
        <div className="set_room_params-info-description">{description}</div>
      </div>
      <ToggleButton
+        id={id}
        className="set_room_params-toggle"
        isChecked={isChecked}
        onChange={onCheckedChange}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomType.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomType.js
@ -131,7 +131,15 @@ const StyledDisplayItem = styled(StyledRoomType)`
  }
 `;

-const RoomType = ({ t, room, onClick, type = "listItem", isOpen }) => {
+const RoomType = ({
+  t,
+  room,
+  onClick,
+  type = "listItem",
+  isOpen,
+  id,
+  selectedId,
+}) => {
  const arrowClassName =
    type === "dropdownButton"
      ? "choose_room-forward_btn dropdown-button"
@ -170,23 +178,37 @@ const RoomType = ({ t, room, onClick, type = "listItem", isOpen }) => {
  );

  return type === "listItem" ? (
-    <StyledListItem title={t(room.title)} onClick={onClick}>
+    <StyledListItem id={id} title={t(room.title)} onClick={onClick}>
      {content}
    </StyledListItem>
  ) : type === "dropdownButton" ? (
    <StyledDropdownButton
+      id={id}
      title={t(room.title)}
      onClick={onClick}
      isOpen={isOpen}
+      data-selected-id={selectedId}
    >
      {content}
    </StyledDropdownButton>
  ) : type === "dropdownItem" ? (
-    <StyledDropdownItem title={t(room.title)} onClick={onClick} isOpen={isOpen}>
+    <StyledDropdownItem
+      id={id}
+      title={t(room.title)}
+      onClick={onClick}
+      isOpen={isOpen}
+      data-selected-id={selectedId}
+    >
      {content}
    </StyledDropdownItem>
  ) : (
-    <StyledDisplayItem title={t(room.title)}>{content}</StyledDisplayItem>
+    <StyledDisplayItem
+      id={id}
+      title={t(room.title)}
+      data-selected-id={selectedId}
+    >
+      {content}
+    </StyledDisplayItem>
  );
 };

--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/DropdownDesktop.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/DropdownDesktop.js
@ -41,6 +41,7 @@ const DropdownDesktop = ({ t, open, roomTypes, chooseRoomType }) => {
      <div className="dropdown-content">
        {roomTypes.map((room) => (
          <RoomType
+            id={room.id}
            t={t}
            key={room.type}
            room={room}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/DropdownMobile.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/DropdownMobile.js
@ -72,6 +72,7 @@ const DropdownMobile = ({ t, open, onClose, roomTypes, chooseRoomType }) => {
            <div className="dropdown-mobile-content">
              {roomTypes.map((room) => (
                <RoomType
+                  id={room.id}
                  t={t}
                  key={room.type}
                  room={room}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/index.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeDropdown/index.js
@ -37,11 +37,12 @@ const RoomTypeDropdown = ({
    setRoomType(roomType);
    toggleDropdown();
  };
-
  return (
    <StyledRoomTypeDropdown isOpen={isOpen}>
      <RoomType
        t={t}
+        id="shared_select-room"
+        selectedId={currentRoom.id}
        room={currentRoom}
        type="dropdownButton"
        isOpen={isOpen}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeList.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/RoomTypeList.js
@ -21,6 +21,7 @@ const RoomTypeList = ({ t, setRoomType }) => {
    <StyledRoomTypeList>
      {roomTypes.map((room) => (
        <RoomType
+          id={room.id}
          t={t}
          key={room.type}
          room={room}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/SetRoomParams.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/SetRoomParams.js
@ -74,7 +74,7 @@ const SetRoomParams = ({
      )}

      <InputParam
-        id={"room-name"}
+        id="shared_room-name"
        title={`${t("Common:Name")}:`}
        placeholder={t("NamePlaceholder")}
        value={roomParams.title}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/TagInput/TagDropdown.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/TagInput/TagDropdown.js
@ -19,7 +19,9 @@ const TagDropdown = ({
  const [dropdownMaxHeight, setDropdownMaxHeight] = useState(0);

  useEffect(() => {
-    document.getElementById("tags-input").addEventListener("keyup", onKeyPress);
+    document
+      .getElementById("shared_tags-input")
+      .addEventListener("keyup", onKeyPress);

    return () => document.removeEventListener("keyup", onKeyPress);
  });
@ -39,7 +41,7 @@ const TagDropdown = ({
  };

  const onClickOutside = () => {
-    document.getElementById("tags-input").blur();
+    document.getElementById("shared_tags-input").blur();
  };

  const addNewTag = () => {
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/TagInput/index.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/TagInput/index.js
@ -50,7 +50,7 @@ const TagInput = ({
  return (
    <StyledTagInput className="set_room_params-input set_room_params-tag_input">
      <InputParam
-        id={"tags-input"}
+        id="shared_tags-input"
        title={`${t("Common:Tags")}:`}
        placeholder={t("TagsPlaceholder")}
        value={tagInput}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/ThirdPartyComboBox.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/ThirdPartyComboBox.js
@ -221,6 +221,7 @@ const ThirdPartyComboBox = ({
    <StyledStorageLocation isOpen={isOpen}>
      <div className="set_room_params-thirdparty">
        <div
+          id="shared_third-party-storage_combobox"
          className="set_room_params-thirdparty-combobox"
          onClick={toggleIsOpen}
        >
@ -235,6 +236,7 @@ const ThirdPartyComboBox = ({
        </div>

        <Button
+          id="shared_third-party-storage_connect"
          isDisabled={
            !storageLocation?.provider ||
            !!storageLocation?.thirdpartyAccount ||
@ -262,7 +264,8 @@ const ThirdPartyComboBox = ({
        >
          {thirdparties.map((thirdparty) => (
            <DropDownItem
-              className="dropdown-item"
+              id={thirdparty.id}
+              className={`dropdown-item ${thirdparty.className ?? ""}`}
              label={thirdparty.title}
              key={thirdparty.id}
              height={32}
--- a/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/index.js
+++ b/packages/client/src/components/dialogs/CreateEditRoomDialog/sub-components/ThirdPartyStorage/index.js
@ -90,6 +90,7 @@ const ThirdPartyStorage = ({
  return (
    <StyledThirdPartyStorage>
      <ToggleParam
+        id="shared_third-party-storage-toggle"
        title={t("ThirdPartyStorageTitle")}
        description={t("ThirdPartyStorageDescription")}
        isChecked={storageLocation.isThirdparty}
@ -188,6 +189,7 @@ export default inject(
        (item) =>
          item && {
            id: item[0],
+            className: `storage_${item[0].toLowerCase()}`,
            providerKey: item[0],
            isOauth: item.length > 1 && item[0] !== "WebDav",
            oauthHref: item.length > 1 && item[0] !== "WebDav" ? item[1] : "",
--- a/packages/client/src/components/dialogs/DeleteDialog/index.js
+++ b/packages/client/src/components/dialogs/DeleteDialog/index.js
@ -159,6 +159,7 @@ const DeleteDialogComponent = (props) => {
      </ModalDialog.Body>
      <ModalDialog.Footer>
        <Button
+          id="delete-file-modal_submit"
          key="OkButton"
          label={accessButtonLabel}
          size="normal"
@ -171,6 +172,7 @@ const DeleteDialogComponent = (props) => {
          isDisabled={!selection.length}
        />
        <Button
+          id="delete-file-modal_cancel"
          key="CancelButton"
          label={t("Common:CancelButton")}
          size="normal"
--- a/packages/client/src/components/dialogs/EmptyTrashDialog/index.js
+++ b/packages/client/src/components/dialogs/EmptyTrashDialog/index.js
@ -77,6 +77,7 @@ const EmptyTrashDialogComponent = (props) => {
      </ModalDialog.Body>
      <ModalDialog.Footer>
        <Button
+          id="empty-archive_delete-submit"
          key="OkButton"
          label={t("DeleteForeverButton")}
          size="normal"
@ -86,6 +87,7 @@ const EmptyTrashDialogComponent = (props) => {
          scale
        />
        <Button
+          id="empty-archive_delete-cancel"
          key="CancelButton"
          label={t("Common:CancelButton")}
          size="normal"
--- a/packages/client/src/components/dialogs/SendInviteDialog/index.js
+++ b/packages/client/src/components/dialogs/SendInviteDialog/index.js
@ -129,6 +129,7 @@ class SendInviteDialogComponent extends React.Component {
        </ModalDialog.Body>
        <ModalDialog.Footer>
          <Button
+            id="send-inite-again-modal_submit"
            label={t("Common:SendButton")}
            size="normal"
            scale
@ -138,6 +139,7 @@ class SendInviteDialogComponent extends React.Component {
            isDisabled={!userIds.length}
          />
          <Button
+            id="send-inite-again-modal_cancel"
            label={t("Common:CancelButton")}
            size="normal"
            scale
--- a/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js
+++ b/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js
@ -134,6 +134,7 @@ const SelectionPanelBody = ({

        <div>
          <Button
+            id="select-file-modal-submit"
            theme={theme}
            className="select-file-modal-dialog-buttons-save"
            primary
@ -153,6 +154,7 @@ const SelectionPanelBody = ({
            isLoading={isDisableTree}
          />
          <Button
+            id="select-file-modal-cancel"
            theme={theme}
            className="modal-dialog-button"
            size="normal"
--- a/packages/client/src/pages/AccountsHome/Section/Header/index.js
+++ b/packages/client/src/pages/AccountsHome/Section/Header/index.js
@ -159,7 +159,7 @@ const SectionHeaderContent = (props) => {
    getHeaderMenu,
    cbMenuItems,
    getCheckboxItemLabel,
-
+    getMenuItemId,
    setInfoPanelIsVisible,
    isInfoPanelVisible,
    isOwner,
@ -186,8 +186,10 @@ const SectionHeaderContent = (props) => {
      <>
        {cbMenuItems.map((key) => {
          const label = getCheckboxItemLabel(t, key);
+          const id = getMenuItemId(key);
          return (
            <DropDownItem
+              id={id}
              key={key}
              label={label}
              data-key={key}
@ -226,7 +228,7 @@ const SectionHeaderContent = (props) => {
  const getContextOptions = () => {
    return [
      isOwner && {
-        id: "main-button_administrator",
+        id: "accounts-add_administrator",
        className: "main-button_drop-down",
        icon: "/static/images/person.admin.react.svg",
        label: t("Common:DocSpaceAdmin"),
@ -235,7 +237,7 @@ const SectionHeaderContent = (props) => {
        key: "administrator",
      },
      {
-        id: "main-button_manager",
+        id: "accounts-add_manager",
        className: "main-button_drop-down",
        icon: "/static/images/person.manager.react.svg",
        label: t("Common:RoomAdmin"),
@ -244,7 +246,7 @@ const SectionHeaderContent = (props) => {
        key: "manager",
      },
      {
-        id: "main-button_user",
+        id: "accounts-add_user",
        className: "main-button_drop-down",
        icon: "/static/images/person.user.react.svg",
        label: t("Common:User"),
@ -257,7 +259,7 @@ const SectionHeaderContent = (props) => {
        isSeparator: true,
      },
      {
-        id: "main-button_invite-again",
+        id: "accounts-add_invite-again",
        className: "main-button_drop-down",
        icon: "/static/images/invite.again.react.svg",
        label: t("LblInviteAgain"),
@ -296,6 +298,7 @@ const SectionHeaderContent = (props) => {
              {t("Accounts")}
            </Headline>
            <ContextMenuButton
+              id="header_add-button"
              className="action-button"
              directionX="left"
              title={t("Common:Actions")}
@ -314,6 +317,7 @@ const SectionHeaderContent = (props) => {
                ) && (
                  <div className="info-panel-toggle-bg">
                    <IconButton
+                      id="info-panel-toggle--open"
                      className="info-panel-toggle"
                      iconName="images/panel.react.svg"
                      size="16"
@ -349,6 +353,7 @@ export default withRouter(
      isHeaderIndeterminate,
      isHeaderChecked,
      cbMenuItems,
+      getMenuItemId,
      getCheckboxItemLabel,
    } = headerMenuStore;

@ -361,6 +366,7 @@ export default withRouter(
      isHeaderChecked,
      getHeaderMenu,
      cbMenuItems,
+      getMenuItemId,
      getCheckboxItemLabel,
      setInfoPanelIsVisible,
      isInfoPanelVisible,
--- a/packages/client/src/pages/Home/InfoPanel/Body/helpers/DetailsHelper.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/helpers/DetailsHelper.js
@ -73,11 +73,43 @@ class DetailsHelper {
  getPropertyList = () => {
    return this.getNeededProperties().map((propertyId) => ({
      id: propertyId,
+      className: this.getPropertyClassName(propertyId),
      title: this.getPropertyTitle(propertyId),
      content: this.getPropertyContent(propertyId),
    }));
  };

+  getPropertyClassName = (propertyId) => {
+    switch (propertyId) {
+      case "Owner":
+        return "info_details_owner";
+      case "Location":
+        return "info_details_location";
+      case "Type":
+        return "info_details_type";
+      case "Storage Type":
+        return "info_details_storage-type";
+      case "File extension":
+        return "info_details_file-extension";
+      case "Content":
+        return "info_details_content";
+      case "Size":
+        return "info_details_size";
+      case "Date modified":
+        return "info_details_date_modified";
+      case "Last modified by":
+        return "info_details_last-modified-by";
+      case "Creation date":
+        return "info_details_creation-date";
+      case "Versions":
+        return "info_details_versions";
+      case "Comments":
+        return "info_details_comments";
+      case "Tags":
+        return "info_details_tags";
+    }
+  };
+
  getNeededProperties = () => {
    return (this.item.isRoom
      ? [
--- a/packages/client/src/pages/Home/InfoPanel/Body/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/index.js
@ -69,11 +69,11 @@ const InfoPanelBodyContent = ({
    if (isAccounts) return viewHelper.AccountsView();

    switch (isRooms ? roomsView : fileView) {
-      case "members":
+      case "info_members":
        return viewHelper.MembersView();
-      case "history":
+      case "info_history":
        return viewHelper.HistoryView();
-      case "details":
+      case "info_details":
        return viewHelper.DetailsView();
    }
  };
--- a/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/AccountsItemTitle.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/AccountsItemTitle.js
@ -71,7 +71,11 @@ const AccountsItemTitle = ({
        )}
      </div>
      {!!contextOptions.length && (
-        <ContextMenuButton className="context-button" getData={getData} />
+        <ContextMenuButton
+          id="info-accounts-options"
+          className="context-button"
+          getData={getData}
+        />
      )}
    </StyledAccountsItemTitle>
  );
--- a/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/ItemContextOptions.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/ItemContextOptions.js
@ -71,6 +71,7 @@ const ItemContextOptions = ({
      />
      {options?.length > 0 && (
        <ContextMenuButton
+          id="info-options"
          className="expandButton"
          title={"Show item actions"}
          onClick={onContextMenu}
--- a/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/sub-components/ItemTitle/index.js
@ -35,7 +35,7 @@ const ItemTitle = ({
  const filesItemSelection =
    isRooms &&
    !isSeveralItems &&
-    roomsView === "members" &&
+    roomsView === "info_members" &&
    !selection.isRoom &&
    !!selectionParentRoom
      ? selectionParentRoom
--- a/packages/client/src/pages/Home/InfoPanel/Body/views/Accounts/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/views/Accounts/index.js
@ -58,18 +58,21 @@ const Accounts = ({
    const options = [];

    const adminOption = {
+      id: "info-account-type_docspace-admin",
      key: "admin",
      title: t("Common:DocSpaceAdmin"),
      label: t("Common:DocSpaceAdmin"),
      action: "admin",
    };
    const managerOption = {
+      id: "info-account-type_room-admin",
      key: "manager",
      title: t("Common:RoomAdmin"),
      label: t("Common:RoomAdmin"),
      action: "manager",
    };
    const userOption = {
+      id: "info-account-type_user",
      key: "user",
      title: t("Common:User"),
      label: t("Common:User"),
@ -99,6 +102,7 @@ const Accounts = ({

    const combobox = (
      <ComboBox
+        id="info-account-type-select"
        className="type-combobox"
        selectedOption={
          typesOptions.find((option) => option.key === role) || {}
--- a/packages/client/src/pages/Home/InfoPanel/Body/views/Details/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/views/Details/index.js
@ -85,7 +85,11 @@ const Details = ({
      <StyledProperties>
        {itemProperties.map((property) => {
          return (
-            <div key={property.title} className="property">
+            <div
+              id={property.id}
+              key={property.title}
+              className={`property ${property.className}`}
+            >
              <Text className="property-title">{property.title}</Text>
              {property.content}
            </div>
--- a/packages/client/src/pages/Home/InfoPanel/Body/views/Members/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Body/views/Members/index.js
@ -130,6 +130,7 @@ const Members = ({
        </Text>
        {canInviteUserInRoomAbility && (
          <IconButton
+            id="info_add-user"
            className={"icon"}
            title={t("Common:AddUsers")}
            iconName="/static/images/person+.react.svg"
--- a/packages/client/src/pages/Home/InfoPanel/Header/index.js
+++ b/packages/client/src/pages/Home/InfoPanel/Header/index.js
@ -47,27 +47,27 @@ const InfoPanelHeaderContent = (props) => {

  const closeInfoPanel = () => setIsVisible(false);

-  const setMembers = () => setView("members");
-  const setHistory = () => setView("history");
-  const setDetails = () => setView("details");
+  const setMembers = () => setView("info_members");
+  const setHistory = () => setView("info_history");
+  const setDetails = () => setView("info_details");

  const isArchiveRoot = rootFolderType === FolderType.Archive;

  const submenuData = [
    {
-      id: "members",
+      id: "info_members",
      name: t("InfoPanel:SubmenuMembers"),
      onClick: setMembers,
      content: null,
    },
    {
-      id: "history",
+      id: "info_history",
      name: t("InfoPanel:SubmenuHistory"),
      onClick: setHistory,
      content: null,
    },
    {
-      id: "details",
+      id: "info_details",
      name: t("InfoPanel:SubmenuDetails"),
      onClick: setDetails,
      content: null,
@ -100,6 +100,7 @@ const InfoPanelHeaderContent = (props) => {
          {!isTablet && (
            <div className="info-panel-toggle-bg">
              <IconButton
+                id="info-panel-toggle--close"
                className="info-panel-toggle"
                iconName="images/panel.react.svg"
                size="16"
--- a/packages/client/src/pages/Home/Section/Header/index.js
+++ b/packages/client/src/pages/Home/Section/Header/index.js
@ -136,35 +136,41 @@ class SectionHeaderContent extends React.Component {
        ]
      : [
          {
+            id: "personal_new-documnet",
            key: "new-document",
            label: t("NewDocument"),
            onClick: this.createDocument,
            icon: "images/actions.documents.react.svg",
          },
          {
+            id: "personal_new-spreadsheet",
            key: "new-spreadsheet",
            label: t("NewSpreadsheet"),
            onClick: this.createSpreadsheet,
            icon: "images/spreadsheet.react.svg",
          },
          {
+            id: "personal_new-presentation",
            key: "new-presentation",
            label: t("NewPresentation"),
            onClick: this.createPresentation,
            icon: "images/actions.presentation.react.svg",
          },
          {
+            id: "personal_form-template",
            icon: "images/form.react.svg",
            label: t("Translations:NewForm"),
            key: "new-form-base",
            items: [
              {
+                id: "personal_template_black",
                key: "new-form",
                label: t("Translations:SubNewForm"),
                icon: "images/form.blank.react.svg",
                onClick: this.createForm,
              },
              {
+                id: "personal_template_new-form-file",
                key: "new-form-file",
                label: t("Translations:SubNewFormFile"),
                icon: "images/form.file.react.svg",
@ -172,6 +178,7 @@ class SectionHeaderContent extends React.Component {
                disabled: isPrivacyFolder,
              },
              {
+                id: "personal_template_oforms-gallery",
                key: "oforms-gallery",
                label: t("Common:OFORMsGallery"),
                icon: "images/form.gallery.react.svg",
@ -181,6 +188,7 @@ class SectionHeaderContent extends React.Component {
            ],
          },
          {
+            id: "personal_new-folder",
            key: "new-folder",
            label: t("NewFolder"),
            onClick: this.createFolder,
@ -355,6 +363,7 @@ class SectionHeaderContent extends React.Component {
    if (isArchiveFolder) {
      return [
        {
+          id: "header_option_empty-archive",
          key: "empty-archive",
          label: t("ArchiveAction"),
          onClick: this.onEmptyTrashAction,
@ -362,6 +371,7 @@ class SectionHeaderContent extends React.Component {
          icon: "images/clear.trash.react.svg",
        },
        {
+          id: "header_option_restore-all",
          key: "restore-all",
          label: t("RestoreAll"),
          onClick: this.onRestoreAllArchiveAction,
@ -373,6 +383,7 @@ class SectionHeaderContent extends React.Component {

    return [
      {
+        id: "header_option_sharing-settings",
        key: "sharing-settings",
        label: t("SharingPanel:SharingSettingsTitle"),
        onClick: this.onOpenSharingPanel,
@ -380,6 +391,7 @@ class SectionHeaderContent extends React.Component {
        icon: "/static/images/share.react.svg",
      },
      {
+        id: "header_option_link-portal-users",
        key: "link-portal-users",
        label: t("LinkForPortalUsers"),
        onClick: this.createLinkForPortalUsers,
@ -387,6 +399,7 @@ class SectionHeaderContent extends React.Component {
        icon: "/static/images/invitation.link.react.svg",
      },
      {
+        id: "header_option_empty-trash",
        key: "empty-trash",
        label: t("RecycleBinAction"),
        onClick: this.onEmptyTrashAction,
@ -394,6 +407,7 @@ class SectionHeaderContent extends React.Component {
        icon: "images/clear.trash.react.svg",
      },
      {
+        id: "header_option_restore-all",
        key: "restore-all",
        label: t("RestoreAll"),
        onClick: this.onRestoreAllAction,
@ -401,6 +415,7 @@ class SectionHeaderContent extends React.Component {
        icon: "images/subtract.react.svg",
      },
      {
+        id: "header_option_show-info",
        key: "show-info",
        label: t("InfoPanel:ViewDetails"),
        onClick: this.onShowInfo,
@ -408,6 +423,7 @@ class SectionHeaderContent extends React.Component {
        icon: "/static/images/info.outline.react.svg",
      },
      {
+        id: "header_option_reconnect-storage",
        key: "reconnect-storage",
        label: t("Common:ReconnectStorage"),
        icon: "images/reconnect.svg",
@ -415,6 +431,7 @@ class SectionHeaderContent extends React.Component {
        disabled: !selectedFolder.providerKey || !isRoom,
      },
      {
+        id: "header_option_edit-room",
        key: "edit-room",
        label: t("EditRoom"),
        icon: "images/settings.react.svg",
@ -422,6 +439,7 @@ class SectionHeaderContent extends React.Component {
        disabled: !isRoom,
      },
      {
+        id: "header_option_invite-users-to-room",
        key: "invite-users-to-room",
        label: t("InviteUsers"),
        icon: "/static/images/person.react.svg",
@ -429,14 +447,21 @@ class SectionHeaderContent extends React.Component {
        disabled: !isRoom,
      },
      {
+        id: "header_option_room-info",
        key: "room-info",
        label: t("Common:Info"),
        icon: "/static/images/info.outline.react.svg",
        onClick: this.onToggleInfoPanel,
        disabled: !isRoom,
      },
-      { key: "separator-2", isSeparator: true, disabled: isRecycleBinFolder },
      {
+        id: "header_option_separator-2",
+        key: "separator-2",
+        isSeparator: true,
+        disabled: isRecycleBinFolder,
+      },
+      {
+        id: "header_option_archive-room",
        key: "archive-room",
        label: t("Archived"),
        icon: "/static/images/room.archive.svg",
@ -446,6 +471,7 @@ class SectionHeaderContent extends React.Component {
        action: "archive",
      },
      {
+        id: "header_option_download",
        key: "download",
        label: t("Common:Download"),
        onClick: this.downloadAction,
@ -453,6 +479,7 @@ class SectionHeaderContent extends React.Component {
        icon: "images/download.react.svg",
      },
      {
+        id: "header_option_move-to",
        key: "move-to",
        label: t("MoveTo"),
        onClick: this.onMoveAction,
@ -460,6 +487,7 @@ class SectionHeaderContent extends React.Component {
        icon: "images/move.react.svg",
      },
      {
+        id: "header_option_copy",
        key: "copy",
        label: t("Translations:Copy"),
        onClick: this.onCopyAction,
@ -467,6 +495,7 @@ class SectionHeaderContent extends React.Component {
        icon: "/static/images/copy.react.svg",
      },
      {
+        id: "header_option_rename",
        key: "rename",
        label: t("Rename"),
        onClick: this.renameAction,
@ -474,11 +503,13 @@ class SectionHeaderContent extends React.Component {
        icon: "images/rename.react.svg",
      },
      {
+        id: "header_option_separator-3",
        key: "separator-3",
        isSeparator: true,
        disabled: isDisabled,
      },
      {
+        id: "header_option_delete",
        key: "delete",
        label: t("Common:Delete"),
        onClick: this.onDeleteAction,
@ -506,14 +537,20 @@ class SectionHeaderContent extends React.Component {
  };

  getMenuItems = () => {
-    const { t, cbMenuItems, getCheckboxItemLabel } = this.props;
-
+    const {
+      t,
+      cbMenuItems,
+      getCheckboxItemLabel,
+      getCheckboxItemId,
+    } = this.props;
    const checkboxOptions = (
      <>
        {cbMenuItems.map((key) => {
          const label = getCheckboxItemLabel(t, key);
+          const id = getCheckboxItemId(key);
          return (
            <DropDownItem
+              id={id}
              key={key}
              label={label}
              data-key={key}
@ -700,6 +737,7 @@ export default inject(
      isThirdPartySelection,
      cbMenuItems,
      getCheckboxItemLabel,
+      getCheckboxItemId,
      isEmptyFilesList,
      getFolderInfo,
      setBufferSelection,
@ -817,6 +855,7 @@ export default inject(
      getHeaderMenu,
      backToParentFolder,
      getCheckboxItemLabel,
+      getCheckboxItemId,
      setSelectFileDialogVisible,

      isRecycleBinFolder,
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
@ -159,6 +159,7 @@ const StyledAutoBackup = styled.div`
  }

  .auto-backup_badge {
+    height: 16px;
    margin-left: 8px;
  }
  ${(props) => !props.isEnableAuto && UnavailableStyles}
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js
@ -22,8 +22,6 @@ const Backup = ({
    return (
      <>
        <HelpButton
-          displayType="auto"
-          place="bottom"
          iconName={"/static/images/help.react.svg"}
          tooltipContent={
            <>
--- a/packages/client/src/store/AccountsContextOptionsStore.js
+++ b/packages/client/src/store/AccountsContextOptionsStore.js
@ -39,6 +39,7 @@ class AccountsContextOptionsStore {

        case "profile":
          return {
+            id: "option_profile",
            key: option,
            icon: "/static/images/profile.react.svg",
            label: t("Common:Profile"),
@ -47,6 +48,7 @@ class AccountsContextOptionsStore {

        case "change-name":
          return {
+            id: "option_change-name",
            key: option,
            icon: "images/pencil.react.svg",
            label: t("PeopleTranslations:NameChangeButton"),
@ -54,6 +56,7 @@ class AccountsContextOptionsStore {
          };
        case "change-email":
          return {
+            id: "option_change-email",
            key: option,
            icon: "images/change.mail.react.svg",
            label: t("PeopleTranslations:EmailChangeButton"),
@ -61,6 +64,7 @@ class AccountsContextOptionsStore {
          };
        case "change-password":
          return {
+            id: "option_change-password",
            key: option,
            icon: "images/change.security.react.svg",
            label: t("PeopleTranslations:PasswordChangeButton"),
@ -68,6 +72,7 @@ class AccountsContextOptionsStore {
          };
        case "change-owner":
          return {
+            id: "option_change-owner",
            key: option,
            icon: "/static/images/refresh.react.svg",
            label: t("Translations:OwnerChange"),
@ -76,6 +81,7 @@ class AccountsContextOptionsStore {

        case "enable":
          return {
+            id: "option_enable",
            key: option,
            icon: "images/enable.react.svg",
            label: t("PeopleTranslations:EnableUserButton"),
@ -83,6 +89,7 @@ class AccountsContextOptionsStore {
          };
        case "disable":
          return {
+            id: "option_disable",
            key: option,
            icon: "images/remove.react.svg",
            label: t("PeopleTranslations:DisableUserButton"),
@ -91,6 +98,7 @@ class AccountsContextOptionsStore {

        case "reassign-data":
          return {
+            id: "option_reassign-data",
            key: option,
            icon: "images/ressing_data.react.svg",
            label: t("PeopleTranslations:ReassignData"),
@ -98,6 +106,7 @@ class AccountsContextOptionsStore {
          };
        case "delete-personal-data":
          return {
+            id: "option_delete-personal-data",
            key: option,
            icon: "images/del_data.react.svg",
            label: t("PeopleTranslations:RemoveData"),
@ -105,6 +114,7 @@ class AccountsContextOptionsStore {
          };
        case "delete-user":
          return {
+            id: "option_delete-user",
            key: option,
            icon: "images/trash.react.svg",
            label: t("DeleteProfileEverDialog:DeleteUser"),
@ -113,6 +123,7 @@ class AccountsContextOptionsStore {

        case "details":
          return {
+            id: "option_details",
            key: option,
            icon: "images/info.react.svg",
            label: t("Common:Info"),
@ -121,6 +132,7 @@ class AccountsContextOptionsStore {

        case "invite-again":
          return {
+            id: "option_invite-again",
            key: option,
            icon: "/static/images/invite.again.react.svg",
            label: t("LblInviteAgain"),
@ -128,6 +140,7 @@ class AccountsContextOptionsStore {
          };
        case "reset-auth":
          return {
+            id: "option_reset-auth",
            key: option,
            icon: "images/restore.auth.react.svg",
            label: t("PeopleTranslations:ResetAuth"),
--- a/packages/client/src/store/ContextOptionsStore.js
+++ b/packages/client/src/store/ContextOptionsStore.js
@ -469,6 +469,7 @@ class ContextOptionsStore {

    const blockAction = isCanWebEdit
      ? {
+          id: "option_block-unblock-version",
          key: "block-unblock-version",
          label: t("UnblockVersion"),
          icon: "/static/images/locked.react.svg",
@ -486,6 +487,7 @@ class ContextOptionsStore {
        ? onlyShowVersionHistory
          ? [
              {
+                id: "option_show-version-history",
                key: "show-version-history",
                label: t("ShowVersionHistory"),
                icon: "images/history.react.svg",
@ -495,11 +497,13 @@ class ContextOptionsStore {
            ]
          : [
              {
+                id: "option_version",
                key: "version",
                label: t("VersionHistory"),
                icon: "images/history-finalized.react.svg",
                items: [
                  {
+                    id: "option_finalize-version",
                    key: "finalize-version",
                    label: t("FinalizeVersion"),
                    icon: "images/history-finalized.react.svg",
@ -507,6 +511,7 @@ class ContextOptionsStore {
                    disabled: false,
                  },
                  {
+                    id: "option_version-history",
                    key: "show-version-history",
                    label: t("ShowVersionHistory"),
                    icon: "images/history.react.svg",
@ -519,6 +524,7 @@ class ContextOptionsStore {
            ]
        : [
            {
+              id: "option_finalize-version",
              key: "finalize-version",
              label: t("FinalizeVersion"),
              icon: "images/history-finalized.react.svg",
@ -526,6 +532,7 @@ class ContextOptionsStore {
              disabled: false,
            },
            {
+              id: "option_version-history",
              key: "show-version-history",
              label: t("ShowVersionHistory"),
              icon: "images/history.react.svg",
@ -539,11 +546,13 @@ class ContextOptionsStore {
      !isMobile && !isMobileUtils() && !isTabletUtils()
        ? [
            {
+              id: "option_move-or-copy",
              key: "move",
              label: t("MoveOrCopy"),
              icon: "/static/images/copy.react.svg",
              items: [
                {
+                  id: "option_move-to",
                  key: "move-to",
                  label: t("MoveTo"),
                  icon: "images/move.react.svg",
@ -551,6 +560,7 @@ class ContextOptionsStore {
                  disabled: false,
                },
                {
+                  id: "option_copy-to",
                  key: "copy-to",
                  label: t("Translations:Copy"),
                  icon: "/static/images/copy.react.svg",
@ -558,6 +568,7 @@ class ContextOptionsStore {
                  disabled: false,
                },
                {
+                  id: "option_create-copy",
                  key: "copy",
                  label: t("Common:Duplicate"),
                  icon: "/static/images/duplicate.react.svg",
@ -569,6 +580,7 @@ class ContextOptionsStore {
          ]
        : [
            {
+              id: "option_move-to",
              key: "move-to",
              label: t("MoveTo"),
              icon: "images/move.react.svg",
@ -576,6 +588,7 @@ class ContextOptionsStore {
              disabled: false,
            },
            {
+              id: "option_copy-to",
              key: "copy-to",
              label: t("Translations:Copy"),
              icon: "/static/images/copy.react.svg",
@ -583,6 +596,7 @@ class ContextOptionsStore {
              disabled: false,
            },
            {
+              id: "option_create-copy",
              key: "copy",
              label: t("Common:Duplicate"),
              icon: "/static/images/duplicate.react.svg",
@ -593,6 +607,7 @@ class ContextOptionsStore {

    const optionsModel = [
      {
+        id: "option_select",
        key: "select",
        label: "Select",
        icon: "images/check-box.react.svg",
@ -600,6 +615,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_open",
        key: "open",
        label: t("Open"),
        icon: "images/folder.react.svg",
@ -607,6 +623,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_fill-form",
        key: "fill-form",
        label: t("Common:FillFormButton"),
        icon: "/static/images/form.fill.rect.svg",
@ -614,6 +631,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_edit",
        key: "edit",
        label: t("Common:EditButton"),
        icon: "/static/images/access.edit.react.svg",
@ -621,6 +639,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_preview",
        key: "preview",
        label: t("Preview"),
        icon: "/static/images/eye.react.svg",
@ -628,6 +647,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_view",
        key: "view",
        label: t("Common:View"),
        icon: "/static/images/eye.react.svg",
@ -635,6 +655,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_make-form",
        key: "make-form",
        label: t("Common:MakeForm"),
        icon: "/static/images/form.plus.react.svg",
@ -646,6 +667,7 @@ class ContextOptionsStore {
        isSeparator: true,
      },
      {
+        id: "option_reconnect-storage",
        key: "reconnect-storage",
        label: t("Common:ReconnectStorage"),
        icon: "images/reconnect.svg",
@ -653,6 +675,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_edit-room",
        key: "edit-room",
        label: t("EditRoom"),
        icon: "images/settings.react.svg",
@ -660,6 +683,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_invite-users-to-room",
        key: "invite-users-to-room",
        label: t("InviteUsers"),
        icon: "/static/images/person.react.svg",
@ -668,6 +692,7 @@ class ContextOptionsStore {
        action: item.id,
      },
      {
+        id: "option_room-info",
        key: "room-info",
        label: t("Common:Info"),
        icon: "/static/images/info.outline.react.svg",
@ -675,6 +700,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_pin-room",
        key: "pin-room",
        label: t("Pin"),
        icon: "/static/images/pin.react.svg",
@ -684,6 +710,7 @@ class ContextOptionsStore {
        action: "pin",
      },
      {
+        id: "option_unpin-room",
        key: "unpin-room",
        label: t("Unpin"),
        icon: "/static/images/unpin.react.svg",
@ -693,6 +720,7 @@ class ContextOptionsStore {
        action: "unpin",
      },
      {
+        id: "option_sharing-settings",
        key: "sharing-settings",
        label: t("SharingPanel:SharingSettingsTitle"),
        icon: "/static/images/share.react.svg",
@ -700,6 +728,7 @@ class ContextOptionsStore {
        disabled: !isShareable,
      },
      {
+        id: "option_owner-change",
        key: "owner-change",
        label: t("Translations:OwnerChange"),
        icon: "images/file.actions.owner.react.svg",
@ -707,6 +736,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_link-for-portal-users",
        key: "link-for-portal-users",
        label: t("LinkForPortalUsers"),
        icon: "/static/images/invitation.link.react.svg",
@ -714,6 +744,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_send-by-email",
        key: "send-by-email",
        label: t("SendByEmail"),
        icon: "/static/images/mail.react.svg",
@ -721,6 +752,7 @@ class ContextOptionsStore {
      },
      ...versionActions,
      {
+        id: "option_show-info",
        key: "show-info",
        label: t("Common:Info"),
        icon: "/static/images/info.outline.react.svg",
@ -733,6 +765,7 @@ class ContextOptionsStore {
        isSeparator: true,
      },
      {
+        id: "option_open-location",
        key: "open-location",
        label: t("OpenLocation"),
        icon: "images/folder.location.react.svg",
@ -740,6 +773,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_mark-read",
        key: "mark-read",
        label: t("MarkRead"),
        icon: "images/tick.rounded.svg",
@ -747,6 +781,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_mark-as-favorite",
        key: "mark-as-favorite",
        label: t("MarkAsFavorite"),
        icon: "images/favorites.react.svg",
@ -756,6 +791,7 @@ class ContextOptionsStore {
        action: "mark",
      },
      {
+        id: "option_remove-from-favorites",
        key: "remove-from-favorites",
        label: t("RemoveFromFavorites"),
        icon: "images/favorites.react.svg",
@ -765,6 +801,7 @@ class ContextOptionsStore {
        action: "remove",
      },
      {
+        id: "option_download",
        key: "download",
        label: t("Common:Download"),
        icon: "images/download.react.svg",
@ -772,6 +809,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_download-as",
        key: "download-as",
        label: t("Translations:DownloadAs"),
        icon: "images/download-as.react.svg",
@ -780,6 +818,7 @@ class ContextOptionsStore {
      },
      ...moveActions,
      {
+        id: "option_restore",
        key: "restore",
        label: t("Common:Restore"),
        icon: "images/move.react.svg",
@ -787,6 +826,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_rename",
        key: "rename",
        label: t("Rename"),
        icon: "images/rename.react.svg",
@ -798,6 +838,7 @@ class ContextOptionsStore {
        isSeparator: true,
      },
      {
+        id: "option_unsubscribe",
        key: "unsubscribe",
        label: t("RemoveFromList"),
        icon: "images/remove.svg",
@ -805,6 +846,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_change-thirdparty-info",
        key: "change-thirdparty-info",
        label: t("Translations:ThirdPartyInfo"),
        icon: "/static/images/access.edit.react.svg",
@ -812,6 +854,7 @@ class ContextOptionsStore {
        disabled: false,
      },
      {
+        id: "option_archive-room",
        key: "archive-room",
        label: t("Archived"),
        icon: "/static/images/room.archive.svg",
@ -821,6 +864,7 @@ class ContextOptionsStore {
        action: "archive",
      },
      {
+        id: "option_unarchive-room",
        key: "unarchive-room",
        label: t("Common:Restore"),
        icon: "images/subtract.react.svg",
@ -830,6 +874,7 @@ class ContextOptionsStore {
        action: "unarchive",
      },
      {
+        id: "option_delete",
        key: "delete",
        label: isRootThirdPartyFolder
          ? t("Common:Disconnect")
@ -885,7 +930,7 @@ class ContextOptionsStore {

      deleteRooms,
    } = this.filesActionsStore;
- 
+
    if (isRoomsFolder || isArchiveFolder) {
      const isPinOption = selection.filter((item) => !item.pinned).length > 0;

--- a/packages/client/src/store/FilesActionsStore.js
+++ b/packages/client/src/store/FilesActionsStore.js
@ -1438,6 +1438,7 @@ class FilesActionStore {
        if (!isTablet() && !isMobile) return null;
        else
          return {
+            id: "menu-show-info",
            key: "show-info",
            label: t("Common:Info"),
            iconUrl: "/static/images/info.outline.react.svg",
@ -1447,6 +1448,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("copy")) return null;
        else
          return {
+            id: "menu-copy",
            label: t("Translations:Copy"),
            onClick: () => setCopyPanelVisible(true),
            iconUrl: "/static/images/copyTo.react.svg",
@ -1456,6 +1458,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("download")) return null;
        else
          return {
+            id: "menu-download",
            label: t("Common:Download"),
            onClick: () =>
              this.downloadAction(
@ -1468,6 +1471,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("downloadAs")) return null;
        else
          return {
+            id: "menu-download-as",
            label: t("Translations:DownloadAs"),
            onClick: () => setDownloadDialogVisible(true),
            iconUrl: "/static/images/downloadAs.react.svg",
@ -1477,12 +1481,14 @@ class FilesActionStore {
        if (!this.isAvailableOption("moveTo")) return null;
        else
          return {
+            id: "menu-move-to",
            label: t("MoveTo"),
            onClick: () => setMoveToPanelVisible(true),
            iconUrl: "/static/images/move.react.svg",
          };
      case "pin":
        return {
+          id: "menu-pin",
          key: "pin",
          label: t("Pin"),
          iconUrl: "/static/images/pin.react.svg",
@ -1491,6 +1497,7 @@ class FilesActionStore {
        };
      case "unpin":
        return {
+          id: "menu-unpin",
          key: "unpin",
          label: t("Unpin"),
          iconUrl: "/static/images/unpin.react.svg",
@ -1501,6 +1508,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("archive")) return null;
        else
          return {
+            id: "menu-archive",
            key: "archive",
            label: t("Archived"),
            iconUrl: "/static/images/room.archive.svg",
@ -1511,6 +1519,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("unarchive")) return null;
        else
          return {
+            id: "menu-unarchive",
            key: "unarchive",
            label: t("Common:Restore"),
            iconUrl: "images/subtract.react.svg",
@ -1521,6 +1530,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("delete-room")) return null;
        else
          return {
+            id: "menu-delete-room",
            label: t("Common:Delete"),
            onClick: () => this.deleteRooms(t),
            iconUrl: "/static/images/delete.react.svg",
@ -1530,6 +1540,7 @@ class FilesActionStore {
        if (!this.isAvailableOption("delete")) return null;
        else
          return {
+            id: "menu-delete",
            label: t("Common:Delete"),
            onClick: () => {
              if (this.settingsStore.confirmDelete) {
@ -1699,6 +1710,7 @@ class FilesActionStore {
      .set("download", download)
      .set("downloadAs", downloadAs)
      .set("restore", {
+        id: "menu-restore",
        label: t("Common:Restore"),
        onClick: () => setMoveToPanelVisible(true),
        iconUrl: "/static/images/move.react.svg",
--- a/packages/client/src/store/FilesStore.js
+++ b/packages/client/src/store/FilesStore.js
@ -2191,6 +2191,42 @@ class FilesStore {
    }
  };

+  getCheckboxItemId = (key) => {
+    switch (key) {
+      case "all":
+        return "selected-all";
+      case FilterType.FoldersOnly:
+        return "selected-only-folders";
+      case FilterType.DocumentsOnly:
+        return "selected-only-documents";
+      case FilterType.PresentationsOnly:
+        return "selected-only-presentations";
+      case FilterType.SpreadsheetsOnly:
+        return "selected-only-spreadsheets";
+      case FilterType.ImagesOnly:
+        return "selected-only-images";
+      case FilterType.MediaOnly:
+        return "selected-only-media";
+      case FilterType.ArchiveOnly:
+        return "selected-only-archives";
+      case FilterType.FilesOnly:
+        return "selected-only-files";
+      case `room-${RoomsType.FillingFormsRoom}`:
+        return "selected-only-filling-form-rooms";
+      case `room-${RoomsType.CustomRoom}`:
+        return "selected-only-custom-room";
+      case `room-${RoomsType.EditingRoom}`:
+        return "selected-only-collaboration-rooms";
+      case `room-${RoomsType.ReviewRoom}`:
+        return "selected-only-review-rooms";
+      case `room-${RoomsType.ReadOnlyRoom}`:
+        return "selected-only-view-rooms";
+
+      default:
+        return "";
+    }
+  };
+
  get sortedFiles() {
    const {
      extsConvertible,
--- a/packages/client/src/store/HeaderMenuStore.js
+++ b/packages/client/src/store/HeaderMenuStore.js
@ -35,7 +35,18 @@ class HeaderMenuStore {

    return cbMenu;
  }
-
+  getMenuItemId = (item) => {
+    switch (item) {
+      case "active":
+        return "selected_active";
+      case "pending":
+        return "selected_pending";
+      case "disabled":
+        return "selected_disabled";
+      case "all":
+        return "selected_all";
+    }
+  };
  getCheckboxItemLabel = (t, item) => {
    switch (item) {
      case "active":
--- a/packages/client/src/store/PeopleStore.js
+++ b/packages/client/src/store/PeopleStore.js
@ -193,7 +193,7 @@ class PeopleStore {
    const options = [];

    const adminOption = {
-      id: "group-menu_administrator",
+      id: "menu_change-user_administrator",
      className: "group-menu_drop-down",
      label: t("Common:DocSpaceAdmin"),
      title: t("Common:DocSpaceAdmin"),
@ -202,7 +202,7 @@ class PeopleStore {
      key: "administrator",
    };
    const managerOption = {
-      id: "group-menu_manager",
+      id: "menu_change-user_manager",
      className: "group-menu_drop-down",
      label: t("Common:RoomAdmin"),
      title: t("Common:RoomAdmin"),
@ -211,7 +211,7 @@ class PeopleStore {
      key: "manager",
    };
    const userOption = {
-      id: "group-menu_user",
+      id: "menu_change-user_user",
      className: "group-menu_drop-down",
      label: t("Common:User"),
      title: t("Common:User"),
@ -228,6 +228,7 @@ class PeopleStore {

    const headerMenu = [
      {
+        id: "menu-change-type",
        key: "change-user",
        label: t("ChangeUserTypeDialog:ChangeUserTypeButton"),
        disabled: !hasUsersToMakeEmployees,
@ -236,6 +237,7 @@ class PeopleStore {
        options: options,
      },
      {
+        id: "menu-info",
        key: "info",
        label: t("Common:Info"),
        disabled:
@ -245,6 +247,7 @@ class PeopleStore {
        iconUrl: "images/info.react.svg",
      },
      {
+        id: "menu-invite",
        key: "invite",
        label: t("Common:Invite"),
        disabled: !hasUsersToInvite,
@ -252,6 +255,7 @@ class PeopleStore {
        iconUrl: "/static/images/invite.again.react.svg",
      },
      {
+        id: "menu-enable",
        key: "enable",
        label: t("Common:Enable"),
        disabled: !hasUsersToActivate,
@ -259,6 +263,7 @@ class PeopleStore {
        iconUrl: "images/enable.react.svg",
      },
      {
+        id: "menu-disable",
        key: "disable",
        label: t("PeopleTranslations:DisableUserButton"),
        disabled: !hasUsersToDisable,
@ -266,6 +271,7 @@ class PeopleStore {
        iconUrl: "images/disable.react.svg",
      },
      {
+        id: "menu-delete",
        key: "delete",
        label: t("Common:Delete"),
        disabled: !hasUsersToRemove,
--- a/packages/common/components/Navigation/Navigation.js
+++ b/packages/common/components/Navigation/Navigation.js
@ -195,6 +195,7 @@ const Navigation = ({
          </StyledContainer>
          {infoPanelIsVisible && (
            <ToggleInfoPanelButton
+              id="info-panel-toggle--open"
              isRootFolder={isRootFolder}
              toggleInfoPanel={toggleInfoPanel}
              isInfoPanelVisible={isInfoPanelVisible}
--- a/packages/common/components/Navigation/sub-components/control-btn.js
+++ b/packages/common/components/Navigation/sub-components/control-btn.js
@ -125,6 +125,7 @@ const ControlButtons = ({
          )}
          {!personal && (
            <ContextMenuButton
+              id="header_optional-button"
              zIndex={402}
              className="option-button"
              directionX="right"
@ -147,6 +148,7 @@ const ControlButtons = ({
        <>
          {!isMobile && (
            <PlusButton
+              id="header_add-button"
              className="add-button"
              getData={getContextOptionsPlus}
              withMenu={withMenu}
--- a/packages/common/components/Navigation/sub-components/plus-btn.js
+++ b/packages/common/components/Navigation/sub-components/plus-btn.js
@ -31,6 +31,7 @@ const PlusButton = (props) => {
      <IconButton
        onClick={onClick}
        iconName="images/plus.svg"
+        id={props.id}
        size={15}
        isFill
      />
@ -50,6 +51,7 @@ PlusButton.propTypes = {
  className: PropTypes.string,
  getData: PropTypes.func.isRequired,
  onPlusClick: PropTypes.func,
+  id: PropTypes.string,
 };

 PlusButton.defaultProps = {
--- a/packages/common/components/Navigation/sub-components/toggle-infopanel-btn.js
+++ b/packages/common/components/Navigation/sub-components/toggle-infopanel-btn.js
@ -54,6 +54,7 @@ const ToggleInfoPanelButton = ({
  isRootFolder,
  isInfoPanelVisible,
  toggleInfoPanel,
+  id,
 }) => {
  return (
    <StyledInfoPanelToggleWrapper
@ -62,6 +63,7 @@ const ToggleInfoPanelButton = ({
    >
      <div className="info-panel-toggle-bg">
        <IconButton
+          id={id}
          className="info-panel-toggle"
          iconName="images/panel.react.svg"
          size="16"
--- a/packages/common/store/InfoPanelStore.js
+++ b/packages/common/store/InfoPanelStore.js
@ -23,8 +23,8 @@ class InfoPanelStore {
  selection = null;
  selectionParentRoom = null;

-  roomsView = "details";
-  fileView = "history";
+  roomsView = "info_details";
+  fileView = "info_history";

  authStore = null;
  settingsStore = null;
@ -54,7 +54,7 @@ class InfoPanelStore {

  setView = (view) => {
    this.roomsView = view;
-    this.fileView = view === "members" ? "history" : view;
+    this.fileView = view === "info_members" ? "info_history" : view;
  };

  // Selection helpers //
--- a/packages/components/context-menu-button/index.js
+++ b/packages/components/context-menu-button/index.js
@ -222,7 +222,7 @@ class ContextMenuButton extends React.Component {
                (item.label || item.icon || item.key) && (
                  <DropDownItem
                    {...item}
-                    id={item.key}
+                    id={item.id}
                    key={item.key || index}
                    onClick={this.onDropDownItemClick.bind(this, item)}
                  />
--- a/packages/components/link-with-dropdown/index.js
+++ b/packages/components/link-with-dropdown/index.js
@ -113,6 +113,7 @@ class LinkWithDropdown extends React.Component {
    const dropDownItem = data.map((item) => (
      <DropDownItem
        className="drop-down-item"
+        id={item.key}
        key={item.key}
        {...item}
        onClick={this.onClickDropDownItem}
--- a/packages/components/table-container/GroupMenuItem.js
+++ b/packages/components/table-container/GroupMenuItem.js
@ -140,6 +140,7 @@ const GroupMenuItem = ({ item }) => {
    title,
    withDropDown,
    options,
+    id,
  } = item;
  return (
    <>
@ -148,6 +149,7 @@ const GroupMenuItem = ({ item }) => {
      ) : (
        <>
          <StyledButton
+            id={id}
            label={label}
            title={title || label}
            isDisabled={disabled}
--- a/packages/components/table-container/TableGroupMenu.js
+++ b/packages/components/table-container/TableGroupMenu.js
@ -36,6 +36,7 @@ const TableGroupMenu = (props) => {
        {...rest}
      >
        <Checkbox
+          id="menu-checkbox_selected-all-file"
          className="table-container_group-menu-checkbox"
          onChange={onCheckboxChange}
          isChecked={isChecked}
@ -43,6 +44,7 @@ const TableGroupMenu = (props) => {
          title={t("Common:MainHeaderSelectAll")}
        />
        <ComboBox
+          id="menu-combobox"
          comboIcon="/static/images/triangle.navigation.down.react.svg"
          noBorder
          advancedOptions={checkboxOptions}
@ -63,6 +65,7 @@ const TableGroupMenu = (props) => {
          <StyledInfoPanelToggleWrapper isInfoPanelVisible={isInfoPanelVisible}>
            <div className="info-panel-toggle-bg">
              <IconButton
+                id="info-panel-toggle--open"
                className="info-panel-toggle"
                iconName="images/panel.react.svg"
                size="16"