Close modal when unmounting QB (#11707)

* close modal when unmounting QB

* add test

frontend/src/metabase/query_builder/containers/QueryBuilder.jsx

@@ -218,6 +218,8 @@ export default class QueryBuilder extends Component {
     window.removeEventListener("resize", this.handleResize);
 
     clearTimeout(this.timeout);
+
+    this.closeModal(); // close any modal that might be open
   }
 
   // When the window is resized we need to re-render, mainly so that our visualization pane updates

frontend/test/metabase/scenarios/query_builder.cy.spec.js

@@ -133,6 +133,29 @@ describe("query builder", () => {
         .should("not.exist");
     });
   });
+
+  describe("resetting state", () => {
+    it("should reset modal state when navigating away", () => {
+      // create a question and add it to a modal
+      loadOrdersTable();
+      cy.contains("Save").click();
+      cy.get(".ModalContent")
+        .contains("button", "Save")
+        .click();
+      cy.contains("Yes please!").click();
+      cy.contains("Orders over time").click();
+
+      // create a new question to see if the "add to a dashboard" modal is still there
+      cy.contains("Browse Data").click();
+      cy.contains("Sample Dataset").click();
+      cy.contains("Orders").click();
+
+      // This next assertion might not catch bugs where the modal displays after
+      // a quick delay. With the previous presentation of this bug, the modal
+      // was immediately visible, so I'm not going to add any waits.
+      cy.contains("Add this question to a dashboard").should("not.exist");
+    });
+  });
 });
 
 function loadOrdersTable() {