Pass metadata-populated parameters to the embedded dashboard modal (#20383)

* Fix dashboard embedding locked parameter scripting err

We were not passing the embedding components the correct parameter
objects; instead of dashboard.parameters we need to pass the components
parameters that have had metadata added to them such as the fields they
are mapped to, as child parameters components now expect this metadata
to exist.

* Add e2e tests for embedded parameters

frontend/src/metabase/dashboard/containers/DashboardSharingEmbeddingModal.jsx

@@ -6,7 +6,7 @@ import cx from "classnames";
 import ModalWithTrigger from "metabase/components/ModalWithTrigger";
 
 import EmbedModalContent from "metabase/public/components/widgets/EmbedModalContent";
-
+import { getParameters } from "metabase/dashboard/selectors";
 import * as Urls from "metabase/lib/urls";
 import * as MetabaseAnalytics from "metabase/lib/analytics";
 
@@ -21,6 +21,10 @@ const defaultProps = {
   isLinkEnabled: true,
 };
 
+const mapStateToProps = (state, props) => ({
+  parameters: getParameters(state, props),
+});
+
 const mapDispatchToProps = {
   createPublicLink,
   deletePublicLink,
@@ -37,6 +41,7 @@ class DashboardSharingEmbeddingModal extends Component {
       className,
       createPublicLink,
       dashboard,
+      parameters,
       deletePublicLink,
       enabled,
       linkClassNames,
@@ -78,7 +83,7 @@ class DashboardSharingEmbeddingModal extends Component {
           {...props}
           className={className}
           resource={dashboard}
-          resourceParameters={dashboard && dashboard.parameters}
+          resourceParameters={parameters}
           resourceType="dashboard"
           onCreatePublicLink={() => createPublicLink(dashboard)}
           onDisablePublicLink={() => deletePublicLink(dashboard)}
@@ -102,6 +107,6 @@ class DashboardSharingEmbeddingModal extends Component {
 DashboardSharingEmbeddingModal.defaultProps = defaultProps;
 
 export default connect(
-  null,
+  mapStateToProps,
   mapDispatchToProps,
 )(DashboardSharingEmbeddingModal);

frontend/test/metabase/scenarios/dashboard/parameters-embedded.cy.spec.js

@@ -51,25 +51,98 @@ describe("scenarios > dashboard > parameters-embedded", () => {
     cy.request("PUT", `/api/setting/enable-public-sharing`, { value: true });
   });
 
-  describe("embeded params", () => {
-    it.skip("should be hideable", () => {
-      // Check viewable
+  describe("embedded parameters", () => {
+    it("should be disabled by default but able to be set to editable", () => {
       cy.visit("/dashboard/2");
       cy.icon("share").click();
+      cy.findByText("Sharing and embedding").click();
       cy.findByText("Embed this dashboard in an application").click();
 
-      cy.findByText("Parameters");
       cy.get(".Modal--full").within(() => {
-        cy.findByText("Id");
-        cy.findByText("User");
+        // verify that all the parameters on the dashboard are defaulted to disabled
         cy.findAllByText("Disabled").should("have.length", 4);
+
+        // select the dropdown next to the Id parameter so that we can set it to editable
+        cy.findByText("Id")
+          .parent()
+          .within(() => {
+            cy.findByText("Disabled").click();
+          });
+      });
+
+      cy.findByText("Editable").click();
+
+      // publish the embedded dashboard so that we can directly navigate to its url
+      cy.findByText("Publish").click();
+
+      // directly navigate to the embedded dashboard
+      cy.document().then(doc => {
+        const iframe = doc.querySelector("iframe");
+        cy.visit(iframe.src);
       });
 
-      // Check hideable
-      cy.visit("/dashboard/2#hide_parameters=id%2Cname");
-      cy.reload();
-      cy.findByText("User");
+      // verify that only the Id parameter shows up and is editable
       cy.findByText("Name").should("not.exist");
+      cy.findByText("Source").should("not.exist");
+      cy.findByText("User").should("not.exist");
+      cy.findByText("Id").click();
+
+      popover().within(() => {
+        cy.get("input").type("1{enter}3{enter}");
+        cy.findByText("Add filter").click();
+      });
+
+      // verify that the dashcard shows the correct, filtered value
+      cy.get(".Card").within(() => {
+        cy.contains("2");
+      });
+    });
+
+    it("should let parameters be locked to a specific value", () => {
+      cy.visit("/dashboard/2");
+      cy.icon("share").click();
+      cy.findByText("Sharing and embedding").click();
+      cy.findByText("Embed this dashboard in an application").click();
+
+      cy.findByText("Parameters");
+      cy.get(".Modal--full").within(() => {
+        cy.findAllByText("Disabled").should("have.length", 4);
+
+        // select the dropdown next to the Id parameter so that we can set it to locked
+        cy.findByText("Id")
+          .parent()
+          .within(() => {
+            cy.findByText("Disabled").click();
+          });
+      });
+
+      cy.findByText("Locked").click();
+
+      // set the locked parameter's value
+      cy.findByText("Preview Locked Parameters")
+        .parent()
+        .within(() => {
+          cy.findByText("Id").click();
+        });
+      popover().within(() => {
+        cy.get("input").type("1{enter}3{enter}");
+      });
+      cy.findByText("Add filter").click();
+
+      // publish the embedded dashboard so that we can directly navigate to its url
+      cy.findByText("Publish").click();
+
+      // directly navigate to the embedded dashboard
+      cy.document().then(doc => {
+        const iframe = doc.querySelector("iframe");
+        cy.visit(iframe.src);
+      });
+
+      // verify that the Id parameter doesn't show up but that its value is reflected in the dashcard
+      cy.findByText("Id").should("not.exist");
+      cy.get(".Card").within(() => {
+        cy.contains("2");
+      });
     });
   });