From dc0edc597fa004062f367473df122e8b2a49cbd9 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Mon, 8 Feb 2021 11:01:30 -0500
Subject: [PATCH] Fix target logic

---
 src/components.d.ts                | 4 ++--
 src/components/tooltip/tooltip.tsx | 8 ++++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components.d.ts b/src/components.d.ts
index d172d3dae..920e32b43 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -1303,7 +1303,7 @@ export namespace Components {
     }
     interface SlTooltip {
         /**
-          * The tooltip's content.
+          * The tooltip's content. Alternatively, you can use the content slot.
          */
         "content": string;
         /**
@@ -3001,7 +3001,7 @@ declare namespace LocalJSX {
     }
     interface SlTooltip {
         /**
-          * The tooltip's content.
+          * The tooltip's content. Alternatively, you can use the content slot.
          */
         "content"?: string;
         /**
diff --git a/src/components/tooltip/tooltip.tsx b/src/components/tooltip/tooltip.tsx
index 0bb129903..30fc2aae0 100644
--- a/src/components/tooltip/tooltip.tsx
+++ b/src/components/tooltip/tooltip.tsx
@@ -28,7 +28,7 @@ export class Tooltip {
 
   @Element() host: HTMLSlTooltipElement;
 
-  /** The tooltip's content. */
+  /** The tooltip's content. Alternatively, you can use the content slot. */
   @Prop() content = '';
 
   /**
@@ -162,7 +162,11 @@ export class Tooltip {
   }
 
   getTarget() {
-    const target = this.host.querySelector('*:not(style)') as HTMLElement;
+    // Get the first child that isn't a <style> or content slot
+    const target = [...this.host.children].find(
+      el => el.tagName.toLowerCase() !== 'style' && el.getAttribute('slot') !== 'content'
+    ) as HTMLElement;
+
     if (!target) {
       throw new Error('Invalid tooltip target: no child element was found.');
     }