Fix legend alignment issue in Chrome, many thanks @Spacarar, see dc-j…

…s#1852, dc-js#1855, dc-js#1856
kum-deepak · Feb 14, 2022 · b110c0a · b110c0a
1 parent cb0027c
commit b110c0a
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 5 deletions.
diff --git a/spec/legend-spec.js b/spec/legend-spec.js
@@ -53,8 +53,7 @@ describe('dc.legend', () => {
             expect(chart.selectAll('g.dc-legend g.dc-legend-item text').size()).toBe(3);
         });
 
-        // The following test has started failing on Chrome Headless 96.0.4664.110
-        xit('should position the legend labels', () => {
+        it('should position the legend labels', () => {
             expect(legendLabel(0).attr('x')).toBeWithinDelta(15, 2);
             expect(legendLabel(0).attr('y')).toBeWithinDelta(11.75, 2);
             expect(legendLabel(1).attr('x')).toBeWithinDelta(15, 2);

diff --git a/src/charts/legend.ts b/src/charts/legend.ts
@@ -289,9 +289,8 @@ export class Legend {
                 .text(self._legendText)
                 .attr('x', self._itemHeight + LABEL_GAP)
                 .attr('y', function () {
-                    return (
-                        self._itemHeight / 2 + (this.clientHeight ? this.clientHeight : 13) / 2 - 2
-                    );
+                    const clientHeight = this.getBoundingClientRect().height || 13;
+                    return self._itemHeight / 2 + clientHeight / 2 - 2;
                 });
         }