diff --git a/react/CircleButton/index.jsx b/react/CircleButton/index.jsx index d0c2c87b74..118a397c6a 100644 --- a/react/CircleButton/index.jsx +++ b/react/CircleButton/index.jsx @@ -6,6 +6,7 @@ import Box from '../Box' import IconButton from '../IconButton' import Typography from '../Typography' import { makeTypoColor, makeButtonShadow } from './helpers' +import { getRandomUUID } from '../helpers/getRandomUUID' const useStyles = makeStyles(theme => ({ iconButton: { @@ -42,7 +43,7 @@ const CircleButton = ({ ...props }) => { const styles = useStyles({ active: variant === 'active', disabled }) - const uuid = crypto.randomUUID() + const uuid = getRandomUUID() if (!ariaLabel && !label) { console.warn(`The "aria-label" or "label" property must be filled in.`) diff --git a/react/MuiCozyTheme/TextField/index.jsx b/react/MuiCozyTheme/TextField/index.jsx index 6eb7af59ab..0bbac3ea23 100644 --- a/react/MuiCozyTheme/TextField/index.jsx +++ b/react/MuiCozyTheme/TextField/index.jsx @@ -1,9 +1,10 @@ import React, { forwardRef } from 'react' import MuiTextField from '@material-ui/core/TextField' +import { getRandomUUID } from '../../helpers/getRandomUUID' const TextField = forwardRef(({ children, ...props }, ref) => { // A11Y, https://v4.mui.com/api/text-field/#props - const uuid = crypto.randomUUID() + const uuid = getRandomUUID() return ( diff --git a/react/helpers/getRandomUUID.js b/react/helpers/getRandomUUID.js new file mode 100644 index 0000000000..eb59b663e8 --- /dev/null +++ b/react/helpers/getRandomUUID.js @@ -0,0 +1,11 @@ +/** + * Returns a random UUID + * @returns {string} a random UUID + */ +export const getRandomUUID = () => { + if (process.env.NODE_ENV === 'test') { + return 'random-uuid-for-jest' + } + + return window.crypto.randomUUID() +} diff --git a/react/helpers/getRandomUUID.spec.js b/react/helpers/getRandomUUID.spec.js new file mode 100644 index 0000000000..54e2441b94 --- /dev/null +++ b/react/helpers/getRandomUUID.spec.js @@ -0,0 +1,9 @@ +import { getRandomUUID } from './getRandomUUID' + +describe('getRandomUUID', () => { + it('returns a random uuid', () => { + const uuid = getRandomUUID() + + expect(uuid).toBe('random-uuid-for-jest') + }) +}) diff --git a/test/jestsetup.js b/test/jestsetup.js index f920d31be4..c50a4f29e4 100644 --- a/test/jestsetup.js +++ b/test/jestsetup.js @@ -1,16 +1,9 @@ import '@testing-library/jest-dom/extend-expect' import { configure, mount, shallow } from 'enzyme' import Adapter from 'enzyme-adapter-react-16' -import nodeCrypto from 'crypto' configure({ adapter: new Adapter() }) -Object.defineProperty(global, 'crypto', { - value: { - randomUUID: () => nodeCrypto.randomUUID() - } -}) - global.mount = mount global.shallow = shallow