diff --git a/README.md b/README.md
index b0ba168..c1aa45e 100644
--- a/README.md
+++ b/README.md
@@ -45,7 +45,9 @@ yarn add @untemps/svelte-use-tooltip
         position: 'right',
         animated: true,
         animationEnterClassName: 'tooltip-enter',
-		animationLeaveClassName: 'tooltip-leave',
+        animationLeaveClassName: 'tooltip-leave',
+        enterDelay: 200,
+        leaveDelay: 400,
         disabled: false
     }
 } class="tooltip__target">
@@ -102,18 +104,20 @@ yarn add @untemps/svelte-use-tooltip
 
 ## API
 
-| Props                      | Type    | Default | Description                                                                                                     |
-| -------------------------- | ------- | ------- | --------------------------------------------------------------------------------------------------------------- |
-| `content`                  | string  | null    | Text content to display in the tooltip.                                                                         |
-| `contentSelector`          | string  | null    | Selector of the content to display in the tooltip.                                                              |
-| `contentClone`             | boolean | null    | Flag to clone the content to display in the tooltip. If false, the content is removed from its previous parent. |
-| `contentActions`           | object  | null    | Configuration of the tooltip actions (see [Content Actions](#content-actions)).                                 |
-| `containerClassName`       | string  | null    | Class name to apply to the tooltip container.                                                                   |
-| `position`                 | string  | 'top'   | Position of the tooltip. Available values: 'top', 'bottom', 'left', 'right'                                     |
-| `animated`                 | boolean | false   | Flag to animate tooltip transitions.                                                                            |
-| `animationEnterClassName`  | string  | null    | Class name to apply to the tooltip enter transition.                                                            |
-| `animationLeaveClassName`  | string  | null    | Class name to apply to the tooltip leave transition.                                                            |
-| `disabled`                 | boolean | false   | Flag to disable the tooltip content.                                                                            |
+| Props                     | Type    | Default | Description                                                                                                     |
+|---------------------------|---------|---------|-----------------------------------------------------------------------------------------------------------------|
+| `content`                 | string  | null    | Text content to display in the tooltip.                                                                         |
+| `contentSelector`         | string  | null    | Selector of the content to display in the tooltip.                                                              |
+| `contentClone`            | boolean | null    | Flag to clone the content to display in the tooltip. If false, the content is removed from its previous parent. |
+| `contentActions`          | object  | null    | Configuration of the tooltip actions (see [Content Actions](#content-actions)).                                 |
+| `containerClassName`      | string  | null    | Class name to apply to the tooltip container.                                                                   |
+| `position`                | string  | 'top'   | Position of the tooltip. Available values: 'top', 'bottom', 'left', 'right'                                     |
+| `animated`                | boolean | false   | Flag to animate tooltip transitions.                                                                            |
+| `animationEnterClassName` | string  | null    | Class name to apply to the tooltip enter transition.                                                            |
+| `animationLeaveClassName` | string  | null    | Class name to apply to the tooltip leave transition.                                                            |
+| `enterDelay`              | number  | 0       | Delay before showing the tooltip.                                                                               |
+| `leaveDelay`              | number  | 0       | Delay before hiding the tooltip.                                                                                |
+| `disabled`                | boolean | false   | Flag to disable the tooltip content.                                                                            |
 
 ### Content Actions
 
diff --git a/dev/src/App.svelte b/dev/src/App.svelte
index 6996334..e1726c1 100644
--- a/dev/src/App.svelte
+++ b/dev/src/App.svelte
@@ -1,13 +1,15 @@
 <script>
 	import { useTooltip } from '../../src'
 
-	let textContent = null
+	let tooltipTextContent = null
 	let useCustomTooltipClass = false
 	let tooltipPosition = 'top'
 	let isTooltipDisabled = false
 	let animateTooltip = false
 	let useCustomAnimationEnterClass = false
 	let useCustomAnimationLeaveClass = false
+	let tooltipEnterDelay = 200
+	let tooltipLeaveDelay = 200
 
 	const _onTooltipClick = (arg) => {
 		console.log(arg)
@@ -19,8 +21,8 @@
 		<div
 			use:useTooltip={{
 				position: tooltipPosition,
-				content: textContent,
-				contentSelector: !textContent?.length ? '.tooltip__content' : null,
+				content: tooltipTextContent,
+				contentSelector: !tooltipTextContent?.length ? '.tooltip__content' : null,
 				contentClone: true,
 				contentActions: {
 					'*': {
@@ -31,10 +33,12 @@
 					},
 				},
 				containerClassName: useCustomTooltipClass ? 'tooltip' : null,
-				disabled: isTooltipDisabled,
 				animated: animateTooltip,
 				animationEnterClassName: useCustomAnimationEnterClass ? 'tooltip-enter' : null,
 				animationLeaveClassName: useCustomAnimationLeaveClass ? 'tooltip-leave' : null,
+				enterDelay: tooltipEnterDelay,
+				leaveDelay: tooltipLeaveDelay,
+				disabled: isTooltipDisabled
 			}}
 			class="target"
 		>
@@ -51,7 +55,7 @@
 			<fieldset>
 				<label>
 					Tooltip Text Content:
-					<input type="text" bind:value={textContent} />
+					<input type="text" bind:value={tooltipTextContent} />
 				</label>
 			</fieldset>
 			<fieldset>
@@ -79,16 +83,28 @@
 			</fieldset>
 			<fieldset>
 				<label>
-					Use Custom Animation Enter Class:
+					Use Custom Tooltip Animation Enter Class:
 					<input type="checkbox" bind:checked={useCustomAnimationEnterClass} />
 				</label>
 			</fieldset>
 			<fieldset>
 				<label>
-					Use Custom Animation Leave Class:
+					Use Custom Tooltip Animation Leave Class:
 					<input type="checkbox" bind:checked={useCustomAnimationLeaveClass} />
 				</label>
 			</fieldset>
+			<fieldset>
+				<label>
+					Tooltip Enter Delay (ms):
+					<input type="number" step={100} min={0} bind:value={tooltipEnterDelay} />
+				</label>
+			</fieldset>
+			<fieldset>
+				<label>
+					Tooltip Leave Delay (ms):
+					<input type="number" step={100} min={0} bind:value={tooltipLeaveDelay} />
+				</label>
+			</fieldset>
 			<fieldset>
 				<label>
 					Disable Tooltip:
diff --git a/jest/jest.setup.js b/jest/jest.setup.js
index 7fc7c75..aabc046 100644
--- a/jest/jest.setup.js
+++ b/jest/jest.setup.js
@@ -3,11 +3,12 @@ import '@testing-library/jest-dom/extend-expect'
 
 expect.extend({ toBeInTheDocument, toHaveAttribute, toHaveStyle })
 
-global._createElement = (id = 'foo', className = 'bar', ariaLabel = 'gag') => {
+global._createElement = (id = 'foo', attrs) => {
 	const el = document.createElement('div')
 	el.setAttribute('id', id)
-	el.setAttribute('class', className)
-	el.setAttribute('aria-label', ariaLabel)
+	for (let key in attrs) {
+		el.setAttribute(key, attrs[key])
+	}
 	document.body.appendChild(el)
 	return el
 }
diff --git a/src/Tooltip.js b/src/Tooltip.js
index 98261ae..fb967e4 100644
--- a/src/Tooltip.js
+++ b/src/Tooltip.js
@@ -9,6 +9,9 @@ class Tooltip {
 
 	#observer = null
 	#events = []
+	#enterDelay = 0
+	#leaveDelay = 0
+	#delay = null
 
 	#tooltip = null
 
@@ -44,18 +47,22 @@ class Tooltip {
 		animated,
 		animationEnterClassName,
 		animationLeaveClassName,
+		enterDelay,
+		leaveDelay,
 		disabled
 	) {
 		this.#target = target
 		this.#content = content
 		this.#contentSelector = contentSelector
+		this.#contentClone = contentClone || false
 		this.#contentActions = contentActions
-		this.#contentClone = contentClone
 		this.#containerClassName = containerClassName
-		this.#position = position
-		this.#animated = animated
+		this.#position = position || 'top'
+		this.#animated = animated || false
 		this.#animationEnterClassName = animationEnterClassName || '__tooltip-enter'
 		this.#animationLeaveClassName = animationLeaveClassName || '__tooltip-leave'
+		this.#enterDelay = enterDelay || 0
+		this.#leaveDelay = leaveDelay || 0
 
 		this.#observer = new DOMObserver()
 
@@ -63,6 +70,7 @@ class Tooltip {
 		this.#target.setAttribute('style', 'position: relative')
 
 		this.#createTooltip()
+		this.#tooltip.classList.add(this.#containerClassName || '__tooltip', `__tooltip-${this.#position}`)
 
 		disabled ? this.#disableTarget() : this.#enableTarget()
 
@@ -79,31 +87,41 @@ class Tooltip {
 		animated,
 		animationEnterClassName,
 		animationLeaveClassName,
+		enterDelay,
+		leaveDelay,
 		disabled
 	) {
 		const hasContentChanged = contentSelector !== this.#contentSelector || content !== this.#content
 		const hasContainerClassNameChanged = containerClassName !== this.#containerClassName
+		const oldPosition = this.#position
+		const hasPositionChanged = position !== this.#position
 		const hasToDisableTarget = disabled && this.#boundEnterHandler
 		const hasToEnableTarget = !disabled && !this.#boundEnterHandler
 
 		this.#content = content
 		this.#contentSelector = contentSelector
-		this.#contentClone = contentClone
+		this.#contentClone = contentClone || false
 		this.#contentActions = contentActions
 		this.#containerClassName = containerClassName
-		this.#position = position
-		this.#animated = animated
+		this.#position = position || 'top'
+		this.#animated = animated || false
 		this.#animationEnterClassName = animationEnterClassName || '__tooltip-enter'
 		this.#animationLeaveClassName = animationLeaveClassName || '__tooltip-leave'
+		this.#enterDelay = enterDelay || 0
+		this.#leaveDelay = leaveDelay || 0
 
 		if (hasContentChanged) {
 			this.#removeTooltipFromTarget()
-
 			this.#createTooltip()
 		}
 
 		if (hasContainerClassNameChanged) {
-			this.#tooltip.className = this.#containerClassName || `__tooltip __tooltip-${this.#position}`
+			this.#tooltip.classList.add(this.#containerClassName || '__tooltip')
+		}
+
+		if (hasPositionChanged) {
+			this.#tooltip.classList.remove(`__tooltip-${oldPosition}`)
+			this.#tooltip.classList.add(`__tooltip-${this.#position}`)
 		}
 
 		if (hasToDisableTarget) {
@@ -118,6 +136,8 @@ class Tooltip {
 
 		this.#disableTarget()
 
+		this.#clearDelay()
+
 		this.#observer?.clear()
 		this.#observer = null
 	}
@@ -140,7 +160,6 @@ class Tooltip {
 
 	#createTooltip() {
 		this.#tooltip = document.createElement('div')
-		this.#tooltip.className = this.#containerClassName || `__tooltip __tooltip-${this.#position}`
 
 		if (this.#contentSelector) {
 			this.#observer
@@ -229,6 +248,22 @@ class Tooltip {
 		this.#events = []
 	}
 
+	#waitForDelay(delay) {
+		this.#clearDelay()
+		return new Promise(
+			(resolve) =>
+				(this.#delay = setTimeout(() => {
+					this.#clearDelay()
+					resolve()
+				}, delay))
+		)
+	}
+
+	#clearDelay() {
+		clearTimeout(this.#delay)
+		this.#delay = null
+	}
+
 	#transitionTooltip(direction) {
 		return new Promise((resolve) => {
 			let classToAdd, classToRemove
@@ -260,10 +295,12 @@ class Tooltip {
 	}
 
 	async #onTargetEnter() {
+		await this.#waitForDelay(this.#enterDelay)
 		await this.#appendTooltipToTarget()
 	}
 
 	async #onTargetLeave() {
+		await this.#waitForDelay(this.#leaveDelay)
 		await this.#removeTooltipFromTarget()
 	}
 }
diff --git a/src/__tests__/useTooltip.test.js b/src/__tests__/useTooltip.test.js
index 3e6a9c6..d4acf29 100644
--- a/src/__tests__/useTooltip.test.js
+++ b/src/__tests__/useTooltip.test.js
@@ -13,8 +13,30 @@ describe('useTooltip', () => {
 		options,
 		action = null
 
+	const _enter = async () =>
+		new Promise(async (resolve) => {
+			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
+			await fireEvent.mouseEnter(target)
+			await _sleep(10)
+			resolve()
+		})
+
+	const _leave = async () =>
+		new Promise(async (resolve) => {
+			await fireEvent.mouseLeave(target)
+			await _sleep(10)
+			resolve()
+		})
+
+	const _enterAndLeave = async () =>
+		new Promise(async (resolve) => {
+			await _enter()
+			await _leave()
+			resolve()
+		})
+
 	beforeEach(() => {
-		target = _createElement('target')
+		target = _createElement('target', { class: 'bar' })
 		template = _createElement('template')
 		options = {
 			contentSelector: '#template',
@@ -47,37 +69,15 @@ describe('useTooltip', () => {
 		describe('init', () => {
 			it('Shows tooltip on mouse enter', async () => {
 				action = useTooltip(target, options)
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
+				await _enter()
 				expect(template).toBeInTheDocument()
 			})
 
 			it('Hides tooltip on mouse leave', async () => {
 				action = useTooltip(target, options)
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				await fireEvent.mouseLeave(target)
-				expect(template).not.toBeInTheDocument()
-				await fireEvent.animationEnd(template.parentNode)
+				await _enterAndLeave()
 				expect(template).not.toBeInTheDocument()
 			})
-
-			it('Hides tooltip on mouse leave when animated', async () => {
-				action = useTooltip(target, { ...options, animated: true })
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				await fireEvent.mouseLeave(target)
-				expect(template).toBeInTheDocument()
-				await fireEvent.animationEnd(template.parentNode)
-				expect(template).not.toBeInTheDocument()
-			})
-
-			it('Disables tooltip', async () => {
-				action = useTooltip(target, { ...options, disabled: true })
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				expect(template).not.toBeVisible()
-			})
 		})
 
 		describe('update', () => {
@@ -89,34 +89,10 @@ describe('useTooltip', () => {
 				action = useTooltip(target, options)
 				const newTemplate = _createElement('new-template')
 				action.update({
-					...options,
 					contentSelector: '#new-template',
 				})
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				expect(newTemplate).toBeVisible()
-			})
-
-			it('Disables tooltip', async () => {
-				action = useTooltip(target, options)
-				action.update({
-					...options,
-					disabled: true,
-				})
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				expect(template).not.toBeVisible()
-			})
-
-			it('Enables tooltip', async () => {
-				action = useTooltip(target, { ...options, disabled: true })
-				action.update({
-					...options,
-					disabled: false,
-				})
-				await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-				await fireEvent.mouseEnter(target)
-				expect(template).toBeVisible()
+				await _enter()
+				expect(newTemplate).toBeInTheDocument()
 			})
 		})
 	})
@@ -125,26 +101,23 @@ describe('useTooltip', () => {
 		it('Destroys tooltip', async () => {
 			action = useTooltip(target, options)
 			action.destroy()
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			expect(template).not.toBeVisible()
 		})
 	})
 
-	describe('useTooltip content', () => {
+	describe('useTooltip props: content', () => {
 		it('Displays text content', async () => {
 			const content = 'Foo'
 			action = useTooltip(target, { ...options, contentSelector: null, content })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			expect(target).toHaveTextContent(content)
 		})
 
 		it('Displays content element over text', async () => {
 			const content = 'Foo'
 			action = useTooltip(target, { ...options, content })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			expect(target).not.toHaveTextContent(content)
 			expect(template).toBeInTheDocument()
 		})
@@ -154,8 +127,7 @@ describe('useTooltip', () => {
 		it('Triggers callback on tooltip click', async () => {
 			action = useTooltip(target, options)
 			const contentAction = options.contentActions['*']
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			await fireEvent.click(template)
 			expect(contentAction.callback).toHaveBeenCalledWith(contentAction.callbackParams[0], expect.any(Event))
 			expect(template).toBeInTheDocument()
@@ -165,8 +137,7 @@ describe('useTooltip', () => {
 			action = useTooltip(target, options)
 			options.contentActions['*'].closeOnCallback = true
 			const contentAction = options.contentActions['*']
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			await fireEvent.click(template)
 			expect(contentAction.callback).toHaveBeenCalledWith(contentAction.callbackParams[0], expect.any(Event))
 			expect(template).not.toBeInTheDocument()
@@ -178,8 +149,7 @@ describe('useTooltip', () => {
 			action = useTooltip(target, { ...options, animated: true })
 			options.contentActions['*'].closeOnCallback = true
 			const contentAction = options.contentActions['*']
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			await fireEvent.click(template)
 			expect(contentAction.callback).toHaveBeenCalledWith(contentAction.callbackParams[0], expect.any(Event))
 			expect(template).toBeInTheDocument()
@@ -202,8 +172,7 @@ describe('useTooltip', () => {
 			}
 			const contentAction = newOptions.contentActions['*']
 			action.update(newOptions)
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			await fireEvent.click(template)
 			expect(contentAction.callback).toHaveBeenCalledWith(
 				contentAction.callbackParams[0],
@@ -216,106 +185,241 @@ describe('useTooltip', () => {
 	describe('useTooltip props: containerClassName', () => {
 		it('Sets tooltip default class', async () => {
 			action = useTooltip(target, options)
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			expect(template.parentNode).toHaveClass('__tooltip')
 		})
 
 		it('Updates tooltip class', async () => {
 			action = useTooltip(target, options)
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
-			expect(template.parentNode).toHaveClass('__tooltip')
 			action.update({
-				...options,
 				containerClassName: '__custom-tooltip',
 			})
+			await _enter()
 			expect(template.parentNode).toHaveClass('__custom-tooltip')
 		})
 
 		it('Sets tooltip custom class', async () => {
 			action = useTooltip(target, { ...options, containerClassName: '__custom-tooltip' })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
 			expect(template.parentNode).toHaveClass('__custom-tooltip')
 		})
 	})
 
 	describe('useTooltip props: disabled', () => {
-		it('Prevents from showing tooltip if immediately disabled', async () => {
-			action = useTooltip(target, { ...options, disabled: true })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+		it('Disables tooltip', async () => {
+			action = useTooltip(target, {
+				...options,
+				disabled: true,
+			})
+			await _enter()
 			expect(template).not.toBeVisible()
 		})
 
-		it('Prevents from showing tooltip if disabled after update', async () => {
+		it('Disables tooltip after update', async () => {
 			action = useTooltip(target, options)
-			action.update({ ...options, disabled: true })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			action.update({
+				disabled: true,
+			})
+			await _enter()
 			expect(template).not.toBeVisible()
 		})
+
+		it('Enables tooltip after update', async () => {
+			action = useTooltip(target, {
+				...options,
+				disabled: true,
+			})
+			action.update({
+				disabled: false,
+			})
+			await _enter()
+			expect(template).toBeVisible()
+		})
 	})
 
 	describe('useTooltip props: position', () => {
-		it('Updates tooltip position: from left to right', async () => {
-			action = useTooltip(target, { ...options, position: 'left' })
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
-
-			const left = template.parentNode.style.left
-			const top = template.parentNode.style.top
+		it('Positions tooltip on the left', async () => {
+			action = useTooltip(target, {
+				...options,
+				position: 'left',
+			})
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).toHaveClass('__tooltip-left')
+		})
 
+		it('Positions tooltip on the left after update', async () => {
+			action = useTooltip(target, options)
 			action.update({
+				position: 'left',
+			})
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).not.toHaveClass('__tooltip-top')
+			expect(template.parentNode).toHaveClass('__tooltip-left')
+		})
+
+		it('Positions tooltip on the right', async () => {
+			action = useTooltip(target, {
 				...options,
 				position: 'right',
 			})
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
-
-			expect(template.parentNode.style.left).not.toBe(left)
-			expect(template.parentNode.style.top).toBe(top)
+			await _enter()
+			expect(template.parentNode.style.left).toHaveLength(0)
+			expect(template.parentNode.style.right).not.toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).toHaveClass('__tooltip-right')
 		})
 
-		it('Updates tooltip position: from top to bottom', async () => {
+		it('Positions tooltip on the right after update', async () => {
 			action = useTooltip(target, options)
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			action.update({
+				position: 'right',
+			})
+			await _enter()
+			expect(template.parentNode.style.left).toHaveLength(0)
+			expect(template.parentNode.style.right).not.toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).not.toHaveClass('__tooltip-top')
+			expect(template.parentNode).toHaveClass('__tooltip-right')
+		})
 
-			const left = template.parentNode.style.left
-			const top = template.parentNode.style.top
-			const bottom = template.parentNode.style.bottom
+		it('Positions tooltip at the top', async () => {
+			action = useTooltip(target, options)
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).toHaveClass('__tooltip-top')
+		})
 
+		it('Positions tooltip at the top after update', async () => {
+			action = useTooltip(target, {
+				...options,
+				position: 'left',
+			})
 			action.update({
+				position: 'top',
+			})
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).not.toHaveLength(0)
+			expect(template.parentNode.style.bottom).toHaveLength(0)
+			expect(template.parentNode).not.toHaveClass('__tooltip-left')
+			expect(template.parentNode).toHaveClass('__tooltip-top')
+		})
+
+		it('Positions tooltip at the bottom', async () => {
+			action = useTooltip(target, {
 				...options,
 				position: 'bottom',
 			})
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).toHaveLength(0)
+			expect(template.parentNode.style.bottom).not.toHaveLength(0)
+			expect(template.parentNode).toHaveClass('__tooltip-bottom')
+		})
 
-			expect(template.parentNode.style.left).toBe(left)
-			expect(template.parentNode.style.top).not.toBe(top)
-			expect(template.parentNode.style.bottom).not.toBe(bottom)
+		it('Positions tooltip at the bottom after update', async () => {
+			action = useTooltip(target, options)
+			action.update({
+				position: 'bottom',
+			})
+			await _enter()
+			expect(template.parentNode.style.left).not.toHaveLength(0)
+			expect(template.parentNode.style.right).toHaveLength(0)
+			expect(template.parentNode.style.top).toHaveLength(0)
+			expect(template.parentNode.style.bottom).not.toHaveLength(0)
+			expect(template.parentNode).not.toHaveClass('__tooltip-top')
+			expect(template.parentNode).toHaveClass('__tooltip-bottom')
+		})
+	})
+
+	describe('useTooltip props: enterDelay', () => {
+		it('Delays tooltip appearance', async () => {
+			action = useTooltip(target, {
+				...options,
+				enterDelay: 50,
+			})
+			await _enter()
+			expect(template).not.toBeInTheDocument()
+			await _sleep(100)
+			expect(template).toBeInTheDocument()
 		})
 
-		it('Updates tooltip position: from top to left', async () => {
+		it('Delays tooltip disappearance after update', async () => {
 			action = useTooltip(target, options)
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			action.update({
+				enterDelay: 150,
+			})
+			await _enter()
+			await _sleep(100)
+			expect(template).not.toBeInTheDocument()
+			await _sleep(100)
+			expect(template).toBeInTheDocument()
+		})
+	})
 
-			const left = template.parentNode.style.left
-			const top = template.parentNode.style.top
+	describe('useTooltip props: leaveDelay', () => {
+		it('Delays tooltip disappearance', async () => {
+			action = useTooltip(target, {
+				...options,
+				leaveDelay: 50,
+			})
+			await _enterAndLeave()
+			expect(template).toBeInTheDocument()
+			await _sleep(100)
+			expect(template).not.toBeInTheDocument()
+		})
 
+		it('Delays tooltip disappearance after update', async () => {
+			action = useTooltip(target, options)
 			action.update({
+				leaveDelay: 150,
+			})
+			await _enterAndLeave()
+			await _sleep(100)
+			expect(template).toBeInTheDocument()
+			await _sleep(100)
+			expect(template).not.toBeInTheDocument()
+		})
+	})
+
+	describe('useTooltip props: animated', () => {
+		it('Animates tooltip disappearance', async () => {
+			action = useTooltip(target, {
 				...options,
-				position: 'left',
+				animated: true,
 			})
-			await fireEvent.mouseOver(target) // fireEvent.mouseEnter only works if mouseOver is triggered before
-			await fireEvent.mouseEnter(target)
+			await _enterAndLeave()
+			expect(template).toBeInTheDocument()
+			await fireEvent.animationEnd(template.parentNode)
+			await _sleep(10)
+			expect(template).not.toBeInTheDocument()
+		})
 
-			expect(template.parentNode.style.left).not.toBe(left)
-			expect(template.parentNode.style.top).not.toBe(top)
+		it('Animates tooltip disappearance after update', async () => {
+			action = useTooltip(target, options)
+			action.update({
+				animated: true,
+			})
+			await _enterAndLeave()
+			expect(template).toBeInTheDocument()
+			await fireEvent.animationEnd(template.parentNode)
+			await _sleep(10)
+			expect(template).not.toBeInTheDocument()
 		})
 	})
 })
diff --git a/src/useTooltip.js b/src/useTooltip.js
index f189863..37cced8 100644
--- a/src/useTooltip.js
+++ b/src/useTooltip.js
@@ -14,6 +14,8 @@ const useTooltip = (
 		animated,
 		animationEnterClassName,
 		animationLeaveClassName,
+		enterDelay,
+		leaveDelay,
 		disabled,
 	}
 ) => {
@@ -28,6 +30,8 @@ const useTooltip = (
 		animated,
 		animationEnterClassName,
 		animationLeaveClassName,
+		enterDelay,
+		leaveDelay,
 		disabled
 	)
 
@@ -42,8 +46,10 @@ const useTooltip = (
 			animated: newAnimated,
 			animationEnterClassName: newAnimationEnterClassName,
 			animationLeaveClassName: newAnimationLeaveClassName,
+			enterDelay: newEnterDelay,
+			leaveDelay: newLeaveDelay,
 			disabled: newDisabled,
-		}) => {
+		}) =>
 			tooltip.update(
 				newContent,
 				newContentSelector,
@@ -54,12 +60,11 @@ const useTooltip = (
 				newAnimated,
 				newAnimationEnterClassName,
 				newAnimationLeaveClassName,
+				newEnterDelay,
+				newLeaveDelay,
 				newDisabled
-			)
-		},
-		destroy: () => {
-			tooltip.destroy()
-		},
+			),
+		destroy: () => tooltip.destroy(),
 	}
 }