root
/
grafana
mirror of https://github.com/grafana/grafana.git
1
0
Fork 0
Code Issues Actions 73 Packages Projects Releases Wiki Activity

convert UsersActionBar tests to RTL (#48737)

This commit is contained in:
tomxwang 2022-05-13 04:16:22 +08:00 committed by GitHub
parent ab91af202c
commit a51c2774b8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.betterer.results
View File

@ -242,9 +242,6 @@ exports[`no enzyme tests`] = {
"public/app/features/teams/TeamSettings.test.tsx:2043271249": [ "public/app/features/teams/TeamSettings.test.tsx:2043271249": [
[0, 19, 13, "RegExp match", "2409514259"] [0, 19, 13, "RegExp match", "2409514259"]
], ],
"public/app/features/users/UsersActionBar.test.tsx:3740177621": [
[0, 19, 13, "RegExp match", "2409514259"]
],
"public/app/features/users/UsersListPage.test.tsx:3908145117": [ "public/app/features/users/UsersListPage.test.tsx:3908145117": [
[0, 19, 13, "RegExp match", "2409514259"] [0, 19, 13, "RegExp match", "2409514259"]
], ],

23
public/app/features/users/UsersActionBar.test.tsx
View File

@ -1,4 +1,4 @@
import { shallow } from 'enzyme'; import { render, screen } from '@testing-library/react';
import React from 'react'; import React from 'react';
import { mockToolkitActionCreator } from 'test/core/redux/mocks'; import { mockToolkitActionCreator } from 'test/core/redux/mocks';
@ -26,37 +26,40 @@ const setup = (propOverrides?: object) => {
Object.assign(props, propOverrides); Object.assign(props, propOverrides);
return shallow(<UsersActionBar {...props} />); const { rerender } = render(<UsersActionBar {...props} />);
return { rerender, props };
}; };
describe('Render', () => { describe('Render', () => {
it('should render component', () => { it('should render component', () => {
const wrapper = setup(); setup();
expect(wrapper).toMatchSnapshot(); expect(screen.getByTestId('users-action-bar')).toBeInTheDocument();
}); });
it('should render pending invites button', () => { it('should render pending invites button', () => {
const wrapper = setup({ setup({
pendingInvitesCount: 5, pendingInvitesCount: 5,
}); });
expect(wrapper).toMatchSnapshot(); expect(screen.getByRole('radio', { name: 'Pending Invites (5)' })).toBeInTheDocument();
}); });
it('should show invite button', () => { it('should show invite button', () => {
const wrapper = setup({ setup({
canInvite: true, canInvite: true,
}); });
expect(wrapper).toMatchSnapshot(); expect(screen.getByRole('link', { name: 'Invite' })).toHaveAttribute('href', 'org/users/invite');
}); });
it('should show external user management button', () => { it('should show external user management button', () => {
const wrapper = setup({ setup({
externalUserMngLinkUrl: 'some/url', externalUserMngLinkUrl: 'some/url',
externalUserMngLinkName: 'someUrl',
}); });
expect(wrapper).toMatchSnapshot(); expect(screen.getByRole('link', { name: 'someUrl' })).toHaveAttribute('href', 'some/url');
}); });
}); });

2
public/app/features/users/UsersActionBar.tsx
View File

@ -40,7 +40,7 @@ export class UsersActionBar extends PureComponent<Props> {
const canAddToOrg = contextSrv.hasAccess(AccessControlAction.UsersCreate, canInvite); const canAddToOrg = contextSrv.hasAccess(AccessControlAction.UsersCreate, canInvite);
return ( return (
<div className="page-action-bar"> <div className="page-action-bar" data-testid="users-action-bar">
<div className="gf-form gf-form--grow"> <div className="gf-form gf-form--grow">
<FilterInput <FilterInput
value={searchQuery} value={searchQuery}

114
public/app/features/users/__snapshots__/UsersActionBar.test.tsx.snap
View File

@ -1,114 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Render should render component 1`] = `
<div
className="page-action-bar"
>
<div
className="gf-form gf-form--grow"
>
<FilterInput
onChange={[MockFunction]}
placeholder="Search user by login, email or name"
value=""
/>
</div>
<LinkButton
href="org/users/invite"
>
Invite
</LinkButton>
</div>
`;
exports[`Render should render pending invites button 1`] = `
<div
className="page-action-bar"
>
<div
className="gf-form gf-form--grow"
>
<FilterInput
onChange={[MockFunction]}
placeholder="Search user by login, email or name"
value=""
/>
</div>
<div
style={
Object {
"marginLeft": "1rem",
}
}
>
<RadioButtonGroup
onChange={[MockFunction]}
options={
Array [
Object {
"label": "Users",
"value": "users",
},
Object {
"label": "Pending Invites (5)",
"value": "invites",
},
]
}
value="users"
/>
</div>
<LinkButton
href="org/users/invite"
>
Invite
</LinkButton>
</div>
`;
exports[`Render should show external user management button 1`] = `
<div
className="page-action-bar"
>
<div
className="gf-form gf-form--grow"
>
<FilterInput
onChange={[MockFunction]}
placeholder="Search user by login, email or name"
value=""
/>
</div>
<LinkButton
href="org/users/invite"
>
Invite
</LinkButton>
<LinkButton
href="some/url"
rel="noopener"
target="_blank"
/>
</div>
`;
exports[`Render should show invite button 1`] = `
<div
className="page-action-bar"
>
<div
className="gf-form gf-form--grow"
>
<FilterInput
onChange={[MockFunction]}
placeholder="Search user by login, email or name"
value=""
/>
</div>
<LinkButton
href="org/users/invite"
>
Invite
</LinkButton>
</div>
`;