groot/automatisch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: add major data-test attributes

Browse Source
This commit is contained in:
Ali BARIN
2022-10-08 23:57:23 +02:00
parent 38bcf6ada0
commit e47c54b336
25 changed files with 59 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/web/src/components/AccountDropdownMenu/index.tsx
View File

@@ -62,6 +62,7 @@ function AccountDropdownMenu(props: AccountDropdownMenuProps): React.ReactElemen
<MenuItem
onClick={logout}
data-test="logout-item"
>
{formatMessage('accountDropdownMenu.logout')}
</MenuItem>

3
packages/web/src/components/AddAppConnection/index.tsx
View File

@@ -84,7 +84,7 @@ export default function AddAppConnection(props: AddAppConnectionProps): React.Re
}, [connectionId, key, steps, onClose]);
return (
<Dialog open={true} onClose={onClose}>
<Dialog open={true} onClose={onClose} data-test="add-app-connection-dialog">
<DialogTitle>{hasConnection ? formatMessage('app.reconnectConnection') : formatMessage('app.addConnection')}</DialogTitle>
<Alert severity="info" sx={{ fontWeight: 300 }}>
@@ -114,6 +114,7 @@ export default function AddAppConnection(props: AddAppConnectionProps): React.Re
color="primary"
sx={{ boxShadow: 2 }}
loading={inProgress}
data-test="create-connection-button"
>
{formatMessage('addAppConnection.submit')}
</LoadingButton>

3
packages/web/src/components/AddNewAppConnection/index.tsx
View File

@@ -95,6 +95,7 @@ export default function AddNewAppConnection(props: AddNewAppConnectionProps): Re
</InputAdornment>
}
label={formatMessage('apps.searchApp')}
data-test="search-for-app-text-field"
/>
</FormControl>
@@ -102,7 +103,7 @@ export default function AddNewAppConnection(props: AddNewAppConnectionProps): Re
{loading && <CircularProgress sx={{ display: 'block', margin: '20px auto' }} />}
{!loading && data?.getApps?.map((app: IApp) => (
<ListItem disablePadding key={app.name}>
<ListItem disablePadding key={app.name} data-test="app-list-item">
<ListItemButton component={Link} to={createConnectionOrFlow(app.name.toLowerCase(), app.supportsConnections)}>
<ListItemIcon sx={{ minWidth: 74 }}>
<AppIcon color="transparent" url={app.iconUrl} name={app.name} />

1
packages/web/src/components/AppBar/index.tsx
View File

@@ -82,6 +82,7 @@ export default function AppBar(props: AppBarProps): React.ReactElement {
onClick={handleAccountMenuOpen}
aria-controls={accountMenuId}
aria-label="open profile menu"
data-test="profile-menu-button"
>
<AccountCircleIcon />
</IconButton>

2
packages/web/src/components/AppConnectionRow/index.tsx
View File

@@ -79,7 +79,7 @@ function AppConnectionRow(props: AppConnectionRowProps): React.ReactElement {
return (
<>
<Card sx={{ my: 2 }}>
<Card sx={{ my: 2 }} data-test="app-connection-row">
<CardActionArea onClick={onContextMenuClick}>
<CardContent>
<Stack

2
packages/web/src/components/AppRow/index.tsx
View File

@@ -30,7 +30,7 @@ function AppRow(props: AppRowProps): React.ReactElement {
const { name, primaryColor, iconUrl, connectionCount, flowCount } = props.application;
return (
<Link to={URLS.APP(name.toLowerCase())}>
<Link to={URLS.APP(name.toLowerCase())} data-test="app-row">
<Card sx={{ mb: 1 }}>
<CardActionArea>
<CardContent>

3
packages/web/src/components/ChooseAppAndEventSubstep/index.tsx
View File

@@ -152,6 +152,7 @@ function ChooseAppAndEventSubstep(
)}
value={getOption(appOptions, step.appKey)}
onChange={onAppChange}
data-test="choose-app-autocomplete"
/>
{step.appKey && (
@@ -175,6 +176,7 @@ function ChooseAppAndEventSubstep(
)}
value={getOption(actionOptions, step.key)}
onChange={onEventChange}
data-test="choose-event-autocomplete"
/>
</Box>
)}
@@ -197,6 +199,7 @@ function ChooseAppAndEventSubstep(
onClick={onSubmit}
sx={{ mt: 2 }}
disabled={!valid || editorContext.readOnly}
data-test="flow-substep-continue-button"
>
Continue
</Button>

3
packages/web/src/components/ChooseConnectionSubstep/index.tsx
View File

@@ -126,6 +126,7 @@ function ChooseConnectionSubstep(props: ChooseConnectionSubstepProps): React.Rea
value={getOption(connectionOptions, connection?.id)}
onChange={handleChange}
loading={loading}
data-test="choose-connection-autocomplete"
/>
<Button
@@ -133,7 +134,7 @@ function ChooseConnectionSubstep(props: ChooseConnectionSubstepProps): React.Rea
variant="contained"
onClick={onSubmit}
sx={{ mt: 2 }}
disabled={testResultLoading || !connection?.verified || editorContext.readOnly}
disabled={testResultLoading || !connection?.verified || editorContext.readOnly}data-test="flow-substep-continue-button"
>
Continue
</Button>

1
packages/web/src/components/ControlledAutocomplete/index.tsx
View File

@@ -55,6 +55,7 @@ function ControlledAutocomplete(props: ControlledAutocompleteProps): React.React
}}
onBlur={(...args) => { controllerOnBlur(); onBlur?.(...args); }}
ref={ref}
data-test={`${name}-autocomplete`}
/>
<FormHelperText

4
packages/web/src/components/Drawer/index.tsx
View File

@@ -18,6 +18,7 @@ type DrawerLink = {
primary: string;
to: string;
badgeContent?: React.ReactNode;
dataTest?: string;
};
type DrawerProps = {
@@ -49,13 +50,14 @@ export default function Drawer(props: DrawerProps): React.ReactElement {
<Toolbar />
<List sx={{ py: 0, mt: 3 }}>
{links.map(({ Icon, primary, to }, index) => (
{links.map(({ Icon, primary, to, dataTest }, index) => (
<ListItemLink
key={`${to}-${index}`}
icon={<Icon htmlColor={theme.palette.primary.main} />}
primary={formatMessage(primary)}
to={to}
onClick={closeOnClick}
data-test={dataTest}
/>
))}
</List>

18
packages/web/src/components/EditorLayout/index.tsx
View File

@@ -74,6 +74,7 @@ export default function EditorLayout(): React.ReactElement {
size="small"
component={Link}
to={URLS.FLOWS}
data-test="editor-go-back-button"
>
<ArrowBackIosNewIcon fontSize="small" />
</IconButton>
@@ -92,7 +93,12 @@ export default function EditorLayout(): React.ReactElement {
</Box>
<Box pr={1}>
<Button variant="contained" size="small" onClick={() => onFlowStatusUpdate(!flow.active)}>
<Button
variant="contained"
size="small"
onClick={() => onFlowStatusUpdate(!flow.active)}
data-test={flow?.active ? 'unpublish-flow-button' : 'publish-flow-button'}
>
{flow?.active ? formatMessage('flowEditor.unpublish') : formatMessage('flowEditor.publish')}
</Button>
</Box>
@@ -108,13 +114,19 @@ export default function EditorLayout(): React.ReactElement {
</Stack>
<Snackbar
data-test="flow-cannot-edit-info-snackbar"
open={!!flow?.active}
message={formatMessage('flowEditor.publishedFlowCannotBeUpdated')}
anchorOrigin={{ horizontal: 'center', vertical: 'bottom' }}
ContentProps={{ sx: { fontWeight: 300 }}}
action={(
<Button variant="contained" size="small" onClick={() => onFlowStatusUpdate(!flow.active)}>
{flow?.active ? formatMessage('flowEditor.unpublish') : formatMessage('flowEditor.publish')}
<Button
variant="contained"
size="small"
onClick={() => onFlowStatusUpdate(!flow.active)}
data-test="unpublish-flow-from-snackbar"
>
{formatMessage('flowEditor.unpublish')}
</Button>
)}
/>

2
packages/web/src/components/ExecutionRow/index.tsx
View File

@@ -25,7 +25,7 @@ export default function ExecutionRow(props: ExecutionRowProps): React.ReactEleme
const relativeCreatedAt = createdAt.toRelative();
return (
<Link to={URLS.EXECUTION(execution.id)}>
<Link to={URLS.EXECUTION(execution.id)} data-test="execution-row">
<Card sx={{ mb: 1 }}>
<CardActionArea>
<CardContent>

8
packages/web/src/components/ExecutionStep/index.tsx
View File

@@ -41,7 +41,7 @@ export default function ExecutionStep(props: ExecutionStepProps): React.ReactEle
const validationStatusIcon = executionStep.status === 'success' ? validIcon : errorIcon;
return (
<Wrapper elevation={1}>
<Wrapper elevation={1} data-test="execution-step">
<Header>
<Stack direction="row" alignItems="center" gap={2}>
<AppIconWrapper>
@@ -71,9 +71,9 @@ export default function ExecutionStep(props: ExecutionStepProps): React.ReactEle
<Content sx={{ px: 2 }}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<Tabs value={activeTabIndex} onChange={(event, tabIndex) => setActiveTabIndex(tabIndex)}>
<Tab label="Data in" />
<Tab label="Data out" />
<Tab label="Error" />
<Tab label="Data in" data-test="data-in-tab" />
<Tab label="Data out" data-test="data-out-tab" />
<Tab label="Error" data-test="error-tab" />
<Tab label="Execution step" />
</Tabs>
</Box>

2
packages/web/src/components/FlowStep/index.tsx
View File

@@ -182,7 +182,7 @@ export default function FlowStep(
step.status === 'completed' ? validIcon : errorIcon;
return (
<Wrapper elevation={collapsed ? 1 : 4} onClick={onOpen}>
<Wrapper elevation={collapsed ? 1 : 4} onClick={onOpen} data-test="flow-step">
<Header collapsed={collapsed}>
<Stack direction="row" alignItems="center" gap={2}>
<AppIconWrapper>

1
packages/web/src/components/FlowSubstep/index.tsx
View File

@@ -100,6 +100,7 @@ function FlowSubstep(props: FlowSubstepProps): React.ReactElement {
sx={{ mt: 2 }}
disabled={!validationStatus || editorContext.readOnly}
type="submit"
data-test="flow-substep-continue-button"
>
Continue
</Button>

3
packages/web/src/components/Layout/index.tsx
View File

@@ -22,16 +22,19 @@ const drawerLinks = [
Icon: SwapCallsIcon,
primary: 'drawer.flows',
to: URLS.FLOWS,
dataTest: 'flows-page-drawer-link',
},
{
Icon: AppsIcon,
primary: 'drawer.apps',
to: URLS.APPS,
dataTest: 'apps-page-drawer-link',
},
{
Icon: HistoryIcon,
primary: 'drawer.executions',
to: URLS.EXECUTIONS,
dataTest: 'executions-page-drawer-link',
},
];

4
packages/web/src/components/ListItemLink/index.tsx
View File

@@ -10,10 +10,11 @@ type ListItemLinkProps = {
primary: string;
to: string;
onClick?: (event: React.SyntheticEvent) => void;
'data-test'?: string;
}
export default function ListItemLink(props: ListItemLinkProps): React.ReactElement {
const { icon, primary, to, onClick } = props;
const { icon, primary, to, onClick, 'data-test': dataTest } = props;
const selected = useMatch({ path: to, end: true });
const CustomLink = React.useMemo(
@@ -34,6 +35,7 @@ export default function ListItemLink(props: ListItemLinkProps): React.ReactEleme
sx={{ pl: { xs: 2, sm: 3 } }}
selected={!!selected}
onClick={onClick}
data-test={dataTest}
>
<ListItemIcon sx={{ minWidth: 52 }}>{icon}</ListItemIcon>
<ListItemText primary={primary} primaryTypographyProps={{ variant: 'body1', }} />

3
packages/web/src/components/LoginForm/index.tsx
View File

@@ -25,6 +25,7 @@ function renderFields(props: { loading: boolean }) {
fullWidth
margin="dense"
autoComplete="username"
data-test="email-text-field"
/>
<TextField
@@ -35,6 +36,7 @@ function renderFields(props: { loading: boolean }) {
fullWidth
margin="dense"
autoComplete="current-password"
data-test="password-text-field"
/>
<LoadingButton
@@ -44,6 +46,7 @@ function renderFields(props: { loading: boolean }) {
sx={{ boxShadow: 2, mt: 3 }}
loading={loading}
fullWidth
data-test="login-button"
>
Login
</LoadingButton>

3
packages/web/src/components/PowerInput/Suggestions.tsx
View File

@@ -71,6 +71,7 @@ const Suggestions = (props: SuggestionsProps) => {
component="div"
disablePadding
sx={{ maxHeight: LIST_HEIGHT, overflowY: 'auto' }}
data-test="power-input-suggestion-group"
>
{getPartialArray((option.output as any) || [], listLength).map(
(suboption: any, index: number) => (
@@ -78,6 +79,8 @@ const Suggestions = (props: SuggestionsProps) => {
sx={{ pl: 4 }}
divider
onClick={() => onSuggestionClick(suboption)}
data-test="power-input-suggestion-item"
key={`suggestion-${suboption.name}`}
>
<ListItemText
primary={suboption.name}

2
packages/web/src/components/PowerInput/index.tsx
View File

@@ -93,7 +93,7 @@ const PowerInput = (props: PowerInputProps) => {
onClickAway={() => { setShowVariableSuggestions(false); }}
>
{/* ref-able single child for ClickAwayListener */}
<div style={{ width: '100%' }}>
<div style={{ width: '100%' }} data-test="power-input">
<FakeInput disabled={disabled}>
<InputLabelWrapper>
<InputLabel

3
packages/web/src/components/TestSubstep/index.tsx
View File

@@ -106,7 +106,7 @@ function TestSubstep(props: TestSubstepProps): React.ReactElement {
)}
{response && (
<Box sx={{ maxHeight: 400, overflowY: 'auto', width: '100%' }}>
<Box sx={{ maxHeight: 400, overflowY: 'auto', width: '100%' }} data-test="flow-test-substep-output">
<JSONViewer data={response} />
</Box>
)}
@@ -119,6 +119,7 @@ function TestSubstep(props: TestSubstepProps): React.ReactElement {
loading={loading}
disabled={editorContext.readOnly}
color="primary"
data-test="flow-substep-continue-button"
>
{isCompleted && formatMessage('flowEditor.continue')}
{!isCompleted && formatMessage('flowEditor.testAndContinue')}

1
packages/web/src/pages/Application/index.tsx
View File

@@ -126,6 +126,7 @@ export default function Application(): React.ReactElement | null {
component={NewConnectionLink}
fullWidth
icon={<AddIcon />}
data-test="add-connection-button"
>
{formatMessage('app.addConnection')}
</ConditionalIconButton>

3
packages/web/src/pages/Applications/index.tsx
View File

@@ -69,6 +69,7 @@ export default function Applications(): React.ReactElement {
component={NewAppConnectionLink}
fullWidth
icon={<AddIcon />}
data-test="add-connection-button"
>
{formatMessage('apps.addConnection')}
</ConditionalIconButton>
@@ -77,7 +78,7 @@ export default function Applications(): React.ReactElement {
<Divider sx={{ mt: [2, 0], mb: 2 }} />
{loading && <CircularProgress sx={{ display: 'block', margin: '20px auto' }} />}
{loading && <CircularProgress data-test="apps-loader" sx={{ display: 'block', margin: '20px auto' }} />}
{!loading && !hasApps && (<NoResultFound
text={formatMessage('apps.noConnections')}

2
packages/web/src/pages/Executions/index.tsx
View File

@@ -54,7 +54,7 @@ export default function Executions(): React.ReactElement {
<Divider sx={{ mt: [2, 0], mb: 2 }} />
{loading && <CircularProgress sx={{ display: 'block', margin: '20px auto' }} />}
{loading && <CircularProgress data-test="executions-loader" sx={{ display: 'block', margin: '20px auto' }} />}
{!loading && !hasExecutions && (<NoResultFound
text={formatMessage('executions.noExecutions')}

1
packages/web/src/pages/Flows/index.tsx
View File

@@ -110,6 +110,7 @@ export default function Flows(): React.ReactElement {
component={CreateFlowLink}
fullWidth
icon={<AddIcon />}
data-test="create-flow-button"
>
{formatMessage('flows.create')}
</ConditionalIconButton>