mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-23 02:10:12 +01:00
bd12ea733a
The autolock field on the Settings screen — the field that allows users
to set the duration that MetaMask will wait for until automatically
locking — does not always accept decimal numbers. This breaks the e2e
test for this feature as it attempts to set this field to "0.1".
More specifically, the React component responsible for this field passes
whatever the user inputs through the `Number` function immediately and
then uses this to repopulate the input. Therefore, if the user enters
"3" followed by a ".", `Number("3.")` will be called. This evaluates to
the number 3, and "3" becomes the new value of the field. As a result,
the "." can never be typed.
Curiously, this behavior only happens in Firefox; Chrome seems to
keep the "." in the input field when it's typed. This happens because
`onChange` event doesn't seem to get fired until a number is typed
*after* the ".". This may be due to underlying differences in the DOM
between Chrome and Firefox.
Regardless, always passing the input through `Number` creates other odd
behavior, such as the fact that the input can never be cleared (because
`Number("")` evaluates to 0).
This commit solves these problems by saving the "raw" version of the
user's input as well as the normalized version. The raw version is
always used to populate the input, whereas the normalized version is
saved in state.
82 lines
2.6 KiB
JavaScript
82 lines
2.6 KiB
JavaScript
import React from 'react';
|
|
import { fireEvent } from '@testing-library/react';
|
|
import configureMockStore from 'redux-mock-store';
|
|
import thunk from 'redux-thunk';
|
|
import mockState from '../../../../test/data/mock-state.json';
|
|
import { renderWithProvider } from '../../../../test/lib/render-helpers';
|
|
import AdvancedTab from '.';
|
|
|
|
const mockSetAutoLockTimeLimit = jest.fn();
|
|
const mockSetShowTestNetworks = jest.fn();
|
|
|
|
jest.mock('../../../store/actions.ts', () => {
|
|
return {
|
|
setAutoLockTimeLimit: () => mockSetAutoLockTimeLimit,
|
|
setShowTestNetworks: () => mockSetShowTestNetworks,
|
|
};
|
|
});
|
|
|
|
describe('AdvancedTab Component', () => {
|
|
const mockStore = configureMockStore([thunk])(mockState);
|
|
|
|
it('should render backup button', () => {
|
|
const { queryByTestId } = renderWithProvider(<AdvancedTab />, mockStore);
|
|
const backupButton = queryByTestId('backup-button');
|
|
expect(backupButton).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render restore button', () => {
|
|
const { queryByTestId } = renderWithProvider(<AdvancedTab />, mockStore);
|
|
const restoreFile = queryByTestId('restore-file');
|
|
expect(restoreFile).toBeInTheDocument();
|
|
});
|
|
|
|
it('should default the auto-lockout time to 0', () => {
|
|
const { queryByTestId } = renderWithProvider(<AdvancedTab />, mockStore);
|
|
const autoLockoutTime = queryByTestId('auto-lockout-time');
|
|
|
|
expect(autoLockoutTime).toHaveValue('0');
|
|
});
|
|
|
|
it('should update the auto-lockout time', () => {
|
|
const { queryByTestId } = renderWithProvider(<AdvancedTab />, mockStore);
|
|
const autoLockoutTime = queryByTestId('auto-lockout-time');
|
|
const autoLockoutButton = queryByTestId('auto-lockout-button');
|
|
|
|
fireEvent.change(autoLockoutTime, { target: { value: '1440' } });
|
|
|
|
expect(autoLockoutTime).toHaveValue('1440');
|
|
|
|
fireEvent.click(autoLockoutButton);
|
|
|
|
expect(mockSetAutoLockTimeLimit).toHaveBeenCalled();
|
|
});
|
|
|
|
it('should toggle show test networks', () => {
|
|
const { queryAllByRole } = renderWithProvider(<AdvancedTab />, mockStore);
|
|
|
|
const testNetworkToggle = queryAllByRole('checkbox')[2];
|
|
|
|
fireEvent.click(testNetworkToggle);
|
|
|
|
expect(mockSetShowTestNetworks).toHaveBeenCalled();
|
|
});
|
|
|
|
it('should not render ledger live control with desktop pairing enabled', () => {
|
|
const mockStoreWithDesktopEnabled = configureMockStore([thunk])({
|
|
...mockState,
|
|
metamask: {
|
|
...mockState.metamask,
|
|
desktopEnabled: true,
|
|
},
|
|
});
|
|
|
|
const { queryByTestId } = renderWithProvider(
|
|
<AdvancedTab />,
|
|
mockStoreWithDesktopEnabled,
|
|
);
|
|
|
|
expect(queryByTestId('ledger-live-control')).not.toBeInTheDocument();
|
|
});
|
|
});
|