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

72.09

/src/js/components/settings/user-management/twofactorauth-steps/authsetup.js

// Copyright 2021 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, { useEffect, useRef, useState } from 'react';

import { CheckCircle as CheckCircleIcon } from '@mui/icons-material';
import { Button } from '@mui/material';

import { twoFAStates } from '../../../../constants/userConstants';
import Form from '../../../common/forms/form';
import TextInput from '../../../common/forms/textinput';
import Loader from '../../../common/loader';

export const AuthSetup = ({ currentUser, handle2FAState, has2FA, qrImage, verify2FA }) => {
  const current2FA = useRef(has2FA);
  const [validated2fa, setValidated2fa] = useState(false);
  const [validating2fa, setValidating2fa] = useState(false);

  useEffect(() => {
    window.addEventListener('beforeunload', onUnload);
    return () => {
      if (!current2FA.current && qrImage) {
        handle2FAState(twoFAStates.disabled);
      }
      window.removeEventListener('beforeunload', onUnload);
    };
  }, []);

  useEffect(() => {
    current2FA.current = has2FA;
  }, [has2FA]);

  const onUnload = e => {
    if (!e || (validated2fa && has2FA) || !qrImage) {
      return;
    }
    e.returnValue = '2fa setup incomplete';
    return e.returnValue;
  };

  const validate2faSetup = formData => {
    setValidating2fa(true);
    formData.email = currentUser.email;
    return verify2FA(formData)
      .then(() => setValidated2fa(true))
      .catch(() => setValidated2fa(false))
      .finally(() => setValidating2fa(false));
  };

  return (
    <div className="margin-top">
      Setup:
      <div className="flexbox margin-top">
        <ol className="spaced-list margin-right-large" style={{ paddingInlineStart: 20 }}>
          <li className="margin-top-none">
            To use Two Factor Authentication, first download a third party authentication app such as{' '}
            <a href="https://authy.com/download/" target="_blank" rel="noopener noreferrer">
              Authy
            </a>{' '}
            or{' '}
            <a href="https://support.google.com/accounts/answer/1066447" target="_blank" rel="noopener noreferrer">
              Google Authenticator
            </a>
            .
          </li>
          <li>Scan the QR code on the right with the authenticator app you just downloaded on your device.</li>
          <li>
            <div>
              Type in the generated code in the input field below and click Verify.
              {validated2fa ? (
                <div className="flexbox space-between centered margin-top margin-right margin-bottom" style={{ justifyContent: 'flex-end' }}>
                  <CheckCircleIcon className="green" />
                  <h3 className="green margin-left-small" style={{ textTransform: 'uppercase' }}>
                    Verified
                  </h3>
                </div>
              ) : (
                <>
                  <Form showButtons={!validating2fa} buttonColor="primary" onSubmit={validate2faSetup} submitLabel="Verify" submitButtonId="confirm-button">
                    <TextInput hint="Verification code" label="Verification code" id="token2fa" validations="isLength:6,isNumeric" required={true} />
                  </Form>
                  {validating2fa && (
                    <div className="flexbox" style={{ alignItems: 'flex-end', justifyContent: 'flex-end', height: 'min-content' }}>
                      <Loader show={true} />
                      <Button variant="contained" color="primary" disabled={true} style={{ marginLeft: 30 }}>
                        Verifying...
                      </Button>
                    </div>
                  )}
                </>
              )}
            </div>
          </li>
          <li>Then each time you log in, you will be asked for a verification code which you can retrieve from the authentication app on your device.</li>
        </ol>
        {!qrImage ? <Loader show={!qrImage} /> : <img src={`data:image/png;base64,${qrImage}`} style={{ maxHeight: '20vh' }} />}
      </div>
      <div className="flexbox" style={{ justifyContent: 'flex-end' }}>
        <Button onClick={() => handle2FAState(twoFAStates.disabled)} style={{ marginRight: 10 }}>
          Cancel
        </Button>
        <Button variant="contained" color="secondary" disabled={!validated2fa} onClick={() => handle2FAState(twoFAStates.enabled)}>
          Save
        </Button>
      </div>
    </div>
  );
};

export default AuthSetup;

