diff --git a/devtools/client/inspector/markup/test/browser_markup_display_node_02.js b/devtools/client/inspector/markup/test/browser_markup_display_node_02.js index 9d1c065da278..c6c57c1c0018 100644 --- a/devtools/client/inspector/markup/test/browser_markup_display_node_02.js +++ b/devtools/client/inspector/markup/test/browser_markup_display_node_02.js @@ -45,6 +45,23 @@ const TEST_DATA = [ visible: false } }, + { + desc: "Reusing the 'grid' node, updating the display to 'grid again", + selector: "#grid", + before: { + visible: false + }, + changeStyle: async function(testActor) { + await testActor.eval(` + let node = document.getElementById("grid"); + node.style.display = "grid"; + `); + }, + after: { + textContent: "grid", + visible: true + } + }, { desc: "Showing a 'grid' node by changing its style property", selector: "#block", diff --git a/devtools/client/inspector/markup/views/element-editor.js b/devtools/client/inspector/markup/views/element-editor.js index e62c64a43241..fe552c95f482 100644 --- a/devtools/client/inspector/markup/views/element-editor.js +++ b/devtools/client/inspector/markup/views/element-editor.js @@ -282,6 +282,7 @@ ElementEditor.prototype = { const showEventBadge = this.node.hasEventListeners; if (this._eventBadge && !showEventBadge) { this._eventBadge.remove(); + this._eventBadge = null; } else if (showEventBadge && !this._eventBadge) { this._createEventBadge(); } @@ -304,6 +305,7 @@ ElementEditor.prototype = { const showDisplayBadge = this.node.displayType in DISPLAY_TYPES; if (this._displayBadge && !showDisplayBadge) { this._displayBadge.remove(); + this._displayBadge = null; } else if (showDisplayBadge) { if (!this._displayBadge) { this._createDisplayBadge(); @@ -339,6 +341,7 @@ ElementEditor.prototype = { const showCustomBadge = !!this.node.customElementLocation; if (this._customBadge && !showCustomBadge) { this._customBadge.remove(); + this._customBadge = null; } else if (!this._customBadge && showCustomBadge) { this._createCustomBadge(); }