random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-12-30 22:31:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add test infrastructure and data-test attributes for Container Copy e2e testing

Browse Source
This commit is contained in:
Bikram Choudhury
2025-12-13 18:16:53 +05:30
parent 6167f94bc3
commit 2ce91f1ef8
31 changed files with 937 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/AddManagedIdentity.tsx
View File

@@ -35,6 +35,7 @@ const AddManagedIdentity: React.FC<AddManagedIdentityProps> = () => {
<InfoTooltip content={managedIdentityTooltip} />
</Text>
<Toggle
data-test="btn-toggle"
checked={systemAssigned}
onText={ContainerCopyMessages.toggleBtn.onText}
offText={ContainerCopyMessages.toggleBtn.offText}

1
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/AddReadPermissionToDefaultIdentity.tsx
View File

@@ -65,6 +65,7 @@ const AddReadPermissionToDefaultIdentity: React.FC<AddReadPermissionToDefaultIde
<InfoTooltip content={TooltipContent} />
</Text>
<Toggle
data-test="btn-toggle"
checked={readPermissionAssigned}
onText={ContainerCopyMessages.toggleBtn.onText}
offText={ContainerCopyMessages.toggleBtn.offText}

13
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/AssignPermissions.tsx
View File

@@ -12,7 +12,7 @@ import { useCopyJobPrerequisitesCache } from "../../Utils/useCopyJobPrerequisite
import usePermissionSections, { PermissionGroupConfig, PermissionSectionConfig } from "./hooks/usePermissionsSection";
const PermissionSection: React.FC<PermissionSectionConfig> = ({ id, title, Component, completed, disabled }) => (
<AccordionItem key={id} value={id} disabled={disabled}>
<AccordionItem key={id} value={id} disabled={disabled} data-test="accordion-item">
<AccordionHeader className="accordionHeader">
<Text className="accordionHeaderText" variant="medium">
{title}
@@ -25,13 +25,13 @@ const PermissionSection: React.FC<PermissionSectionConfig> = ({ id, title, Compo
height={completed ? 20 : 24}
/>
</AccordionHeader>
<AccordionPanel aria-disabled={disabled} className="accordionPanel">
<AccordionPanel aria-disabled={disabled} className="accordionPanel" data-test="accordion-panel">
<Component />
</AccordionPanel>
</AccordionItem>
);
const PermissionGroup: React.FC<PermissionGroupConfig> = ({ title, description, sections }) => {
const PermissionGroup: React.FC<PermissionGroupConfig> = ({ id, title, description, sections }) => {
const [openItems, setOpenItems] = React.useState<string[]>([]);
useEffect(() => {
@@ -44,6 +44,7 @@ const PermissionGroup: React.FC<PermissionGroupConfig> = ({ title, description,
return (
<Stack
data-test={`permission-group-container-${id}`}
tokens={{ childrenGap: 15 }}
styles={{
root: {
@@ -99,7 +100,11 @@ const AssignPermissions = () => {
}, []);
return (
<Stack className="assignPermissionsContainer" tokens={{ childrenGap: 20 }}>
<Stack
data-test="Panel:AssignPermissionsContainer"
className="assignPermissionsContainer"
tokens={{ childrenGap: 20 }}
>
<Text variant="medium">
{isSameAccount && copyJobState.migrationType === CopyJobMigrationType.Online
? ContainerCopyMessages.assignPermissions.intraAccountOnlineDescription(

1
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/DefaultManagedIdentity.tsx
View File

@@ -31,6 +31,7 @@ const DefaultManagedIdentity: React.FC<AddManagedIdentityProps> = () => {
<InfoTooltip content={managedIdentityTooltip} />
</div>
<Toggle
data-test="btn-toggle"
checked={defaultSystemAssigned}
onText={ContainerCopyMessages.toggleBtn.onText}
offText={ContainerCopyMessages.toggleBtn.offText}

2
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/PointInTimeRestore.tsx
View File

@@ -127,6 +127,7 @@ const PointInTimeRestore: React.FC = () => {
<Stack.Item>
{showRefreshButton ? (
<PrimaryButton
data-test="pointInTimeRestore:RefreshBtn"
className="fullWidth"
text={ContainerCopyMessages.refreshButtonLabel}
iconProps={{ iconName: "Refresh" }}
@@ -134,6 +135,7 @@ const PointInTimeRestore: React.FC = () => {
/>
) : (
<PrimaryButton
data-test="pointInTimeRestore:PrimaryBtn"
className="fullWidth"
text={loading ? "" : ContainerCopyMessages.pointInTimeRestore.buttonText}
{...(loading ? { iconProps: { iconName: "SyncStatusSolid" } } : {})}

6
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/__snapshots__/AddManagedIdentity.test.tsx.snap
View File

@@ -67,6 +67,7 @@ exports[`AddManagedIdentity Snapshot Tests renders initial state correctly 1`] =
class="ms-Toggle-background pill-117"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle1"
role="switch"
type="button"
@@ -154,6 +155,7 @@ exports[`AddManagedIdentity Snapshot Tests renders loading state 1`] = `
class="ms-Toggle-background pill-121"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle11"
role="switch"
type="button"
@@ -173,10 +175,12 @@ exports[`AddManagedIdentity Snapshot Tests renders loading state 1`] = `
</div>
<div
class="ms-Stack popover-container foreground loading css-123"
data-test="popover-container"
style="max-width: 450px;"
>
<div
class="ms-Overlay root-135"
data-test="loading-overlay"
>
<div
class="ms-Spinner root-137"
@@ -323,6 +327,7 @@ exports[`AddManagedIdentity Snapshot Tests renders with toggle on and popover vi
class="ms-Toggle-background pill-121"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle3"
role="switch"
type="button"
@@ -342,6 +347,7 @@ exports[`AddManagedIdentity Snapshot Tests renders with toggle on and popover vi
</div>
<div
class="ms-Stack popover-container foreground css-123"
data-test="popover-container"
style="max-width: 450px;"
>
<span

6
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/__snapshots__/AddReadPermissionToDefaultIdentity.test.tsx.snap
View File

@@ -41,6 +41,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Edge Cases should handle m
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle17"
role="switch"
type="button"
@@ -103,6 +104,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Edge Cases should handle m
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle16"
role="switch"
type="button"
@@ -165,6 +167,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Rendering should render co
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle3"
role="switch"
type="button"
@@ -227,6 +230,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Rendering should render co
class="ms-Toggle-background pill-119"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle1"
role="switch"
type="button"
@@ -314,6 +318,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Rendering should render co
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle0"
role="switch"
type="button"
@@ -376,6 +381,7 @@ exports[`AddReadPermissionToDefaultIdentity Component Rendering should render co
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle2"
role="switch"
type="button"

42
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/__snapshots__/AssignPermissions.test.tsx.snap
View File

@@ -4,6 +4,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -15,6 +16,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-testGroup"
>
<div
class="ms-Stack css-113"
@@ -36,6 +38,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -85,6 +88,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -134,6 +138,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div>
Incomplete Component
@@ -142,6 +147,7 @@ exports[`AssignPermissions Component Accordion Behavior should render accordion
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___lyghz50_53x5ri0 f1s2aq7o f1c21dwh f1s184ao ft85np5 fwrgwhw"
@@ -201,6 +207,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -212,6 +219,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-testGroup"
>
<div
class="ms-Stack css-113"
@@ -233,6 +241,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -282,6 +291,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -331,6 +341,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div>
Incomplete Component
@@ -339,6 +350,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___lyghz50_53x5ri0 f1s2aq7o f1c21dwh f1s184ao ft85np5 fwrgwhw"
@@ -398,6 +410,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -409,6 +422,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-testGroup"
>
<div
class="ms-Stack css-113"
@@ -430,6 +444,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -479,6 +494,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -528,6 +544,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div>
Incomplete Component
@@ -536,6 +553,7 @@ exports[`AssignPermissions Component Edge Cases should calculate correct indent
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___lyghz50_53x5ri0 f1s2aq7o f1c21dwh f1s184ao ft85np5 fwrgwhw"
@@ -595,6 +613,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -606,6 +625,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-testGroup"
>
<div
class="ms-Stack css-113"
@@ -627,6 +647,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -676,6 +697,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -725,6 +747,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div>
Incomplete Component
@@ -733,6 +756,7 @@ exports[`AssignPermissions Component Edge Cases should handle missing account na
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___lyghz50_53x5ri0 f1s2aq7o f1c21dwh f1s184ao ft85np5 fwrgwhw"
@@ -792,6 +816,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -803,6 +828,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-crossAccountConfigs"
>
<div
class="ms-Stack css-113"
@@ -824,6 +850,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -875,6 +902,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
</div>
<div
class="ms-Stack css-112"
data-test="permission-group-container-onlineConfigs"
>
<div
class="ms-Stack css-113"
@@ -896,6 +924,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -945,6 +974,7 @@ exports[`AssignPermissions Component Permission Groups should render multiple pe
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div
data-testid="online-copy-enabled"
@@ -964,6 +994,7 @@ exports[`AssignPermissions Component Permission Groups should render online migr
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -975,6 +1006,7 @@ exports[`AssignPermissions Component Permission Groups should render online migr
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-onlineConfigs"
>
<div
class="ms-Stack css-113"
@@ -996,6 +1028,7 @@ exports[`AssignPermissions Component Permission Groups should render online migr
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -1045,6 +1078,7 @@ exports[`AssignPermissions Component Permission Groups should render online migr
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -1094,6 +1128,7 @@ exports[`AssignPermissions Component Permission Groups should render online migr
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div
data-testid="online-copy-enabled"
@@ -1113,6 +1148,7 @@ exports[`AssignPermissions Component Permission Groups should render permission
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -1124,6 +1160,7 @@ exports[`AssignPermissions Component Permission Groups should render permission
>
<div
class="ms-Stack css-112"
data-test="permission-group-container-crossAccountConfigs"
>
<div
class="ms-Stack css-113"
@@ -1145,6 +1182,7 @@ exports[`AssignPermissions Component Permission Groups should render permission
>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -1194,6 +1232,7 @@ exports[`AssignPermissions Component Permission Groups should render permission
</div>
<div
class="fui-AccordionItem"
data-test="accordion-item"
>
<div
class="fui-AccordionHeader accordionHeader ___kex8dp0_1udlp87 f19n0e5 f1c21dwh f1s184ao ft85np5"
@@ -1243,6 +1282,7 @@ exports[`AssignPermissions Component Permission Groups should render permission
<div
aria-disabled="false"
class="fui-AccordionPanel accordionPanel ___1rufncu_1hx1scr f1axvtxu"
data-test="accordion-panel"
>
<div
data-testid="add-read-permission"
@@ -1262,6 +1302,7 @@ exports[`AssignPermissions Component Rendering should render without crashing wi
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"
@@ -1283,6 +1324,7 @@ exports[`AssignPermissions Component Rendering should render without crashing wi
<div>
<div
class="ms-Stack assignPermissionsContainer css-109"
data-test="Panel:AssignPermissionsContainer"
>
<span
class="css-110"

5
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/__snapshots__/DefaultManagedIdentity.test.tsx.snap
View File

@@ -41,6 +41,7 @@ exports[`DefaultManagedIdentity Edge Cases should handle missing account name gr
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle14"
role="switch"
type="button"
@@ -103,6 +104,7 @@ exports[`DefaultManagedIdentity Edge Cases should handle null account 1`] = `
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle15"
role="switch"
type="button"
@@ -165,6 +167,7 @@ exports[`DefaultManagedIdentity Loading States should render loading state snaps
class="ms-Toggle-background pill-119"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle10"
role="switch"
type="button"
@@ -256,6 +259,7 @@ exports[`DefaultManagedIdentity Rendering should render correctly with default s
class="ms-Toggle-background pill-115"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle0"
role="switch"
type="button"
@@ -318,6 +322,7 @@ exports[`DefaultManagedIdentity Toggle Interactions should render toggle with ch
class="ms-Toggle-background pill-119"
data-is-focusable="true"
data-ktp-target="true"
data-test="btn-toggle"
id="Toggle7"
role="switch"
type="button"

5
src/Explorer/ContainerCopy/CreateCopyJob/Screens/AssignPermissions/__snapshots__/PointInTimeRestore.test.tsx.snap
View File

@@ -56,6 +56,7 @@ exports[`PointInTimeRestore Initial Render should render correctly with default
<button
class="ms-Button ms-Button--primary fullWidth root-115"
data-is-focusable="true"
data-test="pointInTimeRestore:PrimaryBtn"
type="button"
>
<span
@@ -131,6 +132,7 @@ exports[`PointInTimeRestore Initial Render should render with empty account name
<button
class="ms-Button ms-Button--primary fullWidth root-115"
data-is-focusable="true"
data-test="pointInTimeRestore:PrimaryBtn"
type="button"
>
<span
@@ -161,6 +163,7 @@ exports[`PointInTimeRestore Snapshots should match snapshot in loading state 1`]
>
<div
class="ms-Overlay root-123"
data-test="loading-overlay"
>
<div
class="ms-Spinner root-125"
@@ -223,6 +226,7 @@ exports[`PointInTimeRestore Snapshots should match snapshot in loading state 1`]
aria-disabled="true"
class="ms-Button ms-Button--primary is-disabled fullWidth root-128"
data-is-focusable="false"
data-test="pointInTimeRestore:PrimaryBtn"
disabled=""
type="button"
>
@@ -301,6 +305,7 @@ exports[`PointInTimeRestore Snapshots should match snapshot with refresh button
<button
class="ms-Button ms-Button--primary fullWidth root-115"
data-is-focusable="true"
data-test="pointInTimeRestore:RefreshBtn"
type="button"
>
<span

1
src/Explorer/ContainerCopy/CreateCopyJob/Screens/Components/PopoverContainer.tsx
View File

@@ -17,6 +17,7 @@ const PopoverContainer: React.FC<PopoverContainerProps> = React.memo(
({ isLoading = false, title, children, onPrimary, onCancel }) => {
return (
<Stack
data-test="popover-container"
className={`popover-container foreground ${isLoading ? "loading" : ""}`}
tokens={{ childrenGap: 20 }}
style={{ maxWidth: 450 }}

8
src/Explorer/ContainerCopy/CreateCopyJob/Screens/Components/__snapshots__/PopoverContainer.test.tsx.snap
View File

@@ -4,6 +4,7 @@ exports[`PopoverMessage Component Edge Cases should handle empty string title 1`
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -71,6 +72,7 @@ exports[`PopoverMessage Component Edge Cases should handle null children 1`] = `
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -133,6 +135,7 @@ exports[`PopoverMessage Component Edge Cases should handle undefined children 1`
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -195,6 +198,7 @@ exports[`PopoverMessage Component Edge Cases should handle very long title 1`] =
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -266,6 +270,7 @@ exports[`PopoverMessage Component Rendering should render correctly when visible
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -335,6 +340,7 @@ exports[`PopoverMessage Component Rendering should render correctly with differe
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -409,6 +415,7 @@ exports[`PopoverMessage Component Rendering should render correctly with differe
<div>
<div
class="ms-Stack popover-container foreground css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<span
@@ -478,6 +485,7 @@ exports[`PopoverMessage Component Rendering should render correctly with loading
<div>
<div
class="ms-Stack popover-container foreground loading css-109"
data-test="popover-container"
style="max-width: 450px;"
>
<div

1
src/Explorer/ContainerCopy/CreateCopyJob/Screens/CreateCopyJobScreens.tsx
View File

@@ -22,6 +22,7 @@ const CreateCopyJobScreens: React.FC = () => {
<Stack.Item className="createCopyJobScreensContent">
{contextError && (
<MessageBar
data-test="Panel:ErrorContainer"
className="createCopyJobErrorMessageBar"
messageBarType={MessageBarType.blocked}
isMultiline={false}

8
src/Explorer/ContainerCopy/CreateCopyJob/Screens/PreviewCopyJob/PreviewCopyJob.tsx
View File

@@ -31,17 +31,17 @@ const PreviewCopyJob: React.FC = () => {
}));
};
return (
<Stack tokens={{ childrenGap: 20 }} className="previewCopyJobContainer">
<Stack tokens={{ childrenGap: 20 }} className="previewCopyJobContainer" data-test="Panel:PreviewCopyJob">
<FieldRow label={ContainerCopyMessages.jobNameLabel}>
<TextField value={jobName} onChange={onJobNameChange} />
<TextField data-test="job-name-textfield" value={jobName} onChange={onJobNameChange} />
</FieldRow>
<Stack>
<Text className="bold">{ContainerCopyMessages.sourceSubscriptionLabel}</Text>
<Text>{copyJobState.source?.subscription?.displayName}</Text>
<Text data-test="source-subscription-name">{copyJobState.source?.subscription?.displayName}</Text>
</Stack>
<Stack>
<Text className="bold">{ContainerCopyMessages.sourceAccountLabel}</Text>
<Text>{copyJobState.source?.account?.name}</Text>
<Text data-test="source-account-name">{copyJobState.source?.account?.name}</Text>
</Stack>
<Stack>
<DetailsList

34
src/Explorer/ContainerCopy/CreateCopyJob/Screens/PreviewCopyJob/__snapshots__/PreviewCopyJob.test.tsx.snap
View File

@@ -3,6 +3,7 @@
exports[`PreviewCopyJob should handle special characters in database and container names 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -32,6 +33,7 @@ exports[`PreviewCopyJob should handle special characters in database and contain
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField84"
type="text"
value="job-with@special#chars_123"
@@ -51,6 +53,7 @@ exports[`PreviewCopyJob should handle special characters in database and contain
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -65,6 +68,7 @@ exports[`PreviewCopyJob should handle special characters in database and contain
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -321,6 +325,7 @@ exports[`PreviewCopyJob should handle special characters in database and contain
exports[`PreviewCopyJob should render component with cross-subscription setup 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -350,6 +355,7 @@ exports[`PreviewCopyJob should render component with cross-subscription setup 1`
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField96"
type="text"
value=""
@@ -369,6 +375,7 @@ exports[`PreviewCopyJob should render component with cross-subscription setup 1`
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -383,6 +390,7 @@ exports[`PreviewCopyJob should render component with cross-subscription setup 1`
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -639,6 +647,7 @@ exports[`PreviewCopyJob should render component with cross-subscription setup 1`
exports[`PreviewCopyJob should render with default state and empty job name 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -668,6 +677,7 @@ exports[`PreviewCopyJob should render with default state and empty job name 1`]
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField0"
type="text"
value=""
@@ -687,6 +697,7 @@ exports[`PreviewCopyJob should render with default state and empty job name 1`]
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -701,6 +712,7 @@ exports[`PreviewCopyJob should render with default state and empty job name 1`]
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -957,6 +969,7 @@ exports[`PreviewCopyJob should render with default state and empty job name 1`]
exports[`PreviewCopyJob should render with long subscription and account names 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -986,6 +999,7 @@ exports[`PreviewCopyJob should render with long subscription and account names 1
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField60"
type="text"
value=""
@@ -1005,6 +1019,7 @@ exports[`PreviewCopyJob should render with long subscription and account names 1
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
This is a very long subscription name that might cause display issues if not handled properly
</span>
@@ -1019,6 +1034,7 @@ exports[`PreviewCopyJob should render with long subscription and account names 1
</span>
<span
class="css-125"
data-test="source-account-name"
>
this-is-a-very-long-database-account-name-that-might-cause-display-issues
</span>
@@ -1275,6 +1291,7 @@ exports[`PreviewCopyJob should render with long subscription and account names 1
exports[`PreviewCopyJob should render with missing source account information 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -1304,6 +1321,7 @@ exports[`PreviewCopyJob should render with missing source account information 1`
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField36"
type="text"
value=""
@@ -1323,6 +1341,7 @@ exports[`PreviewCopyJob should render with missing source account information 1`
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -1588,6 +1607,7 @@ exports[`PreviewCopyJob should render with missing source account information 1`
exports[`PreviewCopyJob should render with missing source subscription information 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -1617,6 +1637,7 @@ exports[`PreviewCopyJob should render with missing source subscription informati
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField24"
type="text"
value=""
@@ -1645,6 +1666,7 @@ exports[`PreviewCopyJob should render with missing source subscription informati
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -1901,6 +1923,7 @@ exports[`PreviewCopyJob should render with missing source subscription informati
exports[`PreviewCopyJob should render with online migration type 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -1930,6 +1953,7 @@ exports[`PreviewCopyJob should render with online migration type 1`] = `
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField72"
type="text"
value="online-migration-job"
@@ -1949,6 +1973,7 @@ exports[`PreviewCopyJob should render with online migration type 1`] = `
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -1963,6 +1988,7 @@ exports[`PreviewCopyJob should render with online migration type 1`] = `
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -2219,6 +2245,7 @@ exports[`PreviewCopyJob should render with online migration type 1`] = `
exports[`PreviewCopyJob should render with pre-filled job name 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -2248,6 +2275,7 @@ exports[`PreviewCopyJob should render with pre-filled job name 1`] = `
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField12"
type="text"
value="custom-job-name-123"
@@ -2267,6 +2295,7 @@ exports[`PreviewCopyJob should render with pre-filled job name 1`] = `
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -2281,6 +2310,7 @@ exports[`PreviewCopyJob should render with pre-filled job name 1`] = `
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>
@@ -2537,6 +2567,7 @@ exports[`PreviewCopyJob should render with pre-filled job name 1`] = `
exports[`PreviewCopyJob should render with undefined database and container names 1`] = `
<div
class="ms-Stack previewCopyJobContainer css-109"
data-test="Panel:PreviewCopyJob"
>
<div
class="ms-Stack flex-row css-110"
@@ -2566,6 +2597,7 @@ exports[`PreviewCopyJob should render with undefined database and container name
<input
aria-invalid="false"
class="ms-TextField-field field-115"
data-test="job-name-textfield"
id="TextField48"
type="text"
value=""
@@ -2585,6 +2617,7 @@ exports[`PreviewCopyJob should render with undefined database and container name
</span>
<span
class="css-125"
data-test="source-subscription-name"
>
Test Subscription
</span>
@@ -2599,6 +2632,7 @@ exports[`PreviewCopyJob should render with undefined database and container name
</span>
<span
class="css-125"
data-test="source-account-name"
>
test-account
</span>

2
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectAccount/Components/MigrationTypeCheckbox.tsx
View File

@@ -10,7 +10,7 @@ interface MigrationTypeCheckboxProps {
}
export const MigrationTypeCheckbox: React.FC<MigrationTypeCheckboxProps> = React.memo(({ checked, onChange }) => (
<Stack horizontal horizontalAlign="space-between" className="migrationTypeRow">
<Stack horizontal horizontalAlign="space-between" className="migrationTypeRow" data-test="migration-type-checkbox">
<Checkbox label={ContainerCopyMessages.migrationTypeCheckboxLabel} checked={checked} onChange={onChange} />
</Stack>
));

2
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectAccount/Components/__snapshots__/MigrationTypeCheckbox.test.tsx.snap
View File

@@ -3,6 +3,7 @@
exports[`MigrationTypeCheckbox Component Rendering should render in checked state 1`] = `
<div
class="ms-Stack migrationTypeRow css-109"
data-test="migration-type-checkbox"
>
<div
class="ms-Checkbox is-checked is-enabled root-119"
@@ -43,6 +44,7 @@ exports[`MigrationTypeCheckbox Component Rendering should render in checked stat
exports[`MigrationTypeCheckbox Component Rendering should render with default props (unchecked state) 1`] = `
<div
class="ms-Stack migrationTypeRow css-109"
data-test="migration-type-checkbox"
>
<div
class="ms-Checkbox is-enabled root-110"

8
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectSourceAndTargetContainers/SelectSourceAndTargetContainers.tsx
View File

@@ -47,7 +47,11 @@ const SelectSourceAndTargetContainers = ({ showAddCollectionPanel }: SelectSourc
const onDropdownChange = dropDownChangeHandler(setCopyJobState);
return (
<Stack className="selectSourceAndTargetContainers" tokens={{ childrenGap: 25 }}>
<Stack
data-test="Panel:SelectSourceAndTargetContainers"
className="selectSourceAndTargetContainers"
tokens={{ childrenGap: 25 }}
>
<span>{ContainerCopyMessages.selectSourceAndTargetContainersDescription}</span>
<DatabaseContainerSection
heading={ContainerCopyMessages.sourceContainerSubHeading}
@@ -59,6 +63,7 @@ const SelectSourceAndTargetContainers = ({ showAddCollectionPanel }: SelectSourc
selectedContainer={source?.containerId}
containerDisabled={!source?.databaseId}
containerOnChange={onDropdownChange("sourceContainer")}
sectionType="source"
/>
<DatabaseContainerSection
heading={ContainerCopyMessages.targetContainerSubHeading}
@@ -71,6 +76,7 @@ const SelectSourceAndTargetContainers = ({ showAddCollectionPanel }: SelectSourc
containerDisabled={!target?.databaseId}
containerOnChange={onDropdownChange("targetContainer")}
handleOnDemandCreateContainer={showAddCollectionPanel}
sectionType="target"
/>
</Stack>
);

6
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectSourceAndTargetContainers/components/DatabaseContainerSection.test.tsx
View File

@@ -32,6 +32,7 @@ describe("DatabaseContainerSection", () => {
selectedContainer: "container1",
containerDisabled: false,
containerOnChange: mockContainerOnChange,
sectionType: "source",
};
beforeEach(() => {
@@ -292,6 +293,7 @@ describe("DatabaseContainerSection", () => {
containerOptions: mockContainerOptions,
selectedContainer: "container1",
containerOnChange: mockContainerOnChange,
sectionType: "source",
};
render(<DatabaseContainerSection {...minimalProps} />);
@@ -393,6 +395,7 @@ describe("DatabaseContainerSection", () => {
containerOptions: [{ key: "c1", text: "Container 1", data: { id: "c1" } }],
selectedContainer: "c1",
containerOnChange: jest.fn(),
sectionType: "source",
};
const { container } = render(<DatabaseContainerSection {...minimalProps} />);
@@ -411,6 +414,7 @@ describe("DatabaseContainerSection", () => {
containerDisabled: false,
containerOnChange: jest.fn(),
handleOnDemandCreateContainer: jest.fn(),
sectionType: "target",
};
const { container } = render(<DatabaseContainerSection {...fullProps} />);
@@ -428,6 +432,7 @@ describe("DatabaseContainerSection", () => {
selectedContainer: "container1",
containerDisabled: true,
containerOnChange: jest.fn(),
sectionType: "target",
};
const { container } = render(<DatabaseContainerSection {...disabledProps} />);
@@ -443,6 +448,7 @@ describe("DatabaseContainerSection", () => {
containerOptions: [],
selectedContainer: "",
containerOnChange: jest.fn(),
sectionType: "target",
};
const { container } = render(<DatabaseContainerSection {...emptyOptionsProps} />);

3
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectSourceAndTargetContainers/components/DatabaseContainerSection.tsx
View File

@@ -15,6 +15,7 @@ export const DatabaseContainerSection = ({
containerDisabled,
containerOnChange,
handleOnDemandCreateContainer,
sectionType,
}: DatabaseContainerSectionProps) => (
<Stack tokens={{ childrenGap: 15 }} className="databaseContainerSection">
<label className="subHeading">{heading}</label>
@@ -27,6 +28,7 @@ export const DatabaseContainerSection = ({
disabled={!!databaseDisabled}
selectedKey={selectedDatabase}
onChange={databaseOnChange}
data-test={`${sectionType}-databaseDropdown`}
/>
</FieldRow>
<FieldRow label={ContainerCopyMessages.containerDropdownLabel}>
@@ -39,6 +41,7 @@ export const DatabaseContainerSection = ({
disabled={!!containerDisabled}
selectedKey={selectedContainer}
onChange={containerOnChange}
data-test={`${sectionType}-containerDropdown`}
/>
{handleOnDemandCreateContainer && (
<ActionButton className="create-container-link-btn" onClick={() => handleOnDemandCreateContainer()}>

8
src/Explorer/ContainerCopy/CreateCopyJob/Screens/SelectSourceAndTargetContainers/components/__snapshots__/DatabaseContainerSection.test.tsx.snap
View File

@@ -37,6 +37,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with all pro
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="target-databaseDropdown"
id="Dropdown98"
role="combobox"
tabindex="0"
@@ -94,6 +95,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with all pro
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="target-containerDropdown"
id="Dropdown99"
role="combobox"
tabindex="0"
@@ -182,6 +184,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with disable
class="ms-Dropdown is-disabled is-required dropdown-143"
data-is-focusable="false"
data-ktp-target="true"
data-test="target-databaseDropdown"
id="Dropdown103"
role="combobox"
tabindex="-1"
@@ -239,6 +242,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with disable
class="ms-Dropdown is-disabled is-required dropdown-143"
data-is-focusable="false"
data-ktp-target="true"
data-test="target-containerDropdown"
id="Dropdown104"
role="combobox"
tabindex="-1"
@@ -306,6 +310,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with empty o
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="target-databaseDropdown"
id="Dropdown105"
role="combobox"
tabindex="0"
@@ -363,6 +368,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with empty o
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="target-containerDropdown"
id="Dropdown106"
role="combobox"
tabindex="0"
@@ -430,6 +436,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with minimal
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="source-databaseDropdown"
id="Dropdown96"
role="combobox"
tabindex="0"
@@ -487,6 +494,7 @@ exports[`DatabaseContainerSection Snapshot Testing matches snapshot with minimal
class="ms-Dropdown is-required dropdown-112"
data-is-focusable="true"
data-ktp-target="true"
data-test="source-containerDropdown"
id="Dropdown97"
role="combobox"
tabindex="0"