diff --git a/.all-contributorsrc b/.all-contributorsrc index 998ea778..889eeb59 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -158,6 +158,16 @@ "doc", "test" ] + }, + { + "login": "jgoz", + "name": "John Gozde", + "avatar_url": "https://avatars2.githubusercontent.com/u/132233?v=4", + "profile": "https://github.com/jgoz", + "contributions": [ + "bug", + "code" + ] } ] } diff --git a/README.md b/README.md index d3d94bbf..b3259c95 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ [![downloads][downloads-badge]][npmtrends] [![MIT License][license-badge]][license] -[![All Contributors](https://img.shields.io/badge/all_contributors-15-orange.svg?style=flat-square)](#contributors) +[![All Contributors](https://img.shields.io/badge/all_contributors-16-orange.svg?style=flat-square)](#contributors) [![PRs Welcome][prs-badge]][prs] [![Code of Conduct][coc-badge]][coc] @@ -46,6 +46,7 @@ to maintain. - [Usage](#usage) - [Custom matchers](#custom-matchers) - [`toBeInTheDOM`](#tobeinthedom) + - [`toBeEmpty`](#tobeempty) - [`toContainElement`](#tocontainelement) - [`toHaveTextContent`](#tohavetextcontent) - [`toHaveAttribute`](#tohaveattribute) @@ -318,7 +319,7 @@ Thanks goes to these people ([emoji key][emojis]): | [
Kent C. Dodds](https://kentcdodds.com)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=kentcdodds "Code") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=kentcdodds "Documentation") [πŸš‡](#infra-kentcdodds "Infrastructure (Hosting, Build-Tools, etc)") [⚠️](https://github.com/gnapse/jest-dom/commits?author=kentcdodds "Tests") | [
Ryan Castner](http://audiolion.github.io)
[πŸ“–](https://github.com/gnapse/jest-dom/commits?author=audiolion "Documentation") | [
Daniel Sandiego](https://www.dnlsandiego.com)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=dnlsandiego "Code") | [
PaweΕ‚ MikoΕ‚ajczyk](https://github.com/Miklet)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=Miklet "Code") | [
Alejandro ÑÑñez Ortiz](http://co.linkedin.com/in/alejandronanez/)
[πŸ“–](https://github.com/gnapse/jest-dom/commits?author=alejandronanez "Documentation") | [
Matt Parrish](https://github.com/pbomb)
[πŸ›](https://github.com/gnapse/jest-dom/issues?q=author%3Apbomb "Bug reports") [πŸ’»](https://github.com/gnapse/jest-dom/commits?author=pbomb "Code") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=pbomb "Documentation") [⚠️](https://github.com/gnapse/jest-dom/commits?author=pbomb "Tests") | [
Justin Hall](https://github.com/wKovacs64)
[πŸ“¦](#platform-wKovacs64 "Packaging/porting to new platform") | | :---: | :---: | :---: | :---: | :---: | :---: | :---: | | [
Anto Aravinth](https://github.com/antoaravinth)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=antoaravinth "Code") [⚠️](https://github.com/gnapse/jest-dom/commits?author=antoaravinth "Tests") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=antoaravinth "Documentation") | [
Jonah Moses](https://github.com/JonahMoses)
[πŸ“–](https://github.com/gnapse/jest-dom/commits?author=JonahMoses "Documentation") | [
Łukasz Gandecki](http://team.thebrain.pro)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=lgandecki "Code") [⚠️](https://github.com/gnapse/jest-dom/commits?author=lgandecki "Tests") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=lgandecki "Documentation") | [
Ivan Babak](https://sompylasar.github.io)
[πŸ›](https://github.com/gnapse/jest-dom/issues?q=author%3Asompylasar "Bug reports") [πŸ€”](#ideas-sompylasar "Ideas, Planning, & Feedback") | [
Jesse Day](https://github.com/jday3)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=jday3 "Code") | [
Ernesto GarcΓ­a](http://gnapse.github.io)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=gnapse "Code") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=gnapse "Documentation") [⚠️](https://github.com/gnapse/jest-dom/commits?author=gnapse "Tests") | [
Mark Volkmann](http://ociweb.com/mark/)
[πŸ›](https://github.com/gnapse/jest-dom/issues?q=author%3Amvolkmann "Bug reports") [πŸ’»](https://github.com/gnapse/jest-dom/commits?author=mvolkmann "Code") | -| [
smacpherson64](https://github.com/smacpherson64)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Code") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Documentation") [⚠️](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Tests") | +| [
smacpherson64](https://github.com/smacpherson64)
[πŸ’»](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Code") [πŸ“–](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Documentation") [⚠️](https://github.com/gnapse/jest-dom/commits?author=smacpherson64 "Tests") | [
John Gozde](https://github.com/jgoz)
[πŸ›](https://github.com/gnapse/jest-dom/issues?q=author%3Ajgoz "Bug reports") [πŸ’»](https://github.com/gnapse/jest-dom/commits?author=jgoz "Code") | diff --git a/src/__tests__/index.js b/src/__tests__/index.js index 8622cc2a..8ced5f7d 100644 --- a/src/__tests__/index.js +++ b/src/__tests__/index.js @@ -8,32 +8,42 @@ test('.toBeInTheDOM', () => { const {queryByTestId} = render(` + `) const containerElement = queryByTestId('count-container') const valueElement = queryByTestId('count-value') const nonExistantElement = queryByTestId('not-exists') + const svgElement = queryByTestId('svg-element') const fakeElement = {thisIsNot: 'an html element'} // Testing toBeInTheDOM without container expect(valueElement).toBeInTheDOM() + expect(svgElement).toBeInTheDOM() expect(nonExistantElement).not.toBeInTheDOM() // negative test cases wrapped in throwError assertions for coverage. expect(() => expect(valueElement).not.toBeInTheDOM()).toThrowError() + expect(() => expect(svgElement).not.toBeInTheDOM()).toThrowError() + expect(() => expect(nonExistantElement).toBeInTheDOM()).toThrowError() expect(() => expect(fakeElement).toBeInTheDOM()).toThrowError() // Testing toBeInTheDOM with container expect(valueElement).toBeInTheDOM(containerElement) + expect(svgElement).toBeInTheDOM(containerElement) expect(containerElement).not.toBeInTheDOM(valueElement) expect(() => expect(valueElement).not.toBeInTheDOM(containerElement), ).toThrowError() + expect(() => + expect(svgElement).not.toBeInTheDOM(containerElement), + ).toThrowError() + expect(() => expect(nonExistantElement).toBeInTheDOM(containerElement), ).toThrowError() @@ -53,21 +63,26 @@ test('.toContainElement', () => { + `) const grandparent = queryByTestId('grandparent') const parent = queryByTestId('parent') const child = queryByTestId('child') + const svgElement = queryByTestId('svg-element') const nonExistantElement = queryByTestId('not-exists') const fakeElement = {thisIsNot: 'an html element'} expect(grandparent).toContainElement(parent) expect(grandparent).toContainElement(child) + expect(grandparent).toContainElement(svgElement) expect(parent).toContainElement(child) expect(parent).not.toContainElement(grandparent) + expect(parent).not.toContainElement(svgElement) expect(child).not.toContainElement(parent) expect(child).not.toContainElement(grandparent) + expect(child).not.toContainElement(svgElement) // negative test cases wrapped in throwError assertions for coverage. expect(() => @@ -96,25 +111,33 @@ test('.toContainElement', () => { expect(() => expect(grandparent).toContainElement(fakeElement)).toThrowError() expect(() => expect(fakeElement).toContainElement(fakeElement)).toThrowError() expect(() => expect(grandparent).not.toContainElement(child)).toThrowError() + expect(() => + expect(grandparent).not.toContainElement(svgElement), + ).toThrowError() }) test('.toBeEmpty', () => { const {queryByTestId} = render(` + `) const empty = queryByTestId('empty') const notEmpty = queryByTestId('not-empty') + const svgEmpty = queryByTestId('svg-empty') const nonExistantElement = queryByTestId('not-exists') const fakeElement = {thisIsNot: 'an html element'} expect(empty).toBeEmpty() + expect(svgEmpty).toBeEmpty() expect(notEmpty).not.toBeEmpty() // negative test cases wrapped in throwError assertions for coverage. expect(() => expect(empty).not.toBeEmpty()).toThrowError() + expect(() => expect(svgEmpty).not.toBeEmpty()).toThrowError() + expect(() => expect(notEmpty).toBeEmpty()).toThrowError() expect(() => expect(fakeElement).toBeEmpty()).toThrowError() @@ -148,6 +171,7 @@ test('.toHaveAttribute', () => { + `) expect(queryByTestId('ok-button')).toHaveAttribute('disabled') @@ -155,6 +179,9 @@ test('.toHaveAttribute', () => { expect(queryByTestId('ok-button')).not.toHaveAttribute('class') expect(queryByTestId('ok-button')).toHaveAttribute('type', 'submit') expect(queryByTestId('ok-button')).not.toHaveAttribute('type', 'button') + expect(queryByTestId('svg-element')).toHaveAttribute('width') + expect(queryByTestId('svg-element')).toHaveAttribute('width', '12') + expect(queryByTestId('ok-button')).not.toHaveAttribute('height') expect(() => expect(queryByTestId('ok-button')).not.toHaveAttribute('disabled'), @@ -171,6 +198,12 @@ test('.toHaveAttribute', () => { expect(() => expect(queryByTestId('ok-button')).toHaveAttribute('type', 'button'), ).toThrowError() + expect(() => + expect(queryByTestId('svg-element')).not.toHaveAttribute('width'), + ).toThrowError() + expect(() => + expect(queryByTestId('svg-element')).not.toHaveAttribute('width', '12'), + ).toThrowError() expect(() => expect({thisIsNot: 'an html element'}).not.toHaveAttribute(), ).toThrowError() @@ -185,6 +218,9 @@ test('.toHaveClass', () => { + + + `) @@ -195,6 +231,9 @@ test('.toHaveClass', () => { expect(queryByTestId('delete-button')).toHaveClass('btn btn-danger') expect(queryByTestId('delete-button')).not.toHaveClass('btn-link') expect(queryByTestId('cancel-button')).not.toHaveClass('btn-danger') + expect(queryByTestId('svg-spinner')).toHaveClass('spinner') + expect(queryByTestId('svg-spinner')).toHaveClass('clockwise') + expect(queryByTestId('svg-spinner')).not.toHaveClass('wise') expect(() => expect(queryByTestId('delete-button')).not.toHaveClass('btn'), @@ -217,6 +256,12 @@ test('.toHaveClass', () => { expect(() => expect(queryByTestId('cancel-button')).toHaveClass('btn-danger'), ).toThrowError() + expect(() => + expect(queryByTestId('svg-spinner')).not.toHaveClass('spinner'), + ).toThrowError() + expect(() => + expect(queryByTestId('svg-spinner')).toHaveClass('wise'), + ).toThrowError() }) test('.toHaveStyle', () => { diff --git a/src/utils.js b/src/utils.js index 357ddaf9..7540bdcb 100644 --- a/src/utils.js +++ b/src/utils.js @@ -23,14 +23,19 @@ class HtmlElementTypeError extends Error { '', ), '', - `${receivedColor('received')} value must be an HTMLElement.`, + `${receivedColor( + 'received', + )} value must be an HTMLElement or an SVGElement.`, printWithType('Received', received, printReceived), ].join('\n') } } function checkHtmlElement(htmlElement, ...args) { - if (!(htmlElement instanceof HTMLElement)) { + if ( + !(htmlElement instanceof HTMLElement) && + !(htmlElement instanceof SVGElement) + ) { throw new HtmlElementTypeError(htmlElement, ...args) } }