diff --git a/src/__tests__/to-be-visible.js b/src/__tests__/to-be-visible.js
index d1a4c6e5..177a938c 100644
--- a/src/__tests__/to-be-visible.js
+++ b/src/__tests__/to-be-visible.js
@@ -134,6 +134,74 @@ describe('.toBeVisible', () => {
})
})
+ describe('when the inner text does not have an enclosing element', () => {
+ describe('when the details is not opened', () => {
+ beforeEach(() => {
+ subject = render(`
+
+ Title of hidden innerText
+ hidden innerText
+
+ `)
+ })
+
+ it('returns false to the details content', () => {
+ expect(subject.container.querySelector('details')).not.toBeVisible()
+ })
+
+ it('returns true to the details summary', () => {
+ expect(subject.container.querySelector('summary')).toBeVisible()
+ })
+
+ describe('when the user clicks on the summary', () => {
+ beforeEach(() => subject.container.querySelector('summary').click())
+
+ it('returns true to the details content', () => {
+ expect(subject.container.querySelector('details')).toBeVisible()
+ })
+
+ it('returns true to the details summary', () => {
+ expect(subject.container.querySelector('summary')).toBeVisible()
+ })
+ })
+ })
+
+ describe('when the details is opened', () => {
+ beforeEach(() => {
+ subject = render(`
+
+ Title of visible innerText
+ visible innerText
+
+ `)
+ })
+
+ it('returns true to the details content', () => {
+ expect(subject.container.querySelector('details')).toBeVisible()
+ })
+
+ it('returns true to inner small content', () => {
+ expect(subject.container.querySelector('small')).toBeVisible()
+ })
+
+ describe('when the user clicks on the summary', () => {
+ beforeEach(() => subject.container.querySelector('summary').click())
+
+ it('returns false to the details content', () => {
+ expect(subject.container.querySelector('details')).not.toBeVisible()
+ })
+
+ it('returns false to the inner small content', () => {
+ expect(subject.container.querySelector('small')).not.toBeVisible()
+ })
+
+ it('returns true to the details summary', () => {
+ expect(subject.container.querySelector('summary')).toBeVisible()
+ })
+ })
+ })
+ })
+
describe('with a nested element', () => {
describe('when the nested is opened', () => {
beforeEach(() => {
@@ -248,181 +316,109 @@ describe('.toBeVisible', () => {
})
})
- describe('when the details inner text does not have an enclosing element', () => {
- describe('when the details is not opened', () => {
+ describe('with nested details (unenclosed outer, enclosed inner)', () => {
+ describe('when both outer and inner are opened', () => {
beforeEach(() => {
subject = render(`
-
- Title of hidden innerText
- hidden innerText
+
+ Title of outer unenclosed
+ Unenclosed innerText
+
+ Title of inner enclosed
+ Enclosed innerText
+
`)
})
- it('returns false to the details content', () => {
- expect(subject.container.querySelector('details')).not.toBeVisible()
+ it('returns true to outer unenclosed innerText', () => {
+ expect(subject.container.querySelector('details')).toBeVisible()
})
- it('returns true to the details summary', () => {
+ it('returns true to outer summary', () => {
expect(subject.container.querySelector('summary')).toBeVisible()
})
- describe('when the user clicks on the summary', () => {
- beforeEach(() => subject.container.querySelector('summary').click())
-
- it('returns true to the details content', () => {
- expect(subject.container.querySelector('details')).toBeVisible()
- })
+ it('returns true to inner enclosed innerText', () => {
+ expect(
+ subject.container.querySelector('details > details > div'),
+ ).toBeVisible()
+ })
- it('returns true to the details summary', () => {
- expect(subject.container.querySelector('summary')).toBeVisible()
- })
+ it('returns true to inner summary', () => {
+ expect(
+ subject.container.querySelector('details > details > summary'),
+ ).toBeVisible()
})
})
- describe('when the details is opened', () => {
+ describe('when outer is opened and inner is not opened', () => {
beforeEach(() => {
subject = render(`
- Title of visible innerText
- visible innerText
+ Title of outer unenclosed
+ Unenclosed innerText
+
+ Title of inner enclosed
+ Enclosed innerText
+
`)
})
- it('returns true to the details content', () => {
+ it('returns true to outer unenclosed innerText', () => {
expect(subject.container.querySelector('details')).toBeVisible()
})
- it('returns true to inner small content', () => {
- expect(subject.container.querySelector('small')).toBeVisible()
+ it('returns true to outer summary', () => {
+ expect(subject.container.querySelector('summary')).toBeVisible()
})
- describe('when the user clicks on the summary', () => {
- beforeEach(() => subject.container.querySelector('summary').click())
-
- it('returns false to the details content', () => {
- expect(
- subject.container.querySelector('details'),
- ).not.toBeVisible()
- })
-
- it('returns false to the inner small content', () => {
- expect(subject.container.querySelector('small')).not.toBeVisible()
- })
+ it('returns false to inner enclosed innerText', () => {
+ expect(
+ subject.container.querySelector('details > details > div'),
+ ).not.toBeVisible()
+ })
- it('returns true to the details summary', () => {
- expect(subject.container.querySelector('summary')).toBeVisible()
- })
+ it('returns true to inner summary', () => {
+ expect(
+ subject.container.querySelector('details > details > summary'),
+ ).toBeVisible()
})
})
- describe('with nested details (unenclosed outer, enclosed inner)', () => {
- describe('when both outer and inner are opened', () => {
- beforeEach(() => {
- subject = render(`
+ describe('when outer is not opened and inner is opened', () => {
+ beforeEach(() => {
+ subject = render(`
+
+ Title of outer unenclosed
+ Unenclosed innerText
- Title of outer unenclosed
- Unenclosed innerText
-
- Title of inner enclosed
- Enclosed innerText
-
+ Title of inner enclosed
+ Enclosed innerText
- `)
- })
-
- it('returns true to outer unenclosed innerText', () => {
- expect(subject.container.querySelector('details')).toBeVisible()
- })
-
- it('returns true to outer summary', () => {
- expect(subject.container.querySelector('summary')).toBeVisible()
- })
-
- it('returns true to inner enclosed innerText', () => {
- expect(
- subject.container.querySelector('details > details > div'),
- ).toBeVisible()
- })
-
- it('returns true to inner summary', () => {
- expect(
- subject.container.querySelector('details > details > summary'),
- ).toBeVisible()
- })
+
+ `)
})
- describe('when outer is opened and inner is not opened', () => {
- beforeEach(() => {
- subject = render(`
-
- Title of outer unenclosed
- Unenclosed innerText
-
- Title of inner enclosed
- Enclosed innerText
-
-
- `)
- })
-
- it('returns true to outer unenclosed innerText', () => {
- expect(subject.container.querySelector('details')).toBeVisible()
- })
-
- it('returns true to outer summary', () => {
- expect(subject.container.querySelector('summary')).toBeVisible()
- })
-
- it('returns false to inner enclosed innerText', () => {
- expect(
- subject.container.querySelector('details > details > div'),
- ).not.toBeVisible()
- })
-
- it('returns true to inner summary', () => {
- expect(
- subject.container.querySelector('details > details > summary'),
- ).toBeVisible()
- })
+ it('returns true to outer unenclosed innerText', () => {
+ expect(subject.container.querySelector('details')).not.toBeVisible()
})
- describe('when outer is not opened and inner is opened', () => {
- beforeEach(() => {
- subject = render(`
-
- Title of outer unenclosed
- Unenclosed innerText
-
- Title of inner enclosed
- Enclosed innerText
-
-
- `)
- })
-
- it('returns true to outer unenclosed innerText', () => {
- expect(
- subject.container.querySelector('details'),
- ).not.toBeVisible()
- })
-
- it('returns true to outer summary', () => {
- expect(subject.container.querySelector('summary')).toBeVisible()
- })
-
- it('returns false to inner enclosed innerText', () => {
- expect(
- subject.container.querySelector('details > details > div'),
- ).not.toBeVisible()
- })
-
- it('returns true to inner summary', () => {
- expect(
- subject.container.querySelector('details > details > summary'),
- ).not.toBeVisible()
- })
+ it('returns true to outer summary', () => {
+ expect(subject.container.querySelector('summary')).toBeVisible()
+ })
+
+ it('returns false to inner enclosed innerText', () => {
+ expect(
+ subject.container.querySelector('details > details > div'),
+ ).not.toBeVisible()
+ })
+
+ it('returns true to inner summary', () => {
+ expect(
+ subject.container.querySelector('details > details > summary'),
+ ).not.toBeVisible()
})
})
})