1	// Copyright 2021 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, { useEffect, useRef, useState } from 'react';
15
16	import { CheckCircle as CheckCircleIcon } from '@mui/icons-material';
17	import { Button } from '@mui/material';
18
19	import { twoFAStates } from '../../../../constants/userConstants';
20	import Form from '../../../common/forms/form';
21	import TextInput from '../../../common/forms/textinput';
22	import Loader from '../../../common/loader';
23
24	export const AuthSetup = ({ currentUser, handle2FAState, has2FA, qrImage, verify2FA }) => {	7✔
25	const current2FA = useRef(has2FA);	10✔
26	const [validated2fa, setValidated2fa] = useState(false);	10✔
27	const [validating2fa, setValidating2fa] = useState(false);	10✔
28
29	useEffect(() => {	10✔
30	window.addEventListener('beforeunload', onUnload);	2✔
31	return () => {	2✔
32	if (!current2FA.current && qrImage) {	2✔
33	handle2FAState(twoFAStates.disabled);	1✔
34	}
35	window.removeEventListener('beforeunload', onUnload);	2✔
36	};
37	}, []);
38
39	useEffect(() => {	10✔
40	current2FA.current = has2FA;	3✔
41	}, [has2FA]);
42
43	const onUnload = e => {	10✔
44	if (!e \|\| (validated2fa && has2FA) \|\| !qrImage) {	×
45	return;	×
46	}
47	e.returnValue = '2fa setup incomplete';	×
48	return e.returnValue;	×
49	};
50
51	const validate2faSetup = formData => {	10✔
52	setValidating2fa(true);	1✔
53	formData.email = currentUser.email;	1✔
54	return verify2FA(formData)	1✔
55	.then(() => setValidated2fa(true))	1✔
56	.catch(() => setValidated2fa(false))	×
57	.finally(() => setValidating2fa(false));	1✔
58	};
59
60	return (	10✔
61	<div className="margin-top">
62	Setup:
63	<div className="flexbox margin-top">
64	<ol className="spaced-list margin-right-large" style={{ paddingInlineStart: 20 }}>
65	<li className="margin-top-none">
66	To use Two Factor Authentication, first download a third party authentication app such as{' '}
67	<a href="https://authy.com/download/" target="_blank" rel="noopener noreferrer">
68	Authy
69	</a>{' '}
70	or{' '}
71	<a href="https://support.google.com/accounts/answer/1066447" target="_blank" rel="noopener noreferrer">
72	Google Authenticator
73	</a>
74	.
75	</li>
76	<li>Scan the QR code on the right with the authenticator app you just downloaded on your device.</li>
77	<li>
78	<div>
79	Type in the generated code in the input field below and click Verify.
80	{validated2fa ? (	10✔
81	<div className="flexbox space-between centered margin-top margin-right margin-bottom" style={{ justifyContent: 'flex-end' }}>
82	<CheckCircleIcon className="green" />
83	<h3 className="green margin-left-small" style={{ textTransform: 'uppercase' }}>
84	Verified
85	</h3>
86	</div>
87	) : (
88	<>
89	<Form showButtons={!validating2fa} buttonColor="primary" onSubmit={validate2faSetup} submitLabel="Verify" submitButtonId="confirm-button">
90	<TextInput hint="Verification code" label="Verification code" id="token2fa" validations="isLength:6,isNumeric" required={true} />
91	</Form>
92	{validating2fa && (	10✔
93	<div className="flexbox" style={{ alignItems: 'flex-end', justifyContent: 'flex-end', height: 'min-content' }}>
94	<Loader show={true} />
95	<Button variant="contained" color="primary" disabled={true} style={{ marginLeft: 30 }}>
96	Verifying...
97	</Button>
98	</div>
99	)}
100	</>
101	)}
102	</div>
103	</li>
104	<li>Then each time you log in, you will be asked for a verification code which you can retrieve from the authentication app on your device.</li>
105	</ol>
106	{!qrImage ? <Loader show={!qrImage} /> : <img src={`data:image/png;base64,${qrImage}`} style={{ maxHeight: '20vh' }} />}	10✔
107	</div>
108	<div className="flexbox" style={{ justifyContent: 'flex-end' }}>
109	<Button onClick={() => handle2FAState(twoFAStates.disabled)} style={{ marginRight: 10 }}>	×
110	Cancel
111	</Button>
112	<Button variant="contained" color="secondary" disabled={!validated2fa} onClick={() => handle2FAState(twoFAStates.enabled)}>	1✔
113	Save
114	</Button>
115	</div>
116	</div>
117	);
118	};
119
120	export default AuthSetup;

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