diff --git a/beta/src/components/MDX/ExpandableExample.tsx b/beta/src/components/MDX/ExpandableExample.tsx
index bb061062..435f9142 100644
--- a/beta/src/components/MDX/ExpandableExample.tsx
+++ b/beta/src/components/MDX/ExpandableExample.tsx
@@ -30,11 +30,7 @@ function ExpandableExample({
     <details
       open={isExpanded}
       onToggle={(e: any) => {
-        setIsExpanded(e.target!.open);
-      }}
-      onClick={(e) => {
-        // We toggle using a button instead of this whole area.
-        e.preventDefault();
+        setIsExpanded(e.currentTarget!.open);
       }}
       className={cn('my-12 rounded-lg shadow-inner relative', {
         'dark:bg-opacity-20 dark:bg-purple-60 bg-purple-5': isDeepDive,
@@ -42,7 +38,11 @@ function ExpandableExample({
       })}>
       <summary
         className="list-none p-8"
-        tabIndex={-1 /* there's a button instead */}>
+        tabIndex={-1 /* there's a button instead */}
+        onClick={(e) => {
+          // We toggle using a button instead of this whole area.
+          e.preventDefault();
+        }}>
         <h5
           className={cn('mb-4 uppercase font-bold flex items-center text-sm', {
             'dark:text-purple-30 text-purple-50': isDeepDive,