951400782

pending completion

Build # 951400782

Build Type

Pull #3900

gitlab-ci

Committed by

web-flow

Commit Message

chore: bump @testing-library/jest-dom from 5.16.5 to 5.17.0

Bumps [@testing-library/jest-dom](https://github.com/testing-library/jest-dom) from 5.16.5 to 5.17.0.
- [Release notes](https://github.com/testing-library/jest-dom/releases)
- [Changelog](https://github.com/testing-library/jest-dom/blob/main/CHANGELOG.md)
- [Commits](https://github.com/testing-library/jest-dom/compare/v5.16.5...v5.17.0)

---
updated-dependencies:
- dependency-name: "@testing-library/jest-dom"
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

Pull Request Pull Request #3900: chore: bump @testing-library/jest-dom from 5.16.5 to 5.17.0

Run Details

4446 of 6414 branches covered (69.32%)

8342 of 10084 relevant lines covered (82.73%)

186.0 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

86.32

/src/js/components/deployments/inprogressdeployments.js

// Copyright 2015 Northern.tech AS
//
//    Licensed under the Apache License, Version 2.0 (the "License");
//    you may not use this file except in compliance with the License.
//    You may obtain a copy of the License at
//
//        http://www.apache.org/licenses/LICENSE-2.0
//
//    Unless required by applicable law or agreed to in writing, software
//    distributed under the License is distributed on an "AS IS" BASIS,
//    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//    See the License for the specific language governing permissions and
//    limitations under the License.
import React, { useCallback, useEffect, useRef, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';

import { Refresh as RefreshIcon } from '@mui/icons-material';
import { makeStyles } from 'tss-react/mui';

import { setSnackbar } from '../../actions/appActions';
import { getDeploymentsByStatus, setDeploymentsState } from '../../actions/deploymentActions';
import { DEPLOYMENT_STATES } from '../../constants/deploymentConstants';
import { onboardingSteps } from '../../constants/onboardingConstants';
import {
  getDeploymentsByStatus as getDeploymentsByStatusSelector,
  getDeploymentsSelectionState,
  getDevicesById,
  getIdAttribute,
  getIsEnterprise,
  getMappedDeploymentSelection,
  getOnboardingState,
  getUserCapabilities
} from '../../selectors';
import { getOnboardingComponentFor } from '../../utils/onboardingmanager';
import useWindowSize from '../../utils/resizehook';
import { clearAllRetryTimers, clearRetryTimer, setRetryTimer } from '../../utils/retrytimer';
import LinedHeader from '../common/lined-header';
import Loader from '../common/loader';
import { defaultRefreshDeploymentsLength as refreshDeploymentsLength } from './deployments';
import DeploymentsList from './deploymentslist';

export const minimalRefreshDeploymentsLength = 2000;

const useStyles = makeStyles()(theme => ({
  deploymentsPending: {
    borderColor: 'rgba(0, 0, 0, 0.06)',
    backgroundColor: theme.palette.background.light,
    color: theme.palette.text.primary,
    ['.dashboard-header span']: {
      backgroundColor: theme.palette.background.light,
      color: theme.palette.text.primary
    },
    ['.MuiButtonBase-root']: {
      color: theme.palette.text.primary
    }
  }
}));

export const Progress = ({ abort, createClick, ...remainder }) => {
  const dispatch = useDispatch();
  const dispatchedSetSnackbar = (...args) => dispatch(setSnackbar(...args));
  const { canConfigure, canDeploy } = useSelector(getUserCapabilities);
  const { attribute: idAttribute } = useSelector(getIdAttribute);
  const onboardingState = useSelector(getOnboardingState);
  const isEnterprise = useSelector(getIsEnterprise);
  const {
    finished: { total: pastDeploymentsCount },
    pending: { total: pendingCount },
    inprogress: { total: progressCount }
  } = useSelector(getDeploymentsByStatusSelector);
  const progress = useSelector(state => getMappedDeploymentSelection(state, DEPLOYMENT_STATES.inprogress));
  const pending = useSelector(state => getMappedDeploymentSelection(state, DEPLOYMENT_STATES.pending));
  const selectionState = useSelector(getDeploymentsSelectionState);
  const devices = useSelector(getDevicesById);

  const { page: progressPage, perPage: progressPerPage } = selectionState.inprogress;
  const { page: pendingPage, perPage: pendingPerPage } = selectionState.pending;

  const [currentRefreshDeploymentLength, setCurrentRefreshDeploymentLength] = useState(refreshDeploymentsLength);
  const [doneLoading, setDoneLoading] = useState(!!(progressCount || pendingCount));
  // eslint-disable-next-line no-unused-vars
  const size = useWindowSize();

  const inprogressRef = useRef();
  const dynamicTimer = useRef();

  const { classes } = useStyles();

  useEffect(() => {
    return () => {
      clearAllRetryTimers(dispatchedSetSnackbar);
    };
  }, []);

  useEffect(() => {
    clearTimeout(dynamicTimer.current);
    setupDeploymentsRefresh(minimalRefreshDeploymentsLength);
    return () => {
      clearTimeout(dynamicTimer.current);
    };
  }, [pendingCount]);

  useEffect(() => {
    clearTimeout(dynamicTimer.current);
    setupDeploymentsRefresh();
    return () => {
      clearInterval(dynamicTimer.current);
    };
  }, [progressPage, progressPerPage, pendingPage, pendingPerPage]);

  const setupDeploymentsRefresh = (refreshLength = currentRefreshDeploymentLength) => {
    let tasks = [refreshDeployments(DEPLOYMENT_STATES.inprogress), refreshDeployments(DEPLOYMENT_STATES.pending)];
    if (!onboardingState.complete && !pastDeploymentsCount) {
      // retrieve past deployments outside of the regular refresh cycle to not change the selection state for past deployments
      dispatch(getDeploymentsByStatus(DEPLOYMENT_STATES.finished, 1, 1, undefined, undefined, undefined, undefined, false));
    }
    return Promise.all(tasks)
      .then(() => {
        const currentRefreshDeploymentLength = Math.min(refreshDeploymentsLength, refreshLength * 2);
        setCurrentRefreshDeploymentLength(currentRefreshDeploymentLength);
        clearTimeout(dynamicTimer.current);
        dynamicTimer.current = setTimeout(setupDeploymentsRefresh, currentRefreshDeploymentLength);
      })
      .finally(() => setDoneLoading(true));
  };

  // deploymentStatus = <inprogress|pending>
  const refreshDeployments = useCallback(
    deploymentStatus => {
      const { page, perPage } = selectionState[deploymentStatus];
      return dispatch(getDeploymentsByStatus(deploymentStatus, page, perPage))
        .then(deploymentsAction => {
          clearRetryTimer(deploymentStatus, dispatchedSetSnackbar);
          const { total, deploymentIds } = deploymentsAction[deploymentsAction.length - 1];
          if (total && !deploymentIds.length) {
            return refreshDeployments(deploymentStatus);
          }
        })
        .catch(err => setRetryTimer(err, 'deployments', `Couldn't load deployments.`, refreshDeploymentsLength, dispatchedSetSnackbar))
        .finally(() => setDoneLoading(true));
    },
    [pendingPage, pendingPerPage, progressPage, progressPerPage]
  );

  const abortDeployment = id =>
    abort(id).then(() => Promise.all([refreshDeployments(DEPLOYMENT_STATES.inprogress), refreshDeployments(DEPLOYMENT_STATES.pending)]));

  let onboardingComponent = null;
  if (!onboardingState.complete && inprogressRef.current) {
    const anchor = {
      left: inprogressRef.current.offsetLeft + (inprogressRef.current.offsetWidth / 100) * 90,
      top: inprogressRef.current.offsetTop + inprogressRef.current.offsetHeight
    };
    onboardingComponent = getOnboardingComponentFor(onboardingSteps.DEPLOYMENTS_INPROGRESS, onboardingState, { anchor });
  }
  const props = { ...remainder, canDeploy, canConfigure, devices, idAttribute, isEnterprise };
  return doneLoading ? (
    <div className="fadeIn">
      {!!progress.length && (
        <div className="margin-left">
          <LinedHeader className="margin-top-large  margin-right" heading="In progress now" />
          <DeploymentsList
            {...props}
            abort={abortDeployment}
            count={progressCount}
            items={progress}
            listClass="margin-right-small"
            page={progressPage}
            pageSize={progressPerPage}
            rootRef={inprogressRef}
            onChangeRowsPerPage={perPage => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.inprogress]: { page: 1, perPage } }))}
            onChangePage={page => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.inprogress]: { page } }))}
            type={DEPLOYMENT_STATES.inprogress}
          />
        </div>
      )}
      {!!onboardingComponent && onboardingComponent}
      {!!pending.length && (
        <div className={`deployments-pending margin-top margin-bottom-large ${classes.deploymentsPending}`}>
          <LinedHeader className="margin-small margin-top" heading="Pending" />
          <DeploymentsList
            {...props}
            abort={abortDeployment}
            componentClass="margin-left-small"
            count={pendingCount}
            items={pending}
            page={pendingPage}
            pageSize={pendingPerPage}
            onChangeRowsPerPage={perPage => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.pending]: { page: 1, perPage } }))}
            onChangePage={page => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.pending]: { page } }))}
            type={DEPLOYMENT_STATES.pending}
          />
        </div>
      )}
      {!(progressCount || pendingCount) && (
        <div className="dashboard-placeholder">
          <p>Pending and ongoing deployments will appear here. </p>
          {canDeploy && (
            <p>
              <a onClick={createClick}>Create a deployment</a> to get started
            </p>
          )}
          <RefreshIcon className="flip-horizontal" style={{ fill: '#e3e3e3', width: 111, height: 111 }} />
        </div>
      )}
    </div>
  ) : (
    <Loader show={doneLoading} />
  );
};

