diff options
Diffstat (limited to 'spec/frontend/read_more_spec.js')
-rw-r--r-- | spec/frontend/read_more_spec.js | 33 |
1 files changed, 28 insertions, 5 deletions
diff --git a/spec/frontend/read_more_spec.js b/spec/frontend/read_more_spec.js index 80d7c941660..9eddc50d50a 100644 --- a/spec/frontend/read_more_spec.js +++ b/spec/frontend/read_more_spec.js @@ -1,21 +1,23 @@ -import { loadHTMLFixture, resetHTMLFixture } from 'helpers/fixtures'; +import { loadHTMLFixture, resetHTMLFixture, setHTMLFixture } from 'helpers/fixtures'; import initReadMore from '~/read_more'; describe('Read more click-to-expand functionality', () => { const fixtureName = 'projects/overview.html'; - beforeEach(() => { - loadHTMLFixture(fixtureName); - }); + const findTrigger = () => document.querySelector('.js-read-more-trigger'); afterEach(() => { resetHTMLFixture(); }); describe('expands target element', () => { + beforeEach(() => { + loadHTMLFixture(fixtureName); + }); + it('adds "is-expanded" class to target element', () => { const target = document.querySelector('.read-more-container'); - const trigger = document.querySelector('.js-read-more-trigger'); + const trigger = findTrigger(); initReadMore(); trigger.click(); @@ -23,4 +25,25 @@ describe('Read more click-to-expand functionality', () => { expect(target.classList.contains('is-expanded')).toEqual(true); }); }); + + describe('given click on nested element', () => { + beforeEach(() => { + setHTMLFixture(` + <p>Target</p> + <button type="button" class="js-read-more-trigger"> + <span>Button text</span> + </button> + `); + + const trigger = findTrigger(); + const nestedElement = trigger.firstElementChild; + initReadMore(); + + nestedElement.click(); + }); + + it('removes the trigger element', async () => { + expect(findTrigger()).toBe(null); + }); + }); }); |