Set accessibility attributes when children change & changelog

Shopify · Jan 6, 2020 · caece76 · caece76
1 parent 6b6a332
commit caece76
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 7 deletions.
diff --git a/UNRELEASED.md b/UNRELEASED.md
@@ -26,5 +26,6 @@
 
 - Converted `BulkActionButton` into a functional component ([#2542](https://github.com/Shopify/polaris-react/pull/2542))
 - Converted `Focus` into a functional component ([#2540](https://github.com/Shopify/polaris-react/pull/2540))
+- Converted `Tooltip` into a functional component ([#2543](https://github.com/Shopify/polaris-react/pull/2543))
 
 ### Deprecations
diff --git a/src/components/Tooltip/Tooltip.tsx b/src/components/Tooltip/Tooltip.tsx
@@ -47,8 +47,7 @@ export function Tooltip({
   const activatorContainer = useRef<HTMLElement>(null);
   const mouseEntered = useRef(false);
 
-  // Check this impl
-  const setAccessibilityAttributes = useCallback(() => {
+  useEffect(() => {
     if (activatorContainer == null) {
       return;
     }
@@ -62,11 +61,7 @@ export function Tooltip({
 
     accessibilityNode.tabIndex = 0;
     accessibilityNode.setAttribute('aria-describedby', id);
-  }, [id]);
-
-  useEffect(() => {
-    setAccessibilityAttributes();
-  }, [setAccessibilityAttributes]);
+  }, [id, children]);
 
   const portal = activatorNode ? (
     <Portal idPrefix="tooltip">