11import React from 'react' ;
22import {
3- act , fireEvent , render , screen , waitFor ,
3+ render , screen , waitFor ,
44} from '@testing-library/react' ;
55import userEvent from '@testing-library/user-event' ;
66import '@testing-library/jest-dom/extend-expect' ;
@@ -94,29 +94,20 @@ function testSAPConfigSetup(formData) {
9494}
9595
9696async function clearForm ( ) {
97- await act ( async ( ) => {
98- fireEvent . change ( screen . getByLabelText ( 'Display Name' ) , {
99- target : { value : '' } ,
100- } ) ;
101- fireEvent . change ( screen . getByLabelText ( 'SAP Base URL' ) , {
102- target : { value : '' } ,
103- } ) ;
104- fireEvent . change ( screen . getByLabelText ( 'SAP Company ID' ) , {
105- target : { value : '' } ,
106- } ) ;
107- fireEvent . change ( screen . getByLabelText ( 'SAP User ID' ) , {
108- target : { value : '' } ,
109- } ) ;
110- fireEvent . change ( screen . getByLabelText ( 'OAuth Client ID' ) , {
111- target : { value : '' } ,
112- } ) ;
113- fireEvent . change ( screen . getByLabelText ( 'OAuth Client Secret' ) , {
114- target : { value : '' } ,
115- } ) ;
116- } ) ;
97+ const user = userEvent . setup ( ) ;
98+ await user . clear ( screen . getByLabelText ( 'Display Name' ) ) ;
99+ await user . clear ( screen . getByLabelText ( 'SAP Base URL' ) ) ;
100+ await user . clear ( screen . getByLabelText ( 'SAP Company ID' ) ) ;
101+ await user . clear ( screen . getByLabelText ( 'SAP User ID' ) ) ;
102+ await user . clear ( screen . getByLabelText ( 'OAuth Client ID' ) ) ;
103+ await user . clear ( screen . getByLabelText ( 'OAuth Client Secret' ) ) ;
117104}
118105
119106describe ( '<SAPConfig />' , ( ) => {
107+ beforeEach ( ( ) => {
108+ jest . clearAllMocks ( ) ;
109+ } ) ;
110+
120111 test ( 'renders SAP Enable Form' , ( ) => {
121112 render ( testSAPConfigSetup ( noConfigs ) ) ;
122113 screen . getByLabelText ( 'Display Name' ) ;
@@ -128,11 +119,12 @@ describe('<SAPConfig />', () => {
128119 screen . getByLabelText ( 'SAP User Type' ) ;
129120 } ) ;
130121 test ( 'test error messages' , async ( ) => {
122+ const user = userEvent . setup ( ) ;
131123 render ( testSAPConfigSetup ( noExistingData ) ) ;
132124
133125 const enableButton = screen . getByRole ( 'button' , { name : 'Enable' } ) ;
134126 await clearForm ( ) ;
135- userEvent . click ( enableButton ) ;
127+ await user . click ( enableButton ) ;
136128 expect ( screen . queryByText ( validationMessages . displayNameRequired ) ) ;
137129 expect ( screen . queryByText ( validationMessages . baseUrlRequired ) ) ;
138130 expect ( screen . queryByText ( validationMessages . companyIdRequired ) ) ;
@@ -141,47 +133,44 @@ describe('<SAPConfig />', () => {
141133 expect ( screen . queryByText ( validationMessages . secretRequired ) ) ;
142134 expect ( screen . queryByText ( validationMessages . userTypeRequired ) ) ;
143135
144- userEvent . paste ( screen . getByLabelText ( 'Display Name' ) , 'terriblenogoodverybaddisplayname' ) ;
145- userEvent . paste ( screen . getByLabelText ( 'SAP Base URL' ) , 'badlink' ) ;
146- userEvent . paste ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
147- userEvent . paste ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
148- userEvent . paste ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
149- userEvent . paste ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
150- userEvent . click ( screen . getByLabelText ( 'Admin' ) ) ;
136+ await user . type ( screen . getByLabelText ( 'Display Name' ) , 'terriblenogoodverybaddisplayname' ) ;
137+ await user . type ( screen . getByLabelText ( 'SAP Base URL' ) , 'badlink' ) ;
138+ await user . type ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
139+ await user . type ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
140+ await user . type ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
141+ await user . type ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
142+ await user . click ( screen . getByLabelText ( 'Admin' ) ) ;
151143
152- userEvent . click ( enableButton ) ;
144+ await user . click ( enableButton ) ;
153145 expect ( screen . queryByText ( INVALID_LINK ) ) ;
154146 expect ( screen . queryByText ( INVALID_NAME ) ) ;
155147
156- fireEvent . change ( screen . getByLabelText ( 'Display Name' ) , {
157- target : { value : '' } ,
158- } ) ;
159- fireEvent . change ( screen . getByLabelText ( 'SAP Base URL' ) , {
160- target : { value : '' } ,
161- } ) ;
162- userEvent . paste ( screen . getByLabelText ( 'Display Name' ) , 'displayName' ) ;
163- userEvent . paste (
148+ await user . clear ( screen . getByLabelText ( 'Display Name' ) ) ;
149+ await user . clear ( screen . getByLabelText ( 'SAP Base URL' ) ) ;
150+ await user . type ( screen . getByLabelText ( 'Display Name' ) , 'displayName' ) ;
151+ await user . type (
164152 screen . getByLabelText ( 'SAP Base URL' ) ,
165153 'https://www.test.com' ,
166154 ) ;
167- userEvent . click ( enableButton ) ;
155+ await user . click ( enableButton ) ;
168156 expect ( screen . queryByText ( INVALID_LINK ) ) . not . toBeInTheDocument ( ) ;
169157 expect ( screen . queryByText ( INVALID_NAME ) ) . not . toBeInTheDocument ( ) ;
170158 } ) ;
171159 test ( 'it creates new configs on submit' , async ( ) => {
160+ const user = userEvent . setup ( ) ;
172161 render ( testSAPConfigSetup ( noExistingData ) ) ;
173162 const enableButton = screen . getByRole ( 'button' , { name : 'Enable' } ) ;
174163
175164 await clearForm ( ) ;
176- userEvent . paste ( screen . getByLabelText ( 'Display Name' ) , 'lmsconfig' ) ;
177- userEvent . paste ( screen . getByLabelText ( 'SAP Base URL' ) , 'http://www.example.com' ) ;
178- userEvent . paste ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
179- userEvent . paste ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
180- userEvent . paste ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
181- userEvent . paste ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
182- userEvent . click ( screen . getByLabelText ( 'Admin' ) ) ;
183-
184- userEvent . click ( enableButton ) ;
165+ await user . type ( screen . getByLabelText ( 'Display Name' ) , 'lmsconfig' ) ;
166+ await user . type ( screen . getByLabelText ( 'SAP Base URL' ) , 'http://www.example.com' ) ;
167+ await user . type ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
168+ await user . type ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
169+ await user . type ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
170+ await user . type ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
171+ await user . click ( screen . getByLabelText ( 'Admin' ) ) ;
172+
173+ await user . click ( enableButton ) ;
185174 const expectedConfig = {
186175 active : false ,
187176 display_name : 'lmsconfig' ,
@@ -196,25 +185,26 @@ describe('<SAPConfig />', () => {
196185 await waitFor ( ( ) => expect ( mockPost ) . toHaveBeenCalledWith ( expectedConfig ) ) ;
197186 } , 30000 ) ;
198187 test ( 'saves draft correctly' , async ( ) => {
188+ const user = userEvent . setup ( ) ;
199189 render ( testSAPConfigSetup ( noExistingData ) ) ;
200190 const cancelButton = screen . getByRole ( 'button' , { name : 'Cancel' } ) ;
201191
202192 await clearForm ( ) ;
203- userEvent . paste ( screen . getByLabelText ( 'Display Name' ) , 'lmsconfig' ) ;
204- userEvent . paste ( screen . getByLabelText ( 'SAP Base URL' ) , 'http://www.example.com' ) ;
205- userEvent . paste ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
206- userEvent . paste ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
207- userEvent . paste ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
208- userEvent . paste ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
209- userEvent . click ( screen . getByLabelText ( 'User' ) ) ;
193+ await user . type ( screen . getByLabelText ( 'Display Name' ) , 'lmsconfig' ) ;
194+ await user . type ( screen . getByLabelText ( 'SAP Base URL' ) , 'http://www.example.com' ) ;
195+ await user . type ( screen . getByLabelText ( 'SAP Company ID' ) , '1' ) ;
196+ await user . type ( screen . getByLabelText ( 'SAP User ID' ) , '1' ) ;
197+ await user . type ( screen . getByLabelText ( 'OAuth Client ID' ) , 'id' ) ;
198+ await user . type ( screen . getByLabelText ( 'OAuth Client Secret' ) , 'secret' ) ;
199+ await user . click ( screen . getByLabelText ( 'User' ) ) ;
210200
211201 expect ( cancelButton ) . not . toBeDisabled ( ) ;
212- userEvent . click ( cancelButton ) ;
202+ await user . click ( cancelButton ) ;
213203
214204 await waitFor ( ( ) => expect ( screen . getByText ( 'Exit configuration' ) ) . toBeInTheDocument ( ) ) ;
215205 const closeButton = screen . getByRole ( 'button' , { name : 'Exit' } ) ;
216206
217- userEvent . click ( closeButton ) ;
207+ await user . click ( closeButton ) ;
218208
219209 const expectedConfig = {
220210 active : false ,
@@ -227,16 +217,18 @@ describe('<SAPConfig />', () => {
227217 user_type : 'user' ,
228218 enterprise_customer : enterpriseId ,
229219 } ;
230- expect ( mockPost ) . toHaveBeenCalledWith ( expectedConfig ) ;
220+ await waitFor ( ( ) => expect ( mockPost ) . toHaveBeenCalledWith ( expectedConfig ) ) ;
231221 } ) ;
232222 test ( 'validates poorly formatted existing data on load' , async ( ) => {
223+ const user = userEvent . setup ( ) ;
233224 render ( testSAPConfigSetup ( invalidExistingData ) ) ;
234225 const enableButton = screen . getByRole ( 'button' , { name : 'Enable' } ) ;
235- userEvent . click ( enableButton ) ;
226+ await user . click ( enableButton ) ;
236227 expect ( screen . queryByText ( INVALID_LINK ) ) . toBeInTheDocument ( ) ;
237228 expect ( screen . queryByText ( INVALID_NAME ) ) . toBeInTheDocument ( ) ;
238229 } ) ;
239- test ( 'validates properly formatted existing data on load' , ( ) => {
230+ test ( 'validates properly formatted existing data on load' , async ( ) => {
231+ const user = userEvent . setup ( ) ;
240232 render ( testSAPConfigSetup ( existingConfigData ) ) ;
241233 const enableButton = screen . getByRole ( 'button' , { name : 'Enable' } ) ;
242234 // ensuring the existing data is prefilled
@@ -247,7 +239,7 @@ describe('<SAPConfig />', () => {
247239 expect ( screen . getByLabelText ( 'OAuth Client ID' ) . value ) . toEqual ( existingConfigData . key ) ;
248240 expect ( screen . getByLabelText ( 'OAuth Client Secret' ) . value ) . toEqual ( existingConfigData . secret ) ;
249241
250- userEvent . click ( enableButton ) ;
242+ await user . click ( enableButton ) ;
251243 expect ( screen . queryByText ( INVALID_LINK ) ) . not . toBeInTheDocument ( ) ;
252244 expect ( screen . queryByText ( INVALID_NAME ) ) . not . toBeInTheDocument ( ) ;
253245 } ) ;
0 commit comments