Skip to content

Commit a77798e

Browse files
kschowfeedmypixel
kschow
authored and
feedmypixel
committed
Restructure tests to have a maximum depth of 5 describes
1 parent 67128de commit a77798e

File tree

1 file changed

+134
-138
lines changed

1 file changed

+134
-138
lines changed

‎src/__tests__/to-be-visible.js

Lines changed: 134 additions & 138 deletions
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,74 @@ describe('.toBeVisible', () => {
134134
})
135135
})
136136

137+
describe('when the <details /> inner text does not have an enclosing element', () => {
138+
describe('when the details is not opened', () => {
139+
beforeEach(() => {
140+
subject = render(`
141+
<details>
142+
<summary>Title of hidden innerText</summary>
143+
hidden innerText
144+
</details>
145+
`)
146+
})
147+
148+
it('returns false to the details content', () => {
149+
expect(subject.container.querySelector('details')).not.toBeVisible()
150+
})
151+
152+
it('returns true to the details summary', () => {
153+
expect(subject.container.querySelector('summary')).toBeVisible()
154+
})
155+
156+
describe('when the user clicks on the summary', () => {
157+
beforeEach(() => subject.container.querySelector('summary').click())
158+
159+
it('returns true to the details content', () => {
160+
expect(subject.container.querySelector('details')).toBeVisible()
161+
})
162+
163+
it('returns true to the details summary', () => {
164+
expect(subject.container.querySelector('summary')).toBeVisible()
165+
})
166+
})
167+
})
168+
169+
describe('when the details is opened', () => {
170+
beforeEach(() => {
171+
subject = render(`
172+
<details open>
173+
<summary>Title of visible innerText</summary>
174+
visible <small>innerText</small>
175+
</details>
176+
`)
177+
})
178+
179+
it('returns true to the details content', () => {
180+
expect(subject.container.querySelector('details')).toBeVisible()
181+
})
182+
183+
it('returns true to inner small content', () => {
184+
expect(subject.container.querySelector('small')).toBeVisible()
185+
})
186+
187+
describe('when the user clicks on the summary', () => {
188+
beforeEach(() => subject.container.querySelector('summary').click())
189+
190+
it('returns false to the details content', () => {
191+
expect(subject.container.querySelector('details')).not.toBeVisible()
192+
})
193+
194+
it('returns false to the inner small content', () => {
195+
expect(subject.container.querySelector('small')).not.toBeVisible()
196+
})
197+
198+
it('returns true to the details summary', () => {
199+
expect(subject.container.querySelector('summary')).toBeVisible()
200+
})
201+
})
202+
})
203+
})
204+
137205
describe('with a nested <details /> element', () => {
138206
describe('when the nested <details /> is opened', () => {
139207
beforeEach(() => {
@@ -248,181 +316,109 @@ describe('.toBeVisible', () => {
248316
})
249317
})
250318

251-
describe('when the details inner text does not have an enclosing element', () => {
252-
describe('when the details is not opened', () => {
319+
describe('with nested details (unenclosed outer, enclosed inner)', () => {
320+
describe('when both outer and inner are opened', () => {
253321
beforeEach(() => {
254322
subject = render(`
255-
<details>
256-
<summary>Title of hidden innerText</summary>
257-
hidden innerText
323+
<details open>
324+
<summary>Title of outer unenclosed</summary>
325+
Unenclosed innerText
326+
<details open>
327+
<summary>Title of inner enclosed</summary>
328+
<div>Enclosed innerText</div>
329+
</details>
258330
</details>
259331
`)
260332
})
261333

262-
it('returns false to the details content', () => {
263-
expect(subject.container.querySelector('details')).not.toBeVisible()
334+
it('returns true to outer unenclosed innerText', () => {
335+
expect(subject.container.querySelector('details')).toBeVisible()
264336
})
265337

266-
it('returns true to the details summary', () => {
338+
it('returns true to outer summary', () => {
267339
expect(subject.container.querySelector('summary')).toBeVisible()
268340
})
269341

270-
describe('when the user clicks on the summary', () => {
271-
beforeEach(() => subject.container.querySelector('summary').click())
272-
273-
it('returns true to the details content', () => {
274-
expect(subject.container.querySelector('details')).toBeVisible()
275-
})
342+
it('returns true to inner enclosed innerText', () => {
343+
expect(
344+
subject.container.querySelector('details > details > div'),
345+
).toBeVisible()
346+
})
276347

277-
it('returns true to the details summary', () => {
278-
expect(subject.container.querySelector('summary')).toBeVisible()
279-
})
348+
it('returns true to inner summary', () => {
349+
expect(
350+
subject.container.querySelector('details > details > summary'),
351+
).toBeVisible()
280352
})
281353
})
282354

283-
describe('when the details is opened', () => {
355+
describe('when outer is opened and inner is not opened', () => {
284356
beforeEach(() => {
285357
subject = render(`
286358
<details open>
287-
<summary>Title of visible innerText</summary>
288-
visible <small>innerText</small>
359+
<summary>Title of outer unenclosed</summary>
360+
Unenclosed innerText
361+
<details>
362+
<summary>Title of inner enclosed</summary>
363+
<div>Enclosed innerText</div>
364+
</details>
289365
</details>
290366
`)
291367
})
292368

293-
it('returns true to the details content', () => {
369+
it('returns true to outer unenclosed innerText', () => {
294370
expect(subject.container.querySelector('details')).toBeVisible()
295371
})
296372

297-
it('returns true to inner small content', () => {
298-
expect(subject.container.querySelector('small')).toBeVisible()
373+
it('returns true to outer summary', () => {
374+
expect(subject.container.querySelector('summary')).toBeVisible()
299375
})
300376

301-
describe('when the user clicks on the summary', () => {
302-
beforeEach(() => subject.container.querySelector('summary').click())
303-
304-
it('returns false to the details content', () => {
305-
expect(
306-
subject.container.querySelector('details'),
307-
).not.toBeVisible()
308-
})
309-
310-
it('returns false to the inner small content', () => {
311-
expect(subject.container.querySelector('small')).not.toBeVisible()
312-
})
377+
it('returns false to inner enclosed innerText', () => {
378+
expect(
379+
subject.container.querySelector('details > details > div'),
380+
).not.toBeVisible()
381+
})
313382

314-
it('returns true to the details summary', () => {
315-
expect(subject.container.querySelector('summary')).toBeVisible()
316-
})
383+
it('returns true to inner summary', () => {
384+
expect(
385+
subject.container.querySelector('details > details > summary'),
386+
).toBeVisible()
317387
})
318388
})
319389

320-
describe('with nested details (unenclosed outer, enclosed inner)', () => {
321-
describe('when both outer and inner are opened', () => {
322-
beforeEach(() => {
323-
subject = render(`
390+
describe('when outer is not opened and inner is opened', () => {
391+
beforeEach(() => {
392+
subject = render(`
393+
<details>
394+
<summary>Title of outer unenclosed</summary>
395+
Unenclosed innerText
324396
<details open>
325-
<summary>Title of outer unenclosed</summary>
326-
Unenclosed innerText
327-
<details open>
328-
<summary>Title of inner enclosed</summary>
329-
<div>Enclosed innerText</div>
330-
</details>
397+
<summary>Title of inner enclosed</summary>
398+
<div>Enclosed innerText</div>
331399
</details>
332-
`)
333-
})
334-
335-
it('returns true to outer unenclosed innerText', () => {
336-
expect(subject.container.querySelector('details')).toBeVisible()
337-
})
338-
339-
it('returns true to outer summary', () => {
340-
expect(subject.container.querySelector('summary')).toBeVisible()
341-
})
342-
343-
it('returns true to inner enclosed innerText', () => {
344-
expect(
345-
subject.container.querySelector('details > details > div'),
346-
).toBeVisible()
347-
})
348-
349-
it('returns true to inner summary', () => {
350-
expect(
351-
subject.container.querySelector('details > details > summary'),
352-
).toBeVisible()
353-
})
400+
</details>
401+
`)
354402
})
355403

356-
describe('when outer is opened and inner is not opened', () => {
357-
beforeEach(() => {
358-
subject = render(`
359-
<details open>
360-
<summary>Title of outer unenclosed</summary>
361-
Unenclosed innerText
362-
<details>
363-
<summary>Title of inner enclosed</summary>
364-
<div>Enclosed innerText</div>
365-
</details>
366-
</details>
367-
`)
368-
})
369-
370-
it('returns true to outer unenclosed innerText', () => {
371-
expect(subject.container.querySelector('details')).toBeVisible()
372-
})
373-
374-
it('returns true to outer summary', () => {
375-
expect(subject.container.querySelector('summary')).toBeVisible()
376-
})
377-
378-
it('returns false to inner enclosed innerText', () => {
379-
expect(
380-
subject.container.querySelector('details > details > div'),
381-
).not.toBeVisible()
382-
})
383-
384-
it('returns true to inner summary', () => {
385-
expect(
386-
subject.container.querySelector('details > details > summary'),
387-
).toBeVisible()
388-
})
404+
it('returns true to outer unenclosed innerText', () => {
405+
expect(subject.container.querySelector('details')).not.toBeVisible()
389406
})
390407

391-
describe('when outer is not opened and inner is opened', () => {
392-
beforeEach(() => {
393-
subject = render(`
394-
<details>
395-
<summary>Title of outer unenclosed</summary>
396-
Unenclosed innerText
397-
<details open>
398-
<summary>Title of inner enclosed</summary>
399-
<div>Enclosed innerText</div>
400-
</details>
401-
</details>
402-
`)
403-
})
404-
405-
it('returns true to outer unenclosed innerText', () => {
406-
expect(
407-
subject.container.querySelector('details'),
408-
).not.toBeVisible()
409-
})
410-
411-
it('returns true to outer summary', () => {
412-
expect(subject.container.querySelector('summary')).toBeVisible()
413-
})
414-
415-
it('returns false to inner enclosed innerText', () => {
416-
expect(
417-
subject.container.querySelector('details > details > div'),
418-
).not.toBeVisible()
419-
})
420-
421-
it('returns true to inner summary', () => {
422-
expect(
423-
subject.container.querySelector('details > details > summary'),
424-
).not.toBeVisible()
425-
})
408+
it('returns true to outer summary', () => {
409+
expect(subject.container.querySelector('summary')).toBeVisible()
410+
})
411+
412+
it('returns false to inner enclosed innerText', () => {
413+
expect(
414+
subject.container.querySelector('details > details > div'),
415+
).not.toBeVisible()
416+
})
417+
418+
it('returns true to inner summary', () => {
419+
expect(
420+
subject.container.querySelector('details > details > summary'),
421+
).not.toBeVisible()
426422
})
427423
})
428424
})

0 commit comments

Comments
 (0)