diff --git a/src/__tests__/to-have-tag-name.js b/src/__tests__/to-have-tag-name.js
new file mode 100644
index 0000000..23af5f8
--- /dev/null
+++ b/src/__tests__/to-have-tag-name.js
@@ -0,0 +1,18 @@
+import {render} from './helpers/test-utils'
+
+describe('.toHaveTagName', () => {
+ test('handles HTML elements', () => {
+ const {container} = render(`
+
+
+
+
+ `)
+
+ expect(container.querySelector('div')).toHaveTagName('div')
+ expect(container.querySelector('figure')).toHaveTagName('figure')
+ expect(container.querySelector('section')).toHaveTagName('section')
+ expect(container.querySelector('span')).toHaveTagName('span')
+ expect(container.querySelector('span')).not.toHaveTagName('div')
+ })
+})
diff --git a/src/matchers.js b/src/matchers.js
index f67054f..f902502 100644
--- a/src/matchers.js
+++ b/src/matchers.js
@@ -11,6 +11,7 @@ export {toHaveRole} from './to-have-role'
export {toHaveAccessibleName} from './to-have-accessible-name'
export {toHaveAttribute} from './to-have-attribute'
export {toHaveClass} from './to-have-class'
+export {toHaveTagName} from './to-have-tag-name'
export {toHaveStyle} from './to-have-style'
export {toHaveFocus} from './to-have-focus'
export {toHaveFormValues} from './to-have-form-values'
diff --git a/src/to-have-tag-name.js b/src/to-have-tag-name.js
new file mode 100644
index 0000000..fb34f28
--- /dev/null
+++ b/src/to-have-tag-name.js
@@ -0,0 +1,38 @@
+import {checkHtmlElement, getMessage} from './utils'
+
+export function toHaveTagName(htmlElement, expectedTagName) {
+ checkHtmlElement(htmlElement, toHaveTagName, this)
+
+ if (!isValidTagName(expectedTagName)) {
+ throw new Error(
+ `Expected tag name must be a single lowercase word, got ${expectedTagName}`,
+ )
+ }
+
+ const actualTagName = htmlElement.tagName.toLowerCase()
+ const pass = expectedTagName === actualTagName
+
+ return {
+ pass,
+
+ message: () => {
+ const to = this.isNot ? 'not to' : 'to'
+ return getMessage(
+ this,
+ this.utils.matcherHint(
+ `${this.isNot ? '.not' : ''}.${toHaveTagName.name}`,
+ 'element',
+ '',
+ ),
+ `Expected element ${to} have tag name`,
+ expectedTagName,
+ 'Received',
+ actualTagName,
+ )
+ },
+ }
+}
+
+function isValidTagName(value) {
+ return typeof value === 'string' && /^[a-z]+$/.test(value)
+}