--- a/devtools/client/inspector/markup/test/helper_events_test_runner.js
+++ b/devtools/client/inspector/markup/test/helper_events_test_runner.js
@@ -108,22 +108,28 @@ function* checkEventsForNode(test, inspe
     is(attributes.length, expected[i].attributes.length,
        "we have the correct number of attributes");
 
     for (let j = 0; j < expected[i].attributes.length; j++) {
       is(attributes[j].textContent, expected[i].attributes[j],
          "attribute[" + j + "] matches for " + cssSelector);
     }
 
+    is(header.classList.contains("content-expanded"), false,
+        "We are not in expanded state");
+
     // Make sure the header is not hidden by scrollbars before clicking.
     header.scrollIntoView();
 
     EventUtils.synthesizeMouseAtCenter(header, {}, type.ownerGlobal);
     yield tooltip.once("event-tooltip-ready");
 
+    is(header.classList.contains("content-expanded"), true,
+        "We are in expanded state and icon changed");
+
     let editor = tooltip.eventTooltip._eventEditors.get(contentBox).editor;
     testDiff(editor.getText(), expected[i].handler,
        "handler matches for " + cssSelector, ok);
   }
 
   tooltip.hide();
 }
 

--- a/devtools/client/jar.mn
+++ b/devtools/client/jar.mn
@@ -183,16 +183,17 @@ devtools.jar:
     skin/images/geometry-editor.svg (themes/images/geometry-editor.svg)
     skin/images/pause.svg (themes/images/pause.svg)
     skin/images/play.svg (themes/images/play.svg)
     skin/images/rewind.svg (themes/images/rewind.svg)
     skin/images/debugger-step-in.svg (themes/images/debugger-step-in.svg)
     skin/images/debugger-step-out.svg (themes/images/debugger-step-out.svg)
     skin/images/debugger-step-over.svg (themes/images/debugger-step-over.svg)
     skin/images/debugger-toggleBreakpoints.svg (themes/images/debugger-toggleBreakpoints.svg)
+    skin/images/jump-definition.svg (themes/images/jump-definition.svg)
     skin/images/tracer-icon.png (themes/images/tracer-icon.png)
     skin/images/tracer-icon@2x.png (themes/images/tracer-icon@2x.png)
     skin/images/toggle-tools.png (themes/images/toggle-tools.png)
     skin/images/toggle-tools@2x.png (themes/images/toggle-tools@2x.png)
     skin/images/dock-bottom.svg (themes/images/dock-bottom.svg)
     skin/images/dock-side.svg (themes/images/dock-side.svg)
     skin/images/dock-undock.svg (themes/images/dock-undock.svg)
     skin/floating-scrollbars-dark-theme.css (themes/floating-scrollbars-dark-theme.css)

--- a/devtools/client/shared/widgets/tooltip/EventTooltipHelper.js
+++ b/devtools/client/shared/widgets/tooltip/EventTooltipHelper.js
@@ -74,30 +74,16 @@ EventTooltip.prototype = {
       // Create this early so we can refer to it from a closure, below.
       let content = doc.createElementNS(XHTML_NS, "div");
 
       // Header
       let header = doc.createElementNS(XHTML_NS, "div");
       header.className = "event-header devtools-toolbar";
       this.container.appendChild(header);
 
-      if (!listener.hide.debugger) {
-        let debuggerIcon = doc.createElementNS(XHTML_NS, "img");
-        debuggerIcon.className = "event-tooltip-debugger-icon";
-        debuggerIcon.setAttribute("src",
-          "chrome://devtools/skin/images/tool-debugger.svg");
-        let openInDebugger = L10N.getStr("eventsTooltip.openInDebugger");
-        debuggerIcon.setAttribute("title", openInDebugger);
-        header.appendChild(debuggerIcon);
-      } else {
-        let debuggerDiv = doc.createElementNS(XHTML_NS, "div");
-        debuggerDiv.className = "event-tooltip-debugger-spacer";
-        header.appendChild(debuggerDiv);
-      }
-
       if (!listener.hide.type) {
         let eventTypeLabel = doc.createElementNS(XHTML_NS, "span");
         eventTypeLabel.className = "event-tooltip-event-type";
         eventTypeLabel.textContent = listener.type;
         eventTypeLabel.setAttribute("title", listener.type);
         header.appendChild(eventTypeLabel);
       }
 
@@ -138,16 +124,26 @@ EventTooltip.prototype = {
           });
         }
       }
 
       filename.textContent = text;
       filename.setAttribute("title", title);
       header.appendChild(filename);
 
+      if (!listener.hide.debugger) {
+        let debuggerIcon = doc.createElementNS(XHTML_NS, "img");
+        debuggerIcon.className = "event-tooltip-debugger-icon";
+        debuggerIcon.setAttribute("src",
+          "chrome://devtools/skin/images/jump-definition.svg");
+        let openInDebugger = L10N.getStr("eventsTooltip.openInDebugger");
+        debuggerIcon.setAttribute("title", openInDebugger);
+        header.appendChild(debuggerIcon);
+      }
+
       let attributesContainer = doc.createElementNS(XHTML_NS, "div");
       attributesContainer.className = "event-tooltip-attributes-container";
       header.appendChild(attributesContainer);
 
       if (!listener.hide.capturing) {
         let attributesBox = doc.createElementNS(XHTML_NS, "div");
         attributesBox.className = "event-tooltip-attributes-box";
         attributesContainer.appendChild(attributesBox);
@@ -214,16 +210,17 @@ EventTooltip.prototype = {
       this._debugClicked(event);
       event.stopPropagation();
       return;
     }
 
     let doc = this._tooltip.doc;
     let header = event.currentTarget;
     let content = header.nextElementSibling;
+    header.classList.toggle("content-expanded");
 
     if (content.hasAttribute("open")) {
       content.removeAttribute("open");
     } else {
       let contentNodes = doc.querySelectorAll(".event-tooltip-content-box");
 
       for (let node of contentNodes) {
         if (node !== content) {

new file mode 100644
--- /dev/null
+++ b/devtools/client/themes/images/jump-definition.svg
@@ -0,0 +1,8 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" stroke="context-stroke" fill="none" stroke-linecap="round">
+  <path d="M5.5 3.5l2 2M5.5 7.5l2-2"/>
+  <path d="M7 5.5H4.006c-1.012 0-1.995 1.017-2.011 2.024-.005.023-.005 1.347 0 3.971" stroke-linejoin="round"/>
+  <path d="M10.5 5.5h4M9.5 3.5h5M9.5 7.5h5"/>
+</svg>
\ No newline at end of file

--- a/devtools/client/themes/tooltips.css
+++ b/devtools/client/themes/tooltips.css
@@ -263,24 +263,38 @@
 
 .event-header {
   display: flex;
   align-items: center;
   cursor: pointer;
   overflow: hidden;
 }
 
+.event-header:before {
+  content: "▶︎";
+  padding-inline-end: 5px;
+}
+
+.event-header.content-expanded:before {
+  content: "▼";
+}
+
 .event-header:first-child {
   border-width: 0;
 }
 
 .event-header:not(:first-child) {
   border-width: 1px 0 0 0;
 }
 
+.event-tooltip-debugger-icon {
+  -moz-context-properties: stroke;
+   stroke: currentColor;
+}
+
 .devtools-tooltip-events-container {
   height: 100%;
   overflow-y: auto;
 }
 
 .event-tooltip-event-type,
 .event-tooltip-filename,
 .event-tooltip-attributes {