Fix date filter brush bug (#11916)

frontend/src/metabase/visualizations/components/LineAreaBarChart.jsx

@@ -335,7 +335,7 @@ function transformSingleSeries(s, series, seriesIndex) {
   const { card, data } = s;
 
   // HACK: prevents cards from being transformed too many times
-  if (card._transformed) {
+  if (data._transformed) {
     return [s];
   }
 
@@ -396,7 +396,6 @@ function transformSingleSeries(s, series, seriesIndex) {
         ]
           .filter(n => n)
           .join(": "),
-        _transformed: true,
         _breakoutValue: breakoutValue,
         _breakoutColumn: cols[seriesColumnIndex],
       },
@@ -404,6 +403,7 @@ function transformSingleSeries(s, series, seriesIndex) {
         rows: breakoutRowsByValue.get(breakoutValue),
         cols: rowColumnIndexes.map(i => cols[i]),
         _rawCols: cols,
+        _transformed: true,
       },
       // for when the legend header for the breakout is clicked
       clicked: {
@@ -439,7 +439,6 @@ function transformSingleSeries(s, series, seriesIndex) {
         card: {
           ...card,
           name: name,
-          _transformed: true,
           _seriesIndex: seriesIndex,
           // use underlying column name as the seriesKey since it should be unique
           // EXCEPT for dashboard multiseries, so check seriesIndex == 0
@@ -453,6 +452,7 @@ function transformSingleSeries(s, series, seriesIndex) {
             return newRow;
           }),
           cols: rowColumnIndexes.map(i => cols[i]),
+          _transformed: true,
           _rawCols: cols,
         },
       };

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

+import { signInAsAdmin } from "__support__/cypress";
+
+describe("chart drill", () => {
+  beforeEach(signInAsAdmin);
+
+  it("should allow brush date filter", () => {
+    cy.visit("/question/new");
+    cy.contains("Simple question").click();
+    cy.contains("Sample Dataset").click();
+    cy.contains("Orders").click();
+    cy.contains("37.65");
+
+    // count by month created and product category
+    cy.contains("Summarize").click();
+    cy.contains("Summarize by")
+      .parent()
+      .parent()
+      .as("summarizeSidebar");
+
+    cy.get("@summarizeSidebar")
+      .contains("Created At")
+      .click();
+    cy.get("@summarizeSidebar")
+      .contains("Category")
+      .parent()
+      .find(".Icon-add")
+      .click({ force: true });
+
+    cy.contains("Done").click();
+
+    // wait for chart to expand and display legend/labels
+    cy.contains("Gadget");
+    cy.contains("January, 2017");
+    cy.wait(500); // wait longer to avoid grabbing the svg before a chart redraw
+
+    // drag across to filter
+    cy.get(".dc-chart svg")
+      .trigger("mousedown", 100, 200)
+      .trigger("mousemove", 200, 200)
+      .trigger("mouseup", 200, 200);
+
+    // new filter applied
+    cy.contains("Created At between June, 2016 October, 2016");
+    // more granular axis labels
+    cy.contains("June, 2016");
+    // confirm that product category is still broken out
+    cy.contains("Gadget");
+    cy.contains("Doohickey");
+    cy.contains("Gizmo");
+    cy.contains("Widget");
+  });
+});