Skip to content

Commit e909d33

Browse files
Mario Aguiarravichdev
Mario Aguiar
authored and
ravichdev
committed
Add more tests for API
1 parent 97c7132 commit e909d33

File tree

4 files changed

+241
-6
lines changed

4 files changed

+241
-6
lines changed

‎plugin/assets/src/settings/components/integrations/api.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,12 @@ import Button from '../../../wizard/components/navigation/button';
3030
import { setApiKey } from '../../utils';
3131
import Dialog from '../../../common/components/dialog';
3232

33-
const Api = () => {
34-
const { state, dispatch } = useContext( SettingsContext );
33+
const Api = ( { apiStatus } ) => {
34+
const { dispatch } = useContext( SettingsContext );
3535
const [ api, setApi ] = useState( null );
3636
const [ isLoading, setIsLoading ] = useState( false );
3737
const [ confirm, setConfirm ] = useState( false );
38-
const isApiOk = 'ok' === state.apiStatus;
38+
const isApiOk = 'ok' === apiStatus;
3939

4040
const dispatchError = error =>
4141
dispatch( {

‎plugin/assets/src/settings/components/integrations/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ const Integrations = () => {
108108
} }
109109
></p>
110110

111-
<Api />
111+
<Api apiStatus={ state.apiStatus } />
112112
</div>
113113
);
114114
};

‎plugin/tests/js/settings/components/integrations/__snapshots__/api.test.js.snap‎

Lines changed: 211 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,3 +102,214 @@ exports[`Settings: Switch matches snapshot 1`] = `
102102
</div>
103103
</div>
104104
`;
105+
106+
exports[`Settings: Switch matches snapshot when API is not ok 1`] = `
107+
<div>
108+
<div
109+
class="material-settings__api mdc-layout-grid"
110+
>
111+
<div
112+
class="mdc-dialog"
113+
>
114+
<div
115+
class="mdc-dialog__container"
116+
>
117+
<div
118+
aria-describedby="dialog-content-1"
119+
aria-labelledby="dialog-title-1"
120+
aria-modal="true"
121+
class="mdc-dialog__surface"
122+
role="alertdialog"
123+
>
124+
<h2
125+
class="mdc-dialog__title"
126+
id="dialog-title-1"
127+
>
128+
Remove Google API Key?
129+
</h2>
130+
<div
131+
class="mdc-dialog__content"
132+
id="dialog-content-1"
133+
>
134+
This action is permanent and cannot be undone
135+
</div>
136+
<div
137+
class="mdc-dialog__actions"
138+
>
139+
<button
140+
class="mdc-button mdc-dialog__button"
141+
type="button"
142+
>
143+
<div
144+
class="mdc-button__ripple"
145+
/>
146+
<span
147+
class="mdc-button__label"
148+
>
149+
Cancel
150+
</span>
151+
</button>
152+
<button
153+
class="mdc-button mdc-dialog__button mdc-action__remove"
154+
type="button"
155+
>
156+
<div
157+
class="mdc-button__ripple"
158+
/>
159+
<span
160+
class="mdc-button__label"
161+
>
162+
Remove
163+
</span>
164+
</button>
165+
</div>
166+
</div>
167+
</div>
168+
<div
169+
class="mdc-dialog__scrim"
170+
/>
171+
</div>
172+
<div
173+
class="mdc-layout-grid__inner"
174+
>
175+
<div
176+
class="components-base-control material-settings__api-input mdc-layout-grid__cell"
177+
>
178+
<div
179+
class="components-base-control__field"
180+
>
181+
<input
182+
class="components-text-control__input"
183+
id="inspector-text-control-1"
184+
placeholder="Google API Key"
185+
type="text"
186+
value=""
187+
/>
188+
</div>
189+
</div>
190+
<div
191+
class="mdc-layout-grid__cell"
192+
>
193+
<button
194+
class="mdc-button mdc-button--raised"
195+
disabled=""
196+
>
197+
<span
198+
class="mdc-button__label"
199+
>
200+
Activate
201+
</span>
202+
</button>
203+
</div>
204+
</div>
205+
</div>
206+
</div>
207+
`;
208+
209+
exports[`Settings: Switch matches snapshot when API is ok 1`] = `
210+
<div>
211+
<div
212+
class="material-settings__api mdc-layout-grid"
213+
>
214+
<div
215+
class="mdc-dialog"
216+
>
217+
<div
218+
class="mdc-dialog__container"
219+
>
220+
<div
221+
aria-describedby="dialog-content-2"
222+
aria-labelledby="dialog-title-2"
223+
aria-modal="true"
224+
class="mdc-dialog__surface"
225+
role="alertdialog"
226+
>
227+
<h2
228+
class="mdc-dialog__title"
229+
id="dialog-title-2"
230+
>
231+
Remove Google API Key?
232+
</h2>
233+
<div
234+
class="mdc-dialog__content"
235+
id="dialog-content-2"
236+
>
237+
This action is permanent and cannot be undone
238+
</div>
239+
<div
240+
class="mdc-dialog__actions"
241+
>
242+
<button
243+
class="mdc-button mdc-dialog__button"
244+
type="button"
245+
>
246+
<div
247+
class="mdc-button__ripple"
248+
/>
249+
<span
250+
class="mdc-button__label"
251+
>
252+
Cancel
253+
</span>
254+
</button>
255+
<button
256+
class="mdc-button mdc-dialog__button mdc-action__remove"
257+
type="button"
258+
>
259+
<div
260+
class="mdc-button__ripple"
261+
/>
262+
<span
263+
class="mdc-button__label"
264+
>
265+
Remove
266+
</span>
267+
</button>
268+
</div>
269+
</div>
270+
</div>
271+
<div
272+
class="mdc-dialog__scrim"
273+
/>
274+
</div>
275+
<div
276+
class="mdc-layout-grid__inner"
277+
>
278+
<div
279+
class="components-base-control material-settings__api-input material-settings__api-input--disabled mdc-layout-grid__cell"
280+
>
281+
<div
282+
class="components-base-control__field"
283+
>
284+
<input
285+
class="components-text-control__input"
286+
disabled=""
287+
id="inspector-text-control-2"
288+
type="text"
289+
value="•••••••••••••••••••••••••••••"
290+
/>
291+
</div>
292+
</div>
293+
<div
294+
class="mdc-layout-grid__cell"
295+
>
296+
<button
297+
class="mdc-button"
298+
>
299+
<i
300+
aria-hidden="true"
301+
class="material-icons mdc-button__icon leading-icon"
302+
>
303+
delete
304+
</i>
305+
<span
306+
class="mdc-button__label"
307+
>
308+
Remove
309+
</span>
310+
</button>
311+
</div>
312+
</div>
313+
</div>
314+
</div>
315+
`;

‎plugin/tests/js/settings/components/integrations/api.test.js‎

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,17 +26,41 @@ import { render } from '@testing-library/react';
2626
import Api from '../../../../../assets/src/settings/components/integrations/api';
2727
import { SettingsProvider } from '../../../../../assets/src/settings/context';
2828

29-
const setup = () => {
29+
const setup = props => {
3030
return render(
3131
<SettingsProvider>
32-
<Api />
32+
<Api { ...props } />
3333
</SettingsProvider>
3434
);
3535
};
3636

37+
const baseProps = {
38+
apiStatus: 'ok',
39+
};
40+
3741
describe( 'Settings: Switch', () => {
3842
it( 'matches snapshot', () => {
3943
const { container } = setup();
4044
expect( container ).toMatchSnapshot();
4145
} );
46+
47+
it( 'matches snapshot when API is not ok', () => {
48+
const props = {
49+
...baseProps,
50+
apiStatus: 'install',
51+
};
52+
53+
const { container } = setup( props );
54+
expect( container ).toMatchSnapshot();
55+
} );
56+
57+
it( 'matches snapshot when API is ok', () => {
58+
const props = {
59+
...baseProps,
60+
apiStatus: 'ok',
61+
};
62+
63+
const { container } = setup( props );
64+
expect( container ).toMatchSnapshot();
65+
} );
4266
} );

0 commit comments

Comments
 (0)