Fixed: Tasks selection doesn't work in Chrome (#129)

Author: uve

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "powerbi-visuals-gantt",
-  "version": "1.14.2",
+  "version": "1.14.3",
   "description": "A Gantt chart is a type of bar chart which illustrates a project timeline or schedule. The Gantt Chart visual shows the Tasks, Start Dates, Durations, % Complete, and Resources for a project. The Gantt Chart visual can be used to show current schedule status using percent-complete shadings and a vertical \"TODAY\" line. The Legend may be used to group or filter tasks based upon data values.",
   "repository": {
     "type": "git",

package.json

@@ -1,10 +1,10 @@
 {
   "visual": {
     "name": "Gantt",
-    "displayName": "Gantt 1.14.2",
+    "displayName": "Gantt 1.14.3",
     "guid": "Gantt1448688115699",
     "visualClassName": "Gantt",
-    "version": "1.14.2",
+    "version": "1.14.3",
     "description": "A Gantt chart is a type of bar chart which illustrates a project timeline or schedule. The Gantt Chart visual shows the Tasks, Start Dates, Durations, % Complete, and Resources for a project. The Gantt Chart visual can be used to show current schedule status using percent-complete shadings and a vertical \"TODAY\" line. The Legend may be used to group or filter tasks based upon data values.",
     "supportUrl": "https://community.powerbi.com",
     "gitHubUrl": "https://github.com/Microsoft/powerbi-visuals-gantt"

pbiviz.json

@@ -73,7 +73,6 @@ module powerbi.extensibility.visual.behavior {
 
             options.taskSelection.on("click", (dataPoint: Task) => {
                 const event: MouseEvent = d3.event as MouseEvent;
-
                 selectionHandler.handleSelection(dataPoint, event.ctrlKey);
 
                 event.stopPropagation();

src/behavior.ts

@@ -176,6 +176,7 @@ module powerbi.extensibility.visual {
         export const TaskResource: ClassAndSelector = createClassAndSelector("task-resource");
         export const TaskLabels: ClassAndSelector = createClassAndSelector("task-labels");
         export const TaskLines: ClassAndSelector = createClassAndSelector("task-lines");
+        export const TaskLinesRect: ClassAndSelector = createClassAndSelector("task-lines-rect");
         export const CollapseAll: ClassAndSelector = createClassAndSelector("collapse-all");
         export const CollapseAllArrow: ClassAndSelector = createClassAndSelector("collapse-all-arrow");
         export const Label: ClassAndSelector = createClassAndSelector("label");
@@ -363,7 +364,9 @@ module powerbi.extensibility.visual {
 
             this.lineGroupWrapper = this.lineGroup
                 .append("rect")
+                .classed(Selectors.TaskLinesRect.className, true)
                 .attr("height", "100%")
+                .attr("width", "0")
                 .attr("fill", axisBackgroundColor)
                 .attr("y", this.margin.top);
 
@@ -1611,6 +1614,7 @@ module powerbi.extensibility.visual {
 
             } else {
                 this.lineGroupWrapper
+                    .attr("width", 0)
                     .attr("fill", "transparent");
 
                 this.collapseAllGroup

src/gantt.ts

@@ -116,6 +116,12 @@ module powerbi.extensibility.visual.test {
                 .children("rect.task-lines");
         }
 
+        public get taskLineRect() {
+            return this.mainElement
+                .children("g.task-lines")
+                .children("rect.task-lines-rect");
+        }
+
         public get taskLineBackgroundRect() {
             return this.taskLine
                 .children("rect");

test/visualBuilder.ts

@@ -332,7 +332,7 @@ module powerbi.extensibility.visual.test {
                     VisualData.ColumnType,
                     VisualData.ColumnStartDate,
                     VisualData.ColumnDuration,
-                    VisualData.ColumnCompletePercentage
+                    VisualData.ColumnCompletePercentage,
                     VisualData.ColumnResource]);
 
 
@@ -1562,6 +1562,7 @@ module powerbi.extensibility.visual.test {
                             show: true
                         }
                     };
+
                 });
 
                 it("show", (done) => {
@@ -1573,7 +1574,7 @@ module powerbi.extensibility.visual.test {
 
                     visualBuilder.updateRenderTimeout(dataView, () => {
                         expect(visualBuilder.taskLabels).toBeInDOM();
-
+                        expect(visualBuilder.taskLineRect.attr("width")).toEqual("110");
                         done();
                     });
                 });
@@ -1587,7 +1588,7 @@ module powerbi.extensibility.visual.test {
 
                     visualBuilder.updateRenderTimeout(dataView, () => {
                         expect(visualBuilder.taskLabels).not.toBeInDOM();
-
+                        expect(visualBuilder.taskLineRect.attr("width")).toEqual("0");
                         done();
                     });
                 });