export default Progress;

1	// Copyright 2015 Northern.tech AS
2	//
3	// Licensed under the Apache License, Version 2.0 (the "License");
4	// you may not use this file except in compliance with the License.
5	// You may obtain a copy of the License at
6	//
7	// http://www.apache.org/licenses/LICENSE-2.0
8	//
9	// Unless required by applicable law or agreed to in writing, software
10	// distributed under the License is distributed on an "AS IS" BASIS,
11	// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12	// See the License for the specific language governing permissions and
13	// limitations under the License.
14	import React, { useCallback, useEffect, useRef, useState } from 'react';
15	import { useDispatch, useSelector } from 'react-redux';
16
17	import { Refresh as RefreshIcon } from '@mui/icons-material';
18	import { makeStyles } from 'tss-react/mui';
19
20	import { setSnackbar } from '../../actions/appActions';
21	import { getDeploymentsByStatus, setDeploymentsState } from '../../actions/deploymentActions';
22	import { DEPLOYMENT_STATES } from '../../constants/deploymentConstants';
23	import { onboardingSteps } from '../../constants/onboardingConstants';
24	import {
25	getDeploymentsByStatus as getDeploymentsByStatusSelector,
26	getDeploymentsSelectionState,
27	getDevicesById,
28	getIdAttribute,
29	getIsEnterprise,
30	getMappedDeploymentSelection,
31	getOnboardingState,
32	getUserCapabilities
33	} from '../../selectors';
34	import { getOnboardingComponentFor } from '../../utils/onboardingmanager';
35	import useWindowSize from '../../utils/resizehook';
36	import { clearAllRetryTimers, clearRetryTimer, setRetryTimer } from '../../utils/retrytimer';
37	import LinedHeader from '../common/lined-header';
38	import Loader from '../common/loader';
39	import { defaultRefreshDeploymentsLength as refreshDeploymentsLength } from './deployments';
40	import DeploymentsList from './deploymentslist';
41
42	export const minimalRefreshDeploymentsLength = 2000;	7✔
43
44	const useStyles = makeStyles()(theme => ({	9✔
45	deploymentsPending: {
46	borderColor: 'rgba(0, 0, 0, 0.06)',
47	backgroundColor: theme.palette.background.light,
48	color: theme.palette.text.primary,
49	['.dashboard-header span']: {
50	backgroundColor: theme.palette.background.light,
51	color: theme.palette.text.primary
52	},
53	['.MuiButtonBase-root']: {
54	color: theme.palette.text.primary
55	}
56	}
57	}));
58
59	export const Progress = ({ abort, createClick, ...remainder }) => {	7✔
60	const dispatch = useDispatch();	353✔
61	const dispatchedSetSnackbar = (...args) => dispatch(setSnackbar(...args));	353✔
62	const { canConfigure, canDeploy } = useSelector(getUserCapabilities);	353✔
63	const { attribute: idAttribute } = useSelector(getIdAttribute);	353✔
64	const onboardingState = useSelector(getOnboardingState);	353✔
65	const isEnterprise = useSelector(getIsEnterprise);	353✔
66	const {
67	finished: { total: pastDeploymentsCount },
68	pending: { total: pendingCount },
69	inprogress: { total: progressCount }
70	} = useSelector(getDeploymentsByStatusSelector);	353✔
71	const progress = useSelector(state => getMappedDeploymentSelection(state, DEPLOYMENT_STATES.inprogress));	589✔
72	const pending = useSelector(state => getMappedDeploymentSelection(state, DEPLOYMENT_STATES.pending));	589✔
73	const selectionState = useSelector(getDeploymentsSelectionState);	353✔
74	const devices = useSelector(getDevicesById);	353✔
75
76	const { page: progressPage, perPage: progressPerPage } = selectionState.inprogress;	353✔
77	const { page: pendingPage, perPage: pendingPerPage } = selectionState.pending;	353✔
78
79	const [currentRefreshDeploymentLength, setCurrentRefreshDeploymentLength] = useState(refreshDeploymentsLength);	353✔
80	const [doneLoading, setDoneLoading] = useState(!!(progressCount \|\| pendingCount));	353✔
81	// eslint-disable-next-line no-unused-vars
82	const size = useWindowSize();	353✔
83
84	const inprogressRef = useRef();	353✔
85	const dynamicTimer = useRef();	353✔
86
87	const { classes } = useStyles();	353✔
88
89	useEffect(() => {	353✔
90	return () => {	9✔
91	clearAllRetryTimers(dispatchedSetSnackbar);	9✔
92	};
93	}, []);
94
95	useEffect(() => {	353✔
96	clearTimeout(dynamicTimer.current);	17✔
97	setupDeploymentsRefresh(minimalRefreshDeploymentsLength);	17✔
98	return () => {	17✔
99	clearTimeout(dynamicTimer.current);	17✔
100	};
101	}, [pendingCount]);
102
103	useEffect(() => {	353✔
104	clearTimeout(dynamicTimer.current);	9✔
105	setupDeploymentsRefresh();	9✔
106	return () => {	9✔
107	clearInterval(dynamicTimer.current);	9✔
108	};
109	}, [progressPage, progressPerPage, pendingPage, pendingPerPage]);
110
111	const setupDeploymentsRefresh = (refreshLength = currentRefreshDeploymentLength) => {	353✔
112	let tasks = [refreshDeployments(DEPLOYMENT_STATES.inprogress), refreshDeployments(DEPLOYMENT_STATES.pending)];	27✔
113	if (!onboardingState.complete && !pastDeploymentsCount) {	27✔
114	// retrieve past deployments outside of the regular refresh cycle to not change the selection state for past deployments
115	dispatch(getDeploymentsByStatus(DEPLOYMENT_STATES.finished, 1, 1, undefined, undefined, undefined, undefined, false));	10✔
116	}
117	return Promise.all(tasks)	27✔
118	.then(() => {
119	const currentRefreshDeploymentLength = Math.min(refreshDeploymentsLength, refreshLength * 2);	25✔
120	setCurrentRefreshDeploymentLength(currentRefreshDeploymentLength);	25✔
121	clearTimeout(dynamicTimer.current);	25✔
122	dynamicTimer.current = setTimeout(setupDeploymentsRefresh, currentRefreshDeploymentLength);	25✔
123	})
124	.finally(() => setDoneLoading(true));	25✔
125	};
126
127	// deploymentStatus = <inprogress\|pending>
128	const refreshDeployments = useCallback(	353✔
129	deploymentStatus => {
130	const { page, perPage } = selectionState[deploymentStatus];	54✔
131	return dispatch(getDeploymentsByStatus(deploymentStatus, page, perPage))	54✔
132	.then(deploymentsAction => {
133	clearRetryTimer(deploymentStatus, dispatchedSetSnackbar);	50✔
134	const { total, deploymentIds } = deploymentsAction[deploymentsAction.length - 1];	50✔
135	if (total && !deploymentIds.length) {	50!
136	return refreshDeployments(deploymentStatus);	×
137	}
138	})
139	.catch(err => setRetryTimer(err, 'deployments', `Couldn't load deployments.`, refreshDeploymentsLength, dispatchedSetSnackbar))	×
140	.finally(() => setDoneLoading(true));	50✔
141	},
142	[pendingPage, pendingPerPage, progressPage, progressPerPage]
143	);
144
145	const abortDeployment = id =>	353✔
146	abort(id).then(() => Promise.all([refreshDeployments(DEPLOYMENT_STATES.inprogress), refreshDeployments(DEPLOYMENT_STATES.pending)]));	×
147
148	let onboardingComponent = null;	353✔
149	if (!onboardingState.complete && inprogressRef.current) {	353✔
150	const anchor = {	329✔
151	left: inprogressRef.current.offsetLeft + (inprogressRef.current.offsetWidth / 100) * 90,
152	top: inprogressRef.current.offsetTop + inprogressRef.current.offsetHeight
153	};
154	onboardingComponent = getOnboardingComponentFor(onboardingSteps.DEPLOYMENTS_INPROGRESS, onboardingState, { anchor });	329✔
155	}
156	const props = { ...remainder, canDeploy, canConfigure, devices, idAttribute, isEnterprise };	353✔
157	return doneLoading ? (	353✔
158	<div className="fadeIn">
159	{!!progress.length && (	674✔
160	<div className="margin-left">
161	<LinedHeader className="margin-top-large margin-right" heading="In progress now" />
162	<DeploymentsList
163	{...props}
164	abort={abortDeployment}
165	count={progressCount}
166	items={progress}
167	listClass="margin-right-small"
168	page={progressPage}
169	pageSize={progressPerPage}
170	rootRef={inprogressRef}
171	onChangeRowsPerPage={perPage => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.inprogress]: { page: 1, perPage } }))}	×
172	onChangePage={page => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.inprogress]: { page } }))}	×
173	type={DEPLOYMENT_STATES.inprogress}
174	/>
175	</div>
176	)}
177	{!!onboardingComponent && onboardingComponent}	337!
178	{!!pending.length && (	671✔
179	<div className={`deployments-pending margin-top margin-bottom-large ${classes.deploymentsPending}`}>
180	<LinedHeader className="margin-small margin-top" heading="Pending" />
181	<DeploymentsList
182	{...props}
183	abort={abortDeployment}
184	componentClass="margin-left-small"
185	count={pendingCount}
186	items={pending}
187	page={pendingPage}
188	pageSize={pendingPerPage}
189	onChangeRowsPerPage={perPage => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.pending]: { page: 1, perPage } }))}	×
190	onChangePage={page => dispatch(setDeploymentsState({ [DEPLOYMENT_STATES.pending]: { page } }))}	×
191	type={DEPLOYMENT_STATES.pending}
192	/>
193	</div>
194	)}
195	{!(progressCount \|\| pendingCount) && (	674!
196	<div className="dashboard-placeholder">
197	<p>Pending and ongoing deployments will appear here. </p>
198	{canDeploy && (	×
199	<p>
200	<a onClick={createClick}>Create a deployment</a> to get started
201	</p>
202	)}
203	<RefreshIcon className="flip-horizontal" style={{ fill: '#e3e3e3', width: 111, height: 111 }} />
204	</div>
205	)}
206	</div>
207	) : (
208	<Loader show={doneLoading} />
209	);
210	};
211
212	export default Progress;

mendersoftware / gui / 951400782

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous