Common interface to interpret and execute API methods

src/components/sliders/draw.js

@@ -359,7 +359,6 @@ function handleInput(gd, sliderGroup, sliderOpts, normalizedPosition, doTransiti
     var quantizedPosition = Math.round(normalizedPosition * (sliderOpts.steps.length - 1));
 
     if(quantizedPosition !== sliderOpts.active) {
-
         setActive(gd, sliderGroup, sliderOpts, quantizedPosition, true, doTransition);
     }
 }

src/components/updatemenus/defaults.js

@@ -33,6 +33,8 @@ module.exports = function updateMenusDefaults(layoutIn, layoutOut) {
         // used to determine object constancy
         menuOut._index = i;
 
+        menuOut._input.active = menuOut.active;
+
         contOut.push(menuOut);
     }
 };
@@ -48,7 +50,9 @@ function menuDefaults(menuIn, menuOut, layoutOut) {
     var visible = coerce('visible', buttons.length > 0);
     if(!visible) return;
 
-    coerce('active');
+    // Default to zero since active must be *something*:
+    coerce('active', 0);
+
     coerce('direction');
     coerce('type');
     coerce('showactive');

test/jasmine/tests/command_test.js

@@ -525,21 +525,21 @@ describe('attaching component bindings', function() {
         destroyGraphDiv(gd);
     });
 
-    it('attaches bindings when events are added', function(done) {
+    it('attaches and updates bindings for sliders', function(done) {
         expect(gd._internalEv._events.plotly_animatingframe).toBeUndefined();
 
         Plotly.relayout(gd, {
             sliders: [{
                 // This one gets bindings:
                 steps: [
                     {label: 'first', method: 'restyle', args: ['marker.color', 'red']},
-                    {label: 'first', method: 'restyle', args: ['marker.color', 'blue']},
+                    {label: 'second', method: 'restyle', args: ['marker.color', 'blue']},
                 ]
             }, {
                 // This one does *not*:
                 steps: [
                     {label: 'first', method: 'restyle', args: ['line.color', 'red']},
-                    {label: 'first', method: 'restyle', args: ['marker.color', 'blue']},
+                    {label: 'second', method: 'restyle', args: ['marker.color', 'blue']},
                 ]
             }]
         }).then(function() {
@@ -577,4 +577,57 @@ describe('attaching component bindings', function() {
             expect(gd._internalEv._events.plotly_animatingframe).toBeUndefined();
         }).catch(fail).then(done);
     });
+
+    it('attaches and updates bindings for updatemenus', function(done) {
+        expect(gd._internalEv._events.plotly_animatingframe).toBeUndefined();
+
+        Plotly.relayout(gd, {
+            updatemenus: [{
+                // This one gets bindings:
+                buttons: [
+                    {label: 'first', method: 'restyle', args: ['marker.color', 'red']},
+                    {label: 'second', method: 'restyle', args: ['marker.color', 'blue']},
+                ]
+            }, {
+                // This one does *not*:
+                buttons: [
+                    {label: 'first', method: 'restyle', args: ['line.color', 'red']},
+                    {label: 'second', method: 'restyle', args: ['marker.color', 'blue']},
+                ]
+            }]
+        }).then(function() {
+            // Check that it has attached a listener:
+            expect(typeof gd._internalEv._events.plotly_animatingframe).toBe('function');
+
+            // Confirm the first position is selected:
+            expect(gd.layout.updatemenus[0].active).toBe(0);
+
+            // Modify the plot
+            return Plotly.restyle(gd, {'marker.color': 'blue'});
+        }).then(function() {
+            // Confirm that this has changed the slider position:
+            expect(gd.layout.updatemenus[0].active).toBe(1);
+
+            // Swap the values of the components:
+            return Plotly.relayout(gd, {
+                'updatemenus[0].buttons[0].args[1]': 'green',
+                'updatemenus[0].buttons[1].args[1]': 'red'
+            });
+        }).then(function() {
+            return Plotly.restyle(gd, {'marker.color': 'green'});
+        }).then(function() {
+            // Confirm that the lookup table has been updated:
+            expect(gd.layout.updatemenus[0].active).toBe(0);
+
+            // Check that it still has one attached listener:
+            expect(typeof gd._internalEv._events.plotly_animatingframe).toBe('function');
+
+            // Change this to a non-simple binding:
+            return Plotly.relayout(gd, {'updatemenus[0].buttons[0].args[0]': 'line.color'});
+        }).then(function() {
+            // Bindings are no longer simple, so check to ensure they have
+            // been removed
+            expect(gd._internalEv._events.plotly_animatingframe).toBeUndefined();
+        }).catch(fail).then(done);
+    });
 });