@@ -544,69 +544,71 @@ describe('legend relayout update', function() {
544
544
describe ( 'legend orientation change:' , function ( ) {
545
545
'use strict' ;
546
546
547
- var mock = require ( '@mocks/legend_horizontal_autowrap.json' ) ,
548
- gd ,
549
- node ;
550
-
551
- beforeEach ( function ( done ) {
552
- gd = createGraphDiv ( ) ;
553
- Plotly . plot ( gd , mock . data , mock . layout ) . then ( function ( ) {
554
- node = d3 . select ( 'g.legend' ) . select ( 'rect' ) ;
555
- done ( ) ;
556
- } ) ;
557
- } ) ;
558
-
559
547
afterEach ( destroyGraphDiv ) ;
560
548
561
- it ( 'horizontal with lots of items wraps traces to new lines' , function ( done ) {
562
- var nw = node . property ( 'width' ) . baseVal . value ;
563
- var gw = mock . layout . width ;
564
- var maxTraceHeight = 0 ,
565
- maxTraceWidth = 0 ,
566
- maxOffsetX = 0 ,
567
- maxOffsetY = 0 ,
568
- traceGap = gd . _fullLayout . legend . tracegroupgap || 5 ;
569
-
570
- d3 . selectAll ( 'g.legend g.traces' ) . each ( function ( ) {
571
- var b = d3 . select ( this ) . select ( 'text' ) . node ( ) . getBBox ( ) ,
572
- w = b . width + traceGap + 40 ,
573
- h = d3 . select ( this ) . node ( ) . getBBox ( ) . height ,
574
- t = d3 . transform ( d3 . select ( this ) . attr ( 'transform' ) ) ;
575
- //console.log(t.translate[0], t.translate[1], w, h);
576
- maxOffsetX = Math . max ( maxOffsetX , t . translate [ 0 ] ) ;
577
- maxOffsetY = Math . max ( maxOffsetY , t . translate [ 1 ] ) ;
578
- maxTraceWidth = Math . max ( maxTraceWidth , w ) ;
579
- maxTraceHeight = Math . max ( maxTraceHeight , h ) ;
580
- } ) ;
581
-
582
- //legend rect less than width of plot
583
- expect ( nw ) . toBeLessThan ( gw ) ;
584
- expect ( maxTraceHeight ) . toBeGreaterThan ( 0 ) ;
585
- expect ( maxTraceWidth ) . toBeGreaterThan ( 0 ) ;
586
- expect ( maxOffsetX ) . toBeGreaterThan ( 0 ) ;
587
- expect ( maxOffsetY ) . toBeGreaterThan ( 0 ) ;
549
+ it ( 'should update legend orientation' , function ( done ) {
550
+ var mock = require ( '@mocks/legend_horizontal_autowrap.json' ) ,
551
+ gd = createGraphDiv ( ) ,
552
+ initialLegendY = mock . layout . legend . y ;
588
553
589
- //none of the traces are pushed off the graph
590
- expect ( maxOffsetX ) . toBeLessThan ( mock . layout . width ) ;
591
- expect ( maxOffsetY ) . toBeLessThan ( mock . layout . height ) ;
592
-
593
- done ( ) ;
594
- } ) ;
554
+ Plotly . plot ( gd , mock . data , mock . layout ) . then ( function ( ) {
555
+ var node = d3 . select ( 'g.legend' ) . select ( 'rect' ) ,
556
+ nw = node . property ( 'width' ) . baseVal . value ,
557
+ gw = mock . layout . width ,
558
+ maxTraceHeight = 0 ,
559
+ maxTraceWidth = 0 ,
560
+ maxOffsetX = 0 ,
561
+ maxOffsetY = 0 ,
562
+ traceGap = gd . _fullLayout . legend . tracegroupgap || 5 ;
563
+
564
+ d3 . selectAll ( 'g.legend g.traces' ) . each ( function ( ) {
565
+ var b = d3 . select ( this ) . select ( 'text' ) . node ( ) . getBBox ( ) ,
566
+ w = b . width + traceGap + 40 ,
567
+ h = d3 . select ( this ) . node ( ) . getBBox ( ) . height ,
568
+ t = d3 . transform ( d3 . select ( this ) . attr ( 'transform' ) ) ;
569
+ //console.log(t.translate[0], t.translate[1], w, h);
570
+ maxOffsetX = Math . max ( maxOffsetX , t . translate [ 0 ] ) ;
571
+ maxOffsetY = Math . max ( maxOffsetY , t . translate [ 1 ] ) ;
572
+ maxTraceWidth = Math . max ( maxTraceWidth , w ) ;
573
+ maxTraceHeight = Math . max ( maxTraceHeight , h ) ;
574
+ } ) ;
595
575
596
- it ( 'changing to vertical orientation' , function ( done ) {
597
- //change mock layout and refresh graph
598
- mock . layout . legend . orientation = 'v' ;
599
- mock . layout . legend . y = 1 ;
600
- done ( ) ;
576
+ //legend rect less than width of plot
577
+ expect ( nw ) . toBeLessThan ( gw ) ;
578
+ expect ( maxTraceHeight ) . toBeGreaterThan ( 0 ) ;
579
+ expect ( maxTraceWidth ) . toBeGreaterThan ( 0 ) ;
580
+ expect ( maxOffsetX ) . toBeGreaterThan ( 0 ) ;
581
+ expect ( maxOffsetY ) . toBeGreaterThan ( 0 ) ;
582
+
583
+ //none of the traces are pushed off the graph
584
+ expect ( maxOffsetX ) . toBeLessThan ( mock . layout . width ) ;
585
+ expect ( maxOffsetY ) . toBeLessThan ( mock . layout . height ) ;
586
+
587
+ //update mock
588
+ mock . layout . legend . orientation = 'v' ;
589
+ mock . layout . legend . y = 1 ;
590
+ //re-graph
591
+ destroyGraphDiv ( gd ) ;
592
+ gd = createGraphDiv ( ) ;
593
+ return Plotly . plot ( gd , mock . data , mock . layout ) ;
594
+ } ) . then ( function ( ) {
595
+ expect ( gd . _fullLayout . legend . orientation ) . toBe ( 'v' ) ;
596
+ //scrollbar has width and height now
597
+ var bbox = d3 . select ( 'rect.scrollbar' ) . node ( ) . getBBox ( ) ;
598
+ expect ( bbox . width ) . toBeGreaterThan ( 0 ) ;
599
+ expect ( bbox . height ) . toBeGreaterThan ( 0 ) ;
600
+ //update mock and re-graph
601
+ mock . layout . legend . orientation = 'h' ;
602
+ mock . layout . legend . y = initialLegendY ;
603
+ destroyGraphDiv ( gd ) ;
604
+ gd = createGraphDiv ( ) ;
605
+ return Plotly . plot ( gd , mock . data , mock . layout ) ;
606
+ } ) . then ( function ( ) {
607
+ //back to base case
608
+ expect ( gd . _fullLayout . legend . orientation ) . toBe ( 'h' ) ;
609
+ expect ( gd . _fullLayout . legend . y ) . toBe ( initialLegendY ) ;
610
+ done ( ) ;
611
+ } ) ;
601
612
} ) ;
602
613
603
- it ( 'changed to vertical, scrollbar appeared' , function ( done ) {
604
- //changed orientation to vertical
605
- expect ( gd . _fullLayout . legend . orientation ) . toBe ( 'v' ) ;
606
- //scrollbar has width and height now
607
- var bbox = d3 . select ( 'rect.scrollbar' ) . node ( ) . getBBox ( ) ;
608
- expect ( bbox . width ) . toBeGreaterThan ( 0 ) ;
609
- expect ( bbox . height ) . toBeGreaterThan ( 0 ) ;
610
- done ( ) ;
611
- } ) ;
612
614
} ) ;
0 commit comments