IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-11-24 09:50:29 -06:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Replace enzyme with RTL in ConfirmModal.test.tsx (#45651)

Browse Source
This commit is contained in:
Hugo Häggmark 2022-02-21 08:25:52 +01:00 committed by GitHub
parent 2f63d7b1c4
commit c6470be34c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.betterer.results
View File

@ -11,9 +11,6 @@ exports[`no enzyme tests`] = {
"packages/grafana-ui/src/components/ColorPicker/NamedColorsPalette.test.tsx:1355456933": [
[1, 31, 13, "RegExp match", "2409514259"]
],
"packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.test.tsx:3838344574": [
[1, 17, 13, "RegExp match", "2409514259"]
],
"packages/grafana-ui/src/components/FileUpload/FileUpload.test.tsx:3475964456": [
[1, 19, 13, "RegExp match", "2409514259"]
],

48
packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.test.tsx
View File

@ -1,23 +1,34 @@
import React from 'react';
import { mount } from 'enzyme';
import { render, screen, within } from '@testing-library/react';
import { ConfirmModal } from './ConfirmModal';
describe('ConfirmModal', () => {
it('renders without error', () => {
mount(
it('should render correct title, body, dismiss-, alternative- and confirm-text', () => {
render(
<ConfirmModal
title="Some Title"
body="Some Body"
confirmText="Confirm"
confirmText="Please Confirm"
alternativeText="Alternative Text"
dismissText="Dismiss Text"
isOpen={true}
onConfirm={() => {}}
onDismiss={() => {}}
onAlternative={() => {}}
/>
);
expect(screen.getByRole('heading', { name: 'Some Title' })).toBeInTheDocument();
expect(screen.getByText('Some Body')).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Dismiss Text' })).toBeInTheDocument();
expect(screen.getByRole('button', { name: 'Alternative Text' })).toBeInTheDocument();
const button = screen.getByRole('button', { name: 'Confirm Modal Danger Button' });
expect(within(button).getByText('Please Confirm')).toBeInTheDocument();
});
it('renders nothing by default or when isOpen is false', () => {
const wrapper = mount(
it('should render nothing when isOpen is false', () => {
render(
<ConfirmModal
title="Some Title"
body="Some Body"
@ -27,26 +38,11 @@ describe('ConfirmModal', () => {
onDismiss={() => {}}
/>
);
expect(wrapper.html()).toBe('');
wrapper.setProps({ ...wrapper.props(), isOpen: false });
expect(wrapper.html()).toBe('');
});
it('renders correct contents', () => {
const wrapper = mount(
<ConfirmModal
title="Some Title"
body="Content"
confirmText="Confirm"
isOpen={true}
onConfirm={() => {}}
onDismiss={() => {}}
/>
);
expect(wrapper.contains('Some Title')).toBeTruthy();
expect(wrapper.contains('Content')).toBeTruthy();
expect(wrapper.contains('Confirm')).toBeTruthy();
expect(screen.queryByRole('heading', { name: 'Some Title' })).not.toBeInTheDocument();
expect(screen.queryByText('Some Body')).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: 'Dismiss Text' })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: 'Alternative Text' })).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: 'Confirm Modal Danger Button' })).not.toBeInTheDocument();
});
});

5
packages/grafana-ui/src/components/ConfirmModal/ConfirmModal.tsx
View File

@ -1,12 +1,13 @@
import React, { useEffect, useRef, useState } from 'react';
import { css } from '@emotion/css';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { Modal } from '../Modal/Modal';
import { IconName } from '../../types/icon';
import { Button } from '../Button';
import { useStyles2 } from '../../themes';
import { GrafanaTheme2 } from '@grafana/data';
import { HorizontalGroup, Input } from '..';
import { selectors } from '@grafana/e2e-selectors';
export interface ConfirmModalProps {
/** Toggle modal's open/closed state */