diff --git a/src/components/legend/draw.js b/src/components/legend/draw.js index f1fa5a4723c..096f4eff4fe 100644 --- a/src/components/legend/draw.js +++ b/src/components/legend/draw.js @@ -514,7 +514,9 @@ function handleClick(g, gd, numClicks) { allTraces.push(i); // Allow the legendonly state through for *all* trace types (including // carpet for which it's overridden with true/false in supplyDefaults) - traceVisibility.push('legendonly'); + traceVisibility.push( + Registry.traceIs(fullData[i], 'notLegendIsolatable') ? true : 'legendonly' + ); } if(legendgroup === '') { diff --git a/test/jasmine/tests/legend_test.js b/test/jasmine/tests/legend_test.js index 7cb4f06974b..5f546fa277f 100644 --- a/test/jasmine/tests/legend_test.js +++ b/test/jasmine/tests/legend_test.js @@ -650,9 +650,9 @@ describe('legend interaction', function() { done(); }); }); - afterAll(function() { - destroyGraphDiv(); - }); + + afterAll(destroyGraphDiv); + describe('single click', function() { it('should hide slice', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); @@ -663,9 +663,11 @@ describe('legend interaction', function() { done(); }, DBLCLICKDELAY + 20); }); + it('should fade legend item', function() { expect(+legendItem.parentNode.style.opacity).toBeLessThan(1); }); + it('should unhide slice', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); legendItem.dispatchEvent(new MouseEvent('mouseup')); @@ -674,6 +676,7 @@ describe('legend interaction', function() { done(); }, DBLCLICKDELAY + 20); }); + it('should unfade legend item', function() { expect(+legendItem.parentNode.style.opacity).toBe(1); }); @@ -691,6 +694,7 @@ describe('legend interaction', function() { done(); }, 20); }); + it('should fade other legend items', function() { var legendItemi; for(var i = 0; i < legendItems.length; i++) { @@ -702,6 +706,7 @@ describe('legend interaction', function() { } } }); + it('should unhide all slices', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); legendItem.dispatchEvent(new MouseEvent('mouseup')); @@ -712,6 +717,7 @@ describe('legend interaction', function() { done(); }, 20); }); + it('should unfade legend items', function() { var legendItemi; for(var i = 0; i < legendItems.length; i++) { @@ -721,6 +727,7 @@ describe('legend interaction', function() { }); }); }); + describe('non-pie chart', function() { var mockCopy, gd, legendItems, legendItem; var testEntry = 2; @@ -736,9 +743,8 @@ describe('legend interaction', function() { done(); }); }); - afterAll(function() { - destroyGraphDiv(); - }); + + afterAll(destroyGraphDiv); describe('single click', function() { it('should hide series', function(done) { @@ -749,9 +755,11 @@ describe('legend interaction', function() { done(); }, DBLCLICKDELAY + 20); }); + it('should fade legend item', function() { expect(+legendItem.parentNode.style.opacity).toBeLessThan(1); }); + it('should unhide series', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); legendItem.dispatchEvent(new MouseEvent('mouseup')); @@ -760,10 +768,12 @@ describe('legend interaction', function() { done(); }, DBLCLICKDELAY + 20); }); + it('should unfade legend item', function() { expect(+legendItem.parentNode.style.opacity).toBe(1); }); }); + describe('double click', function() { it('should hide series', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); @@ -781,6 +791,7 @@ describe('legend interaction', function() { done(); }, 20); }); + it('should fade legend item', function() { var legendItemi; for(var i = 0; i < legendItems.length; i++) { @@ -792,6 +803,7 @@ describe('legend interaction', function() { } } }); + it('should unhide series', function(done) { legendItem.dispatchEvent(new MouseEvent('mousedown')); legendItem.dispatchEvent(new MouseEvent('mouseup')); @@ -804,6 +816,7 @@ describe('legend interaction', function() { done(); }, 20); }); + it('should unfade legend items', function() { var legendItemi; for(var i = 0; i < legendItems.length; i++) { @@ -813,4 +826,60 @@ describe('legend interaction', function() { }); }); }); + + describe('carpet plots', function() { + afterAll(destroyGraphDiv); + + function _click(index) { + var item = d3.selectAll('rect.legendtoggle')[0][index || 0]; + return new Promise(function(resolve) { + item.dispatchEvent(new MouseEvent('mousedown')); + item.dispatchEvent(new MouseEvent('mouseup')); + setTimeout(resolve, DBLCLICKDELAY + 20); + }); + } + + function _dblclick(index) { + var item = d3.selectAll('rect.legendtoggle')[0][index || 0]; + return new Promise(function(resolve) { + item.dispatchEvent(new MouseEvent('mousedown')); + item.dispatchEvent(new MouseEvent('mouseup')); + item.dispatchEvent(new MouseEvent('mousedown')); + item.dispatchEvent(new MouseEvent('mouseup')); + setTimeout(resolve, 20); + }); + } + + function assertVisible(gd, expectation) { + var actual = gd._fullData.map(function(trace) { return trace.visible; }); + expect(actual).toEqual(expectation); + } + + it('should ignore carpet traces when toggling', function(done) { + var _mock = Lib.extendDeep({}, require('@mocks/cheater.json')); + var gd = createGraphDiv(); + + Plotly.plot(gd, _mock).then(function() { + assertVisible(gd, [true, true, true, true]); + }) + .then(_click) + .then(function() { + assertVisible(gd, [true, 'legendonly', true, true]); + }) + .then(_click) + .then(function() { + assertVisible(gd, [true, true, true, true]); + }) + .then(_dblclick) + .then(function() { + assertVisible(gd, [true, true, 'legendonly', 'legendonly']); + }) + .then(_dblclick) + .then(function() { + assertVisible(gd, [true, true, true, true]); + }) + .catch(fail) + .then(done); + }); + }); });