Add testing identifier to elements

This commit is contained in:
lethemanh
2024-12-09 21:14:46 +07:00
parent df5c472d7b
commit 217e683269
43 changed files with 201 additions and 102 deletions
@@ -232,10 +232,10 @@ export default memo(
inPublicSharing,
};
return isMobile ? (
<DocumentRow {...commonProps} />
<DocumentRow {...commonProps} testClassId="browser-document-row" />
) : (
<Draggable id={index} key={index}>
<DocumentRow {...commonProps} />
<DocumentRow {...commonProps} testClassId="browser-document-row" />
</Draggable>
);
}
@@ -339,6 +339,7 @@ export default memo(
onDragOver={handleDragOver}
onDrop={handleDrop}
disabled={inTrash || access === 'read'}
testClassId="browser-upload-zone"
>
{role == 'admin' && <UsersModal />}
<VersionsModal />
@@ -374,8 +375,11 @@ export default memo(
buildFileTypeContextMenu(),
{ x: evt.clientX, y: evt.clientY },
'center',
{},
"browser-share-with-me-menu-file-type"
);
}}
testClassId="browser-share-with-me-button-file-type"
>
<span>
{filter.mimeType.key && filter.mimeType.key != 'All'
@@ -394,8 +398,11 @@ export default memo(
buildPeopleContextMen(),
{ x: evt.clientX, y: evt.clientY },
'center',
{},
"browser-share-with-me-menu-people"
);
}}
testClassId="browser-share-with-me-button-people"
>
<span>{Languages.t('scenes.app.shared_with_me.people')}</span>
<ChevronDownIcon className="h-4 w-4 ml-2 -mr-1" />
@@ -411,8 +418,11 @@ export default memo(
buildDateContextMenu(),
{ x: evt.clientX, y: evt.clientY },
'center',
{},
"browser-share-with-me-menu-last-modified"
);
}}
testClassId="browser-share-with-me-button-last-modified"
>
<span>
{filter.date.key && filter.date.key != 'All'
@@ -440,9 +450,9 @@ export default memo(
</BaseSmall>
)}
<Menu menu={() => onBuildSortContextMenu()} sortData={sortLabel}>
<Menu menu={() => onBuildSortContextMenu()} sortData={sortLabel} testClassId="browser-menu-sorting">
{' '}
<Button theme="outline" className="ml-4 flex flex-row items-center">
<Button theme="outline" className="ml-4 flex flex-row items-center" testClassId="browser-button-sorting">
<SortIcon
className={`h-4 w-4 mr-2 -ml-1 ${
sortLabel.order === 'asc' ? 'transform rotate-180' : ''
@@ -455,9 +465,9 @@ export default memo(
</Button>
</Menu>
{viewId !== 'shared_with_me' && (
<Menu menu={() => onBuildContextMenu(details)}>
<Menu menu={() => onBuildContextMenu(details)} testClassId="browser-menu-context">
{' '}
<Button theme="secondary" className="ml-4 flex flex-row items-center">
<Button theme="secondary" className="ml-4 flex flex-row items-center" testClassId="browser-button-context">
<span>
{selectedCount > 1
? `${selectedCount} items`
@@ -485,6 +495,7 @@ export default memo(
onClick={() => uploadItemModal()}
theme="primary"
className="mt-4"
testClassId="browser-button-add-doc"
>
{Languages.t('scenes.app.drive.add_doc')}
</Button>
@@ -514,6 +525,7 @@ export default memo(
setChecked(_.pickBy({ ...checked, [child.id]: v }, _.identity))
}
onBuildContextMenu={() => onBuildContextMenu(details, child)}
testClassId="browser-folder-row"
/>
</Droppable>
) : (
@@ -26,6 +26,7 @@ export const AccessLevelDropdown = ({
className,
size,
noRedWhenLevelNone,
testClassId,
}: {
disabled?: boolean;
level: DriveFileAccessLevel | null;
@@ -35,6 +36,7 @@ export const AccessLevelDropdown = ({
hiddenLevels?: DriveFileAccessLevelOrRemove[] | string[];
size?: SelectSize,
noRedWhenLevelNone?: boolean,
testClassId?: string,
}) => {
const createOption = (level: DriveFileAccessLevelOrRemove) =>
!hiddenLevels?.includes(level) && <option value={level}>{(labelOverrides || {})[level] || translateAccessLevel(level)}</option>;
@@ -42,7 +44,7 @@ export const AccessLevelDropdown = ({
<Select
disabled={disabled}
size={size}
className={className + ' w-auto'}
className={className + ' w-auto' + ` testid:${testClassId}`}
theme={(!noRedWhenLevelNone && level === 'none') ? 'rose' : 'outline'}
value={level || 'none'}
onChange={e => onChange(e.target.value as DriveFileAccessLevel & 'remove')}
@@ -9,6 +9,7 @@ export type DriveItemProps = {
checked: boolean;
onClick?: () => void;
onBuildContextMenu: () => Promise<any[]>;
testClassId?: string;
};
export type DriveItemOverlayProps = {
@@ -1,6 +1,5 @@
import {
DotsHorizontalIcon,
ShieldCheckIcon,
ShieldExclamationIcon,
BanIcon,
} from '@heroicons/react/outline';
@@ -32,6 +31,7 @@ export const DocumentRow = ({
checked,
onClick,
onBuildContextMenu,
testClassId,
}: DriveItemProps) => {
const history = useHistory();
const [hover, setHover] = useState(false);
@@ -52,7 +52,8 @@ export const DocumentRow = ({
(checked
? (notSafe ? 'bg-rose-500' : 'bg-blue-500') + ' bg-opacity-10 hover:bg-opacity-25'
: 'hover:bg-zinc-500 hover:bg-opacity-10 ') +
(className || '')
(className || '') +
` testid:${testClassId}`
}
id={`DR-${item.id}`}
onMouseEnter={() => setHover(true)}
@@ -102,12 +103,13 @@ export const DocumentRow = ({
</div>
)}
<div className="shrink-0 ml-auto md:ml-4">
<Menu menu={onBuildContextMenu}>
<Menu menu={onBuildContextMenu} testClassId="document-row-menu">
<Button
theme={'secondary'}
size="sm"
className={'!rounded-full '}
icon={DotsHorizontalIcon}
testClassId="document-row-button-open-menu"
/>
</Menu>
</div>
@@ -17,6 +17,7 @@ export const FolderRow = ({
checked,
onClick,
onBuildContextMenu,
testClassId,
}: DriveItemProps) => {
const [hover, setHover] = useState(false);
@@ -28,7 +29,8 @@ export const FolderRow = ({
(checked
? 'bg-blue-500 bg-opacity-10 hover:bg-opacity-25 '
: 'hover:bg-zinc-500 hover:bg-opacity-10 ') +
(className || '')
(className || '') +
` testid:${testClassId}`
}
onMouseEnter={() => setHover(true)}
onMouseLeave={() => setHover(false)}
@@ -58,12 +60,13 @@ export const FolderRow = ({
<BaseSmall>{formatBytes(item.size)}</BaseSmall>
</div>
<div className="shrink-0 ml-4">
<Menu menu={onBuildContextMenu}>
<Menu menu={onBuildContextMenu} testClassId="folder-row-menu">
<Button
theme={'secondary'}
size="sm"
className={'!rounded-full '}
icon={DotsHorizontalIcon}
testClassId="folder-row-button-open-menu"
/>
</Menu>
</div>
@@ -74,7 +74,7 @@ export const PathRender = ({
const pathLength = (pathToRender || []).reduce((acc, curr) => acc + curr.name.length, 0);
return (
<nav className="overflow-hidden whitespace-nowrap mr-2 pl-px inline-flex md:max-w-[50%] sm:max-w-[20%]">
<nav className="overflow-hidden whitespace-nowrap mr-2 pl-px inline-flex md:max-w-[50%] sm:max-w-[20%] testid:header-path">
{pathLength < 70 ? (
(pathToRender || [])?.map((a, i) => (
<PathItem
@@ -136,7 +136,7 @@ const PathItem = ({
<div className={`flex items-center ${!first ? 'overflow-hidden' : ''}`}>
<a
href="#"
className={`text-sm font-medium text-gray-700 hover:text-blue-600 dark:text-gray-400 dark:hover:text-white ${!first ? 'overflow-hidden' : ''}`}
className={`text-sm font-medium text-gray-700 hover:text-blue-600 dark:text-gray-400 dark:hover:text-white ${!first ? 'overflow-hidden' : ''} testid:header-path-item`}
onClick={evt => {
evt.preventDefault();
@@ -71,6 +71,7 @@ const ConfirmDeleteModalContent = ({ items }: { items: DriveItem[] }) => {
setSelected({});
setState({ ...state, open: false });
}}
testClassId="confirm-delete-modal-button-delete"
>
Delete
</Button>
@@ -52,6 +52,7 @@ const ConfirmModalContent = () => {
theme="primary"
className="float-right"
onClick={handleClose}
testClassId="confirm-modal-button-move"
>
<>{Languages.t('components.SelectorModalContent_move_to')} '{selected[0]?.name}'</>
</Button>
@@ -74,6 +74,7 @@ const ConfirmTrashModalContent = ({ items }: { items: DriveItem[] }) => {
await refresh("trash");
setState({ ...state, open: false });
}}
testClassId="cofirm-trash-modal-button-remove"
>
{Languages.t('components.ConfirmTrashModalContent_move_to_trash')}
</Button>
@@ -43,6 +43,7 @@ export const CreateFolder = () => {
}
}}
onChange={(e: any) => setName(e.target.value)}
testClassId="create-folder-input"
/>
</div>
<Button
@@ -50,6 +51,7 @@ export const CreateFolder = () => {
loading={loading}
className="mt-4 float-right"
onClick={createFolderHandler}
testClassId="create-folder-button"
>
Create
</Button>
@@ -53,6 +53,7 @@ export const CreateLink = () => {
placeholder={ Languages.t('components.create_link_modal.hint')}
className="w-full mt-4"
onChange={e => setName(e.target.value)}
testClassId="create-link-name-input"
/>
<Input
@@ -60,6 +61,7 @@ export const CreateLink = () => {
placeholder="https://example.com"
className="w-full mt-4"
onChange={e => setLink(e.target.value)}
testClassId="create-link-input"
/>
<Button
@@ -70,6 +72,7 @@ export const CreateLink = () => {
await createLink();
setState({ ...state, open: false });
}}
testClassId="create-link-button"
>
{ Languages.t('components.create_link_modal.button')}
</Button>
@@ -82,11 +82,13 @@ export const CreateModal = ({
icon={<FolderAddIcon className="w-5 h-5" />}
text={Languages.t('components.create_modal.create_folder')}
onClick={() => setState({ ...state, type: 'folder' })}
testClassId="create-folder-option"
/>
<CreateModalOption
icon={<LinkIcon className="w-5 h-5" />}
text={Languages.t('components.create_modal.create_link')}
onClick={() => setState({ ...state, type: 'link' })}
testClassId="create-link-option"
/>
{(applications || [])
@@ -132,6 +134,7 @@ export const CreateModal = ({
onClick={() =>
addFromUrl(app.emptyFile.url, app.emptyFile.filename || app.emptyFile.name)
}
testClassId={app.emptyFile.name}
/>
);
})}
@@ -167,11 +170,11 @@ export const CreateModal = ({
);
};
const CreateModalOption = (props: { icon: ReactNode; text: string; onClick: () => void }) => {
const CreateModalOption = (props: { testClassId?: string; icon: ReactNode; text: string; onClick: () => void }) => {
return (
<div
onClick={props.onClick}
className="flex flex-row p-4 dark:bg-zinc-900 dark:text-white bg-zinc-100 hover:bg-opacity-75 cursor-pointer rounded-md m-2"
className={`flex flex-row p-4 dark:bg-zinc-900 dark:text-white bg-zinc-100 hover:bg-opacity-75 cursor-pointer rounded-md m-2 testid:${props.testClassId}`}
>
<div className="flex items-center justify-center">{props.icon}</div>
<div className="grow flex items-center ml-2">
@@ -105,6 +105,7 @@ const PropertiesModalContent = ({ id, onClose, inPublicSharing }: { id: string;
}
}}
placeholder={Languages.t('components.PropertiesModalContent_place_holder')}
testClassId="properties-modal-input-update-name"
/>
}
/>
@@ -115,6 +116,7 @@ const PropertiesModalContent = ({ id, onClose, inPublicSharing }: { id: string;
theme="primary"
loading={loading}
onClick={doSave}
testClassId="properties-modal-button-update-name"
>
{Languages.t('components.PropertiesModalContent_update_button')}
</Button>
@@ -26,7 +26,8 @@ export const CopyLinkButton = (props: {
disabled={!haveTextToCopy}
theme={didJustCompleteACopy ? "green" : "primary"}
className="justify-center w-64"
>
testClassId="copy-link-button"
>
{ didJustCompleteACopy
? <CheckCircleIcon className="w-5 mr-2" />
: <LinkIcon className="w-5 mr-2" />
@@ -130,6 +130,7 @@ export const ExpiryEditorRow = (props: {
else if (e.key == 'Enter')
confirmSaveExpiry(currentEditedValue);
}}
testClassId="expiry-editor-row-expired-date"
/>
<Button
disabled={disabled}
@@ -137,7 +138,8 @@ export const ExpiryEditorRow = (props: {
size="sm"
className="max-w-xs mr-2 mt-1"
onClick={() => confirmSaveExpiry(currentEditedValue)}
>
testClassId="expiry-editor-row-button-confirm"
>
{Languages.t('components.public-link-security_field_confirm_edit')}
</Button>
</>
@@ -153,7 +155,8 @@ export const ExpiryEditorRow = (props: {
} else
confirmSaveExpiry(0);
}}
/>
testClassId="expiry-editor-row-checkbox"
/>
}
/>
<ConfirmModal
@@ -78,7 +78,8 @@ const ChangePublicLinkAccessLevelRow = (props: {
level={props.level}
hiddenLevels={['remove']}
onChange={props.onChange}
/>
testClassId="public-link-access-level-dropdown"
/>
}
/>
);
@@ -101,7 +102,8 @@ const SwitchToAdvancedSettingsRow = (props: {
if (!props.disabled)
props.onShowAdvancedScreen(true);
}}
>
testClassId="public-link-access-advance-switcher"
>
{Languages.t("components.public-link-security-change")}
</A>
}
@@ -126,58 +128,58 @@ const PublicLinkModalContent = (props: {
return (
<ModalContent
title={
<>
{Languages.t('components.public-link-security-title') + ' '}
<strong>{item?.name}</strong>
</>
}
>
<div className="rounded-md border dark:border-zinc-700 my-5 mb-8">
<ChangePublicLinkAccessLevelRow
disabled={loading}
level={item?.access_info?.public?.level || 'none'}
onChange={level => {
item && update(changePublicLink(item, { level }));
}}
/>
<SwitchToAdvancedSettingsRow
disabled={!havePublicLink}
onShowAdvancedScreen={props.onShowAdvancedScreen}
<>
{Languages.t('components.public-link-security-title') + ' '}
<strong>{item?.name}</strong>
</>
}
>
<div className="rounded-md border dark:border-zinc-700 my-5 mb-8">
<ChangePublicLinkAccessLevelRow
disabled={loading}
level={item?.access_info?.public?.level || 'none'}
onChange={level => {
item && update(changePublicLink(item, { level }));
}}
/>
</div>
<SwitchToAdvancedSettingsRow
disabled={!havePublicLink}
onShowAdvancedScreen={props.onShowAdvancedScreen}
/>
</div>
<div className="flex flex-row place-content-end my-4">
<CopyLinkButton textToCopy={havePublicLink && publicLink} />
</div>
<div className="flex flex-row place-content-end my-4">
<CopyLinkButton textToCopy={havePublicLink && publicLink} />
</div>
<Modal
open={props.isOnAdvancedScreen}
onClose={() => { props.onShowAdvancedScreen(false); }}
>
<ModalContent
title={
<>
{Languages.t('components.public-link-security-title') + ' '}
<strong>{item?.name}</strong>
</>
}
>
<div className='my-4'><Subtitle>{Languages.t('components.public-link-security')}</Subtitle></div>
<div className={Styles.RoundedBorderSection}>
<PublicLinkAccessOptions
disabled={loading || access !== 'manage'}
password={item?.access_info?.public?.password}
expiration={item?.access_info?.public?.expiration}
onChangePassword={async (password: string) => {
item && await update(changePublicLink(item, { password: password || '' }));
}}
onChangeExpiration={async (expiration: number) => {
item && await update(changePublicLink(item, { expiration }));
}}
/>
</div>
</ModalContent>
</Modal>
</ModalContent>
<Modal
open={props.isOnAdvancedScreen}
onClose={() => { props.onShowAdvancedScreen(false); }}
>
<ModalContent
title={
<>
{Languages.t('components.public-link-security-title') + ' '}
<strong>{item?.name}</strong>
</>
}
>
<div className='my-4'><Subtitle>{Languages.t('components.public-link-security')}</Subtitle></div>
<div className={Styles.RoundedBorderSection}>
<PublicLinkAccessOptions
disabled={loading || access !== 'manage'}
password={item?.access_info?.public?.password}
expiration={item?.access_info?.public?.expiration}
onChangePassword={async (password: string) => {
item && await update(changePublicLink(item, { password: password || '' }));
}}
onChangeExpiration={async (expiration: number) => {
item && await update(changePublicLink(item, { expiration }));
}}
/>
</div>
</ModalContent>
</Modal>
</ModalContent>
);
}
@@ -112,6 +112,7 @@ return <>
else if (e.key == 'Enter')
confirmSavePassword(currentEditedPassword);
}}
testClassId="pasword-editor-row-editting-password"
/>
<Button
disabled={disabled}
@@ -119,7 +120,8 @@ return <>
size="sm"
className="max-w-xs mr-2 mt-1"
onClick={() => confirmSavePassword(currentEditedPassword)}
>
testClassId="password-editor-row-button-confirm"
>
{Languages.t('components.public-link-security_field_confirm_edit')}
</Button>
</>
@@ -135,7 +137,8 @@ return <>
} else
confirmSavePassword("");
}}
/>
testClassId="password-editor-row-checkbox"
/>
}
/>
@@ -145,9 +148,8 @@ return <>
text={Languages.t("components.public-link-security_password_removal_body")}
buttonOkTheme='primary'
buttonOkLabel='components.public-link-security_password_removal_confirm'
onClose={() => setIsConfirmingPasswordRemoval(false)}
onOk={() => savePassword("")}
/>
/>
</>;
}
@@ -14,13 +14,13 @@ export const PublicLinkAccessOptions = (props: {
password={props.password}
onChangePassword={props.onChangePassword}
isLinkExpired={!!props.expiration && props.expiration < Date.now()}
/>
/>
<ExpiryEditorRow
disabled={props.disabled}
value={props.expiration ?? 0}
onChange={props.onChangeExpiration}
isLinkPasswordProtected={!!props.password?.length}
/>
/>
</>
);
@@ -138,6 +138,7 @@ const SelectorModalContent = (key: any) => {
setState({ ...state, open: false });
setLoading(false);
}}
testClassId="selector-modal-button"
>
{selected.length === 0 ? (
<>{Languages.t('components.SelectorModalContent_no_items')}</>
@@ -113,6 +113,7 @@ export const InternalUsersAccessManager = ({
}}
value={searchString}
inputRef={inputElement}
testClassId="access-management-search-users"
/>
)}
/>
@@ -125,6 +126,7 @@ export const InternalUsersAccessManager = ({
hiddenLevels={['remove']}
level={level}
onChange={level => setLevel(level)}
testClassId="access-management-dropdown"
/>
</div>
</div>
@@ -179,7 +181,8 @@ export const InternalUsersAccessManager = ({
size="sm"
className='text-center'
onClick={onCloseModal}
>
testClassId="access-management-public-link-security-field-confirm-edit"
>
{Languages.t('components.public-link-security_field_confirm_edit')}
</Button>
</div>
@@ -209,7 +212,8 @@ const UserAccessLevel = (props: {
? <Button
disabled={loading || props.disabled || user?.id === currentUser?.id}
size="sm"
>
testClassId={`user-access-button-${props.isSearchResultAdd}`}
>
{Languages.t('components.user_picker.modal.result_add.' + props.isSearchResultAdd)}
</Button>
@@ -218,7 +222,8 @@ const UserAccessLevel = (props: {
noRedWhenLevelNone={true}
level={(item && getUserAccessLevel(item, props.userId)) || "none"}
onChange={level => item && update(changeUserAccess(item, props.userId, level === 'remove' ? false : level))}
/>
testClassId="user-access-dropdown"
/>
}
/>
);
@@ -74,11 +74,13 @@ export const UploadModal = ({
icon={<DocumentDownloadIcon className="w-5 h-5" />}
text={Languages.t('components.create_modal.upload_files')}
onClick={() => selectFromDevice()}
testClassId="upload-file-from-device"
/>
<CreateModalOption
icon={<FolderDownloadIcon className="w-5 h-5" />}
text={Languages.t('components.create_modal.upload_folders')}
onClick={() => selectFolderFromDevice()}
testClassId="upload-folder-from-device"
/>
</div>
</Transition>
@@ -88,11 +90,11 @@ export const UploadModal = ({
);
};
const CreateModalOption = (props: { icon: ReactNode; text: string; onClick: () => void }) => {
const CreateModalOption = (props: { icon: ReactNode; text: string; onClick: () => void; testClassId?: string; }) => {
return (
<div
onClick={props.onClick}
className="flex flex-row p-4 dark:bg-zinc-900 dark:text-white bg-zinc-100 hover:bg-opacity-75 cursor-pointer rounded-md m-2"
className={`flex flex-row p-4 dark:bg-zinc-900 dark:text-white bg-zinc-100 hover:bg-opacity-75 cursor-pointer rounded-md m-2 testid:${props.testClassId}`}
>
<div className="flex items-center justify-center">{props.icon}</div>
<div className="grow flex items-center ml-2">
@@ -64,6 +64,7 @@ const VersionModalContent = ({ id }: { id: string }) => {
await uploadVersion(file);
await refresh(id);
}}
testClassId="version-modal-upload-zone"
>
{access !== 'read' && (
<div
@@ -80,6 +81,7 @@ const VersionModalContent = ({ id }: { id: string }) => {
theme="primary"
onClick={() => uploadZoneRef.current?.open()}
loading={loading}
testClassId="button-create-version"
>
{Languages.t('components.VersionModalContent_create')}
</Button>
@@ -113,6 +115,7 @@ const VersionModalContent = ({ id }: { id: string }) => {
<Button
theme="outline"
onClick={() => download(id, item.av_status === 'malicious', version.id)}
testClassId="button-download-version"
>
{Languages.t('components.VersionModalContent_donwload')}
</Button>
@@ -44,6 +44,7 @@ export default (): JSX.Element => {
readOnly
placeholder={Languages.t('scenes.client.main_view.main_header.search_input')}
onClick={() => setOpen()}
testClassId="header-search-input"
/>
)}
/>
@@ -33,6 +33,7 @@ export const CreateModalWithUploadZones = ({ initialParentId }: { initialParentI
<UploadZone
overClassName={'!hidden'}
className="hidden"
testClassId="create-modal-upload-file-zone"
disableClick
parent={''}
multiple={true}
@@ -51,6 +52,7 @@ export const CreateModalWithUploadZones = ({ initialParentId }: { initialParentI
<UploadZone
overClassName={'!hidden'}
className="hidden"
testClassId="create-modal-upload-folder-zone"
disableClick
parent={''}
multiple={true}
@@ -135,6 +137,7 @@ export default () => {
theme="danger"
className="w-full mb-2 justify-center"
disabled={!(trashChildren.length > 0)}
testClassId="create-modal-in-trash-button-empty-trash"
>
<TruckIcon className="w-5 h-5 mr-2" /> { Languages.t('components.side_menu.buttons.empty_trash') }
</Button>
@@ -158,6 +161,7 @@ export default () => {
parentId,
});
}}
testClassId="sidebar-action-upload-zone"
/>
<Button
@@ -166,6 +170,7 @@ export default () => {
theme="primary"
className="w-full mb-2 justify-center"
style={{ boxShadow: '0 0 10px 0 rgba(0, 122, 255, 0.5)' }}
testClassId="sidebar-action-button-empty-trash"
>
<UploadIcon className="w-5 h-5 mr-2" /> {Languages.t('components.side_menu.buttons.upload')}
</Button>
@@ -174,6 +179,7 @@ export default () => {
size="lg"
theme="secondary"
className="w-full mb-2 justify-center"
testClassId="sidebar-action-button-open-modal"
>
<PlusIcon className="w-5 h-5 mr-2" /> {Languages.t('components.side_menu.buttons.create')}
</Button>
@@ -161,6 +161,7 @@ export const DrivePreview: React.FC<DrivePreviewProps> = ({ items }) => {
size="lg"
icon={ArrowLeftIcon}
onClick={ handleSwitchLeft }
testClassId="drive-preview-button-switch-left"
/>
<Button
iconSize="lg"
@@ -169,6 +170,7 @@ export const DrivePreview: React.FC<DrivePreviewProps> = ({ items }) => {
size="lg"
icon={ArrowRightIcon}
onClick={ handleSwitchRight }
testClassId="drive-preview-button-switch-right"
/>
</>
}
@@ -181,6 +183,7 @@ export const DrivePreview: React.FC<DrivePreviewProps> = ({ items }) => {
onClick= {() => {
download && (window.location.href = download);
}}
testClassId="drive-preview-button-download"
/>
</div>
</div>
@@ -12,6 +12,7 @@ export default () => {
size="lg"
icon={ZoomOutIcon}
onClick={() => getImageControls().zoomOut()}
testClassId="image-control-button-zoom-out"
/>
<Button
iconSize="lg"
@@ -20,6 +21,7 @@ export default () => {
size="lg"
icon={ZoomInIcon}
onClick={() => getImageControls().zoomIn()}
testClassId="image-control-button-zoom-in"
/>
<Button
iconSize="lg"
@@ -28,6 +30,7 @@ export default () => {
size="lg"
icon={RotateCwIcon}
onClick={() => getImageControls().rotateCw()}
testClassId="image-control-button-rotate"
/>
</>
);
@@ -43,6 +43,7 @@ export default () => {
);
}
}}
testClassId="other-control-button-edit"
>
{Languages.t('scenes.apps.drive.viewer.edit_with_button', [
candidates[0].app?.identity.name,
@@ -74,6 +75,7 @@ export default () => {
{ margin: 0 },
);
}}
testClassId="other-control-button-open"
>
{Languages.t('scenes.apps.drive.viewer.open_with_button')}
</Button>
@@ -124,6 +124,7 @@ export default (): JSX.Element => {
loading={busy}
type="primary"
onClick={onCreateCompanyBtnClick}
className="testid:button-create-company"
>
{Languages.t('scenes.join.create_the_company_button')}
</Button>
@@ -163,6 +164,7 @@ export default (): JSX.Element => {
loading={busy}
type="primary"
onClick={onJoinAccountBtnClick}
className="testid:button-login-first"
>
{Languages.t('scenes.join.login_first_button')}
</Button>
@@ -172,6 +174,7 @@ export default (): JSX.Element => {
loading={busy}
type="primary"
onClick={onJoinAccountBtnClick}
className="testid:button-join-team"
>
{Languages.t('scenes.join.join_the_team_button')}
</Button>
@@ -80,6 +80,7 @@ export default class LoginView extends Component {
}
}}
onChange={evt => this.setState({ form_login: evt.target.value })}
testClassId="login-input-username"
/>
<Input
@@ -100,6 +101,7 @@ export default class LoginView extends Component {
}
}}
onChange={evt => this.setState({ form_password: evt.target.value })}
testClassId="login-input-password"
/>
{this.state.login.login_error && (
@@ -121,6 +123,7 @@ export default class LoginView extends Component {
remember_me: true,
})
}
testClassId="login-button-submit"
>
{this.state.i18n.t('scenes.login.home.login_btn')}
</Button>
@@ -63,12 +63,12 @@ export default class Signin extends Component {
</div>
{this.state.login.error_subscribe_username && this.state.username && (
<div className={'error text bottom-margin'}>
<div className={'error text bottom-margin testid:signin-username-exist-text'}>
{this.state.i18n.t('scenes.login.create_account.username_already_exist')}
</div>
)}
{this.state.username && this.state.errorUsername && (
<div className={'text error bottom-margin'}>
<div className={'text error bottom-margin testid:signin-fill-in-username'}>
{this.state.i18n.t('scenes.login.create_account.fill_in_username', [])}
</div>
)}
@@ -91,6 +91,7 @@ export default class Signin extends Component {
)}
value={this.state.firstName}
onChange={evt => this.setState({ firstName: evt.target.value })}
testClassId="signin-input-first-name"
/>
<Input
id="last_name_create"
@@ -107,18 +108,19 @@ export default class Signin extends Component {
)}
value={this.state.lastName}
onChange={evt => this.setState({ lastName: evt.target.value })}
testClassId="signin-input-last-name"
/>
<br />
<br />
{this.state.login.error_subscribe_mailalreadyused && this.state.email && (
<div className="text error bottom-margin">
<div className="text error bottom-margin testid:signin-email-used-text">
{this.state.i18n.t('scenes.login.create_account.email_used')}
</div>
)}
{this.state.errorMail && (
<div className={'text error bottom-margin'}>
<div className={'text error bottom-margin testid:signin-fill-in-email-text'}>
{this.state.i18n.t('scenes.login.create_account.fill_in_email')}
</div>
)}
@@ -137,6 +139,7 @@ export default class Signin extends Component {
placeholder={this.state.i18n.t('scenes.login.create_account.email')}
value={this.state.email}
onChange={evt => this.setState({ email: evt.target.value })}
testClassId="signin-input-email"
/>
{this.state.errorPassword && (
@@ -159,6 +162,7 @@ export default class Signin extends Component {
placeholder={this.state.i18n.t('scenes.login.create_account.password')}
value={this.state.password}
onChange={evt => this.setState({ password: evt.target.value })}
testClassId="signin-input-password"
/>
<div className="bottom">
{/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
@@ -173,6 +177,7 @@ export default class Signin extends Component {
value={this.state.i18n.t('general.continue')}
loading={this.state.login.login_loading}
loadingTimeout={2000}
testClassId="signin-button-continue"
/>
</div>
</div>
@@ -207,6 +212,7 @@ export default class Signin extends Component {
value={'Send again'}
loading={this.state.login.login_loading}
loadingTimeout={2000}
testClassId="signin-button-subscribe-mail"
/>
</div>
);