Skip to content

Commit 673dd38

Browse files
evanpurkhiserevanpurkhiser
authored
test(js): Convert AcceptOrganizationInvite to RTL (#39809)
1 parent 856a6cf commit 673dd38

File tree

3 files changed

+84
-95
lines changed

3 files changed

+84
-95
lines changed

‎static/app/views/acceptOrganizationInvite.spec.jsx‎

Lines changed: 77 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {browserHistory} from 'react-router';
22

3-
import {mountWithTheme} from 'sentry-test/enzyme';
3+
import {render, screen, userEvent, waitFor} from 'sentry-test/reactTestingLibrary';
44

55
import {logout} from 'sentry/actionCreators/account';
66
import AcceptOrganizationInvite from 'sentry/views/acceptOrganizationInvite';
@@ -14,6 +14,9 @@ const addMock = body =>
1414
body,
1515
});
1616

17+
const getJoinButton = () =>
18+
screen.queryByRole('button', {name: 'Join the test-org organization'});
19+
1720
describe('AcceptOrganizationInvite', function () {
1821
it('can accept invitation', async function () {
1922
addMock({
@@ -25,28 +28,22 @@ describe('AcceptOrganizationInvite', function () {
2528
existingMember: false,
2629
});
2730

28-
const wrapper = mountWithTheme(
29-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
30-
);
31-
32-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
33-
34-
expect(joinButton.exists()).toBe(true);
35-
expect(joinButton.text()).toBe('Join the test-org organization');
31+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
3632

3733
const acceptMock = MockApiClient.addMockResponse({
3834
url: '/accept-invite/1/abc/',
3935
method: 'POST',
4036
});
4137

42-
joinButton.simulate('click');
38+
const joinButton = getJoinButton();
39+
40+
userEvent.click(joinButton);
4341
expect(acceptMock).toHaveBeenCalled();
44-
expect(wrapper.find('Button[aria-label="join-organization"]').props().disabled).toBe(
45-
true
46-
);
42+
expect(joinButton).toBeDisabled();
4743

48-
await tick();
49-
expect(browserHistory.replace).toHaveBeenCalledWith('/test-org/');
44+
await waitFor(() =>
45+
expect(browserHistory.replace).toHaveBeenCalledWith('/test-org/')
46+
);
5047
});
5148

5249
it('requires authentication to join', function () {
@@ -59,19 +56,19 @@ describe('AcceptOrganizationInvite', function () {
5956
existingMember: false,
6057
});
6158

62-
const wrapper = mountWithTheme(
63-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
64-
);
59+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
6560

66-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
67-
expect(joinButton.exists()).toBe(false);
61+
expect(getJoinButton()).not.toBeInTheDocument();
6862

69-
expect(wrapper.find('[data-test-id="action-info-general"]').exists()).toBe(true);
70-
expect(wrapper.find('[data-test-id="action-info-sso"]').exists()).toBe(false);
63+
expect(screen.getByTestId('action-info-general')).toBeInTheDocument();
64+
expect(screen.queryByTestId('action-info-sso')).not.toBeInTheDocument();
7165

72-
expect(wrapper.find('Button[aria-label="sso-login"]').exists()).toBe(false);
73-
expect(wrapper.find('Button[aria-label="create-account"]').exists()).toBe(true);
74-
expect(wrapper.find('[data-test-id="link-with-existing"]').exists()).toBe(true);
66+
expect(
67+
screen.getByRole('button', {name: 'Create a new account'})
68+
).toBeInTheDocument();
69+
expect(
70+
screen.getByRole('link', {name: 'Login using an existing account'})
71+
).toBeInTheDocument();
7572
});
7673

7774
it('suggests sso authentication to login', function () {
@@ -82,21 +79,23 @@ describe('AcceptOrganizationInvite', function () {
8279
hasAuthProvider: true,
8380
requireSso: false,
8481
existingMember: false,
82+
ssoProvider: 'SSO',
8583
});
8684

87-
const wrapper = mountWithTheme(
88-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
89-
);
85+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
9086

91-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
92-
expect(joinButton.exists()).toBe(false);
87+
expect(getJoinButton()).not.toBeInTheDocument();
9388

94-
expect(wrapper.find('[data-test-id="action-info-general"]').exists()).toBe(true);
95-
expect(wrapper.find('[data-test-id="action-info-sso"]').exists()).toBe(true);
89+
expect(screen.getByTestId('action-info-general')).toBeInTheDocument();
90+
expect(screen.getByTestId('action-info-sso')).toBeInTheDocument();
9691

97-
expect(wrapper.find('Button[aria-label="sso-login"]').exists()).toBe(true);
98-
expect(wrapper.find('Button[aria-label="create-account"]').exists()).toBe(true);
99-
expect(wrapper.find('[data-test-id="link-with-existing"]').exists()).toBe(true);
92+
expect(screen.getByRole('button', {name: 'Join with SSO'})).toBeInTheDocument();
93+
expect(
94+
screen.getByRole('button', {name: 'Create a new account'})
95+
).toBeInTheDocument();
96+
expect(
97+
screen.getByRole('link', {name: 'Login using an existing account'})
98+
).toBeInTheDocument();
10099
});
101100

102101
it('enforce required sso authentication', function () {
@@ -107,21 +106,23 @@ describe('AcceptOrganizationInvite', function () {
107106
hasAuthProvider: true,
108107
requireSso: true,
109108
existingMember: false,
109+
ssoProvider: 'SSO',
110110
});
111111

112-
const wrapper = mountWithTheme(
113-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
114-
);
112+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
115113

116-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
117-
expect(joinButton.exists()).toBe(false);
114+
expect(getJoinButton()).not.toBeInTheDocument();
118115

119-
expect(wrapper.find('[data-test-id="action-info-general"]').exists()).toBe(false);
120-
expect(wrapper.find('[data-test-id="action-info-sso"]').exists()).toBe(true);
116+
expect(screen.queryByTestId('action-info-general')).not.toBeInTheDocument();
117+
expect(screen.getByTestId('action-info-sso')).toBeInTheDocument();
121118

122-
expect(wrapper.find('Button[aria-label="sso-login"]').exists()).toBe(true);
123-
expect(wrapper.find('Button[aria-label="create-account"]').exists()).toBe(false);
124-
expect(wrapper.find('[data-test-id="link-with-existing"]').exists()).toBe(false);
119+
expect(screen.getByRole('button', {name: 'Join with SSO'})).toBeInTheDocument();
120+
expect(
121+
screen.queryByRole('button', {name: 'Create a new account'})
122+
).not.toBeInTheDocument();
123+
expect(
124+
screen.queryByRole('link', {name: 'Login using an existing account'})
125+
).not.toBeInTheDocument();
125126
});
126127

127128
it('enforce required sso authentication for logged in users', function () {
@@ -132,21 +133,23 @@ describe('AcceptOrganizationInvite', function () {
132133
hasAuthProvider: true,
133134
requireSso: true,
134135
existingMember: false,
136+
ssoProvider: 'SSO',
135137
});
136138

137-
const wrapper = mountWithTheme(
138-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
139-
);
139+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
140140

141-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
142-
expect(joinButton.exists()).toBe(false);
141+
expect(getJoinButton()).not.toBeInTheDocument();
143142

144-
expect(wrapper.find('[data-test-id="action-info-general"]').exists()).toBe(false);
145-
expect(wrapper.find('[data-test-id="action-info-sso"]').exists()).toBe(true);
143+
expect(screen.queryByTestId('action-info-general')).not.toBeInTheDocument();
144+
expect(screen.getByTestId('action-info-sso')).toBeInTheDocument();
146145

147-
expect(wrapper.find('Button[aria-label="sso-login"]').exists()).toBe(true);
148-
expect(wrapper.find('Button[aria-label="create-account"]').exists()).toBe(false);
149-
expect(wrapper.find('[data-test-id="link-with-existing"]').exists()).toBe(false);
146+
expect(screen.getByRole('button', {name: 'Join with SSO'})).toBeInTheDocument();
147+
expect(
148+
screen.queryByRole('button', {name: 'Create a new account'})
149+
).not.toBeInTheDocument();
150+
expect(
151+
screen.queryByRole('link', {name: 'Login using an existing account'})
152+
).not.toBeInTheDocument();
150153
});
151154

152155
it('show logout button for logged in users w/ sso and membership', async function () {
@@ -157,25 +160,20 @@ describe('AcceptOrganizationInvite', function () {
157160
hasAuthProvider: true,
158161
requireSso: true,
159162
existingMember: true,
163+
ssoProvider: 'SSO',
160164
});
161165

162-
const wrapper = mountWithTheme(
163-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
164-
);
166+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
165167

166-
const existingMember = wrapper.find('[data-test-id="existing-member"]');
167-
expect(existingMember.exists()).toBe(true);
168+
expect(screen.getByTestId('existing-member')).toBeInTheDocument();
168169

169170
const {replace} = window.location;
170171
window.location.replace = jest.fn();
171172

172-
existingMember
173-
.find('[data-test-id="existing-member-link"]')
174-
.hostNodes()
175-
.simulate('click');
173+
userEvent.click(screen.getByTestId('existing-member-link'));
174+
176175
expect(logout).toHaveBeenCalled();
177-
await tick();
178-
expect(window.location.replace).toHaveBeenCalled();
176+
await waitFor(() => expect(window.location.replace).toHaveBeenCalled());
179177

180178
window.location.replace = replace;
181179
});
@@ -188,17 +186,14 @@ describe('AcceptOrganizationInvite', function () {
188186
hasAuthProvider: true,
189187
requireSso: false,
190188
existingMember: false,
189+
ssoProvider: 'SSO',
191190
});
192191

193-
const wrapper = mountWithTheme(
194-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
195-
);
192+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
196193

197-
const ssoLink = wrapper.find('[data-test-id="action-info-sso"]');
198-
expect(ssoLink.exists()).toBe(true);
194+
expect(screen.getByTestId('action-info-sso')).toBeInTheDocument();
199195

200-
const joinButton = wrapper.find('Button[aria-label="join-organization"]');
201-
expect(joinButton.exists()).toBe(true);
196+
expect(getJoinButton()).toBeInTheDocument();
202197
});
203198

204199
it('shows a logout button for existing members', async function () {
@@ -211,23 +206,17 @@ describe('AcceptOrganizationInvite', function () {
211206
existingMember: true,
212207
});
213208

214-
const wrapper = mountWithTheme(
215-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
216-
);
209+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
217210

218-
const existingMember = wrapper.find('[data-test-id="existing-member"]');
219-
expect(existingMember.exists()).toBe(true);
211+
expect(screen.getByTestId('existing-member')).toBeInTheDocument();
220212

221213
const {replace} = window.location;
222214
window.location.replace = jest.fn();
223215

224-
existingMember
225-
.find('[data-test-id="existing-member-link"]')
226-
.hostNodes()
227-
.simulate('click');
216+
userEvent.click(screen.getByTestId('existing-member-link'));
217+
228218
expect(logout).toHaveBeenCalled();
229-
await tick();
230-
expect(window.location.replace).toHaveBeenCalled();
219+
await waitFor(() => expect(window.location.replace).toHaveBeenCalled());
231220

232221
window.location.replace = replace;
233222
});
@@ -242,10 +231,10 @@ describe('AcceptOrganizationInvite', function () {
242231
existingMember: false,
243232
});
244233

245-
const wrapper = mountWithTheme(
246-
<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />
247-
);
234+
render(<AcceptOrganizationInvite params={{memberId: '1', token: 'abc'}} />);
248235

249-
expect(wrapper.find('[data-test-id="2fa-warning"]').exists()).toBe(true);
236+
expect(
237+
screen.getByRole('button', {name: 'Configure Two-Factor Auth'})
238+
).toBeInTheDocument();
250239
});
251240
});

‎static/app/views/acceptOrganizationInvite.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ class AcceptOrganizationInvite extends AsyncView<Props, State> {
135135
<ActionsLeft>
136136
{inviteDetails.hasAuthProvider && (
137137
<Button
138-
aria-label="sso-login"
138+
data-test-id="sso-login"
139139
priority="primary"
140140
href={this.makeNextUrl(`/auth/login/${inviteDetails.orgSlug}/`)}
141141
>
@@ -144,7 +144,7 @@ class AcceptOrganizationInvite extends AsyncView<Props, State> {
144144
)}
145145
{!inviteDetails.requireSso && (
146146
<Button
147-
aria-label="create-account"
147+
data-test-id="create-account"
148148
priority="primary"
149149
href={this.makeNextUrl('/auth/register/')}
150150
>
@@ -228,7 +228,7 @@ class AcceptOrganizationInvite extends AsyncView<Props, State> {
228228
<ActionsLeft>
229229
{inviteDetails.hasAuthProvider && !inviteDetails.requireSso && (
230230
<Button
231-
aria-label="sso-login"
231+
data-test-id="sso-login"
232232
priority="primary"
233233
href={this.makeNextUrl(`/auth/login/${inviteDetails.orgSlug}/`)}
234234
>
@@ -237,7 +237,7 @@ class AcceptOrganizationInvite extends AsyncView<Props, State> {
237237
)}
238238

239239
<Button
240-
aria-label="join-organization"
240+
data-test-id="join-organization"
241241
priority="primary"
242242
disabled={accepting}
243243
onClick={this.handleAcceptInvite}

‎tests/acceptance/test_accept_organization_invite.py‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,12 +25,12 @@ def test_invite_simple(self):
2525
self.browser.get(self.member.get_invite_link().split("/", 3)[-1])
2626
self.browser.wait_until('[data-test-id="accept-invite"]')
2727
self.browser.snapshot(name="accept organization invite")
28-
assert self.browser.element_exists('[aria-label="join-organization"]')
28+
assert self.browser.element_exists('[data-test-id="join-organization"]')
2929

3030
def test_invite_not_authenticated(self):
3131
self.browser.get(self.member.get_invite_link().split("/", 3)[-1])
3232
self.browser.wait_until('[data-test-id="accept-invite"]')
33-
assert self.browser.element_exists('[aria-label="create-account"]')
33+
assert self.browser.element_exists('[data-test-id="create-account"]')
3434

3535
def test_invite_2fa_enforced_org(self):
3636
self.org.update(flags=F("flags").bitor(Organization.flags.require_2fa))
@@ -49,4 +49,4 @@ def test_invite_sso_org(self):
4949
self.browser.get(self.member.get_invite_link().split("/", 3)[-1])
5050
self.browser.wait_until('[data-test-id="accept-invite"]')
5151
assert self.browser.element_exists_by_test_id("action-info-sso")
52-
assert self.browser.element_exists('[aria-label="sso-login"]')
52+
assert self.browser.element_exists('[data-test-id="sso-login"]')

0 commit comments

Comments
 (